/* Ojerk V17 — premium model bonus CTA, tag SEO block and richer homepage guide. */

.oj-v17-bonus-cta{
  position:relative;
  display:grid;
  grid-template-columns:46px minmax(0,1fr) 22px;
  align-items:center;
  gap:12px;
  min-height:70px;
  margin-top:20px;
  padding:12px 14px;
  overflow:hidden;
  border:1px solid rgba(var(--oj-accent-rgb),.95);
  border-radius:14px;
  background:
    radial-gradient(circle at 0 50%,rgba(var(--oj-accent-rgb),.2),transparent 48%),
    linear-gradient(135deg,#25171c,#111216 68%);
  color:#fff;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.035),0 14px 34px rgba(0,0,0,.28);
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.oj-v17-bonus-cta:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(112deg,rgba(255,255,255,.09),transparent 34%);
}
.oj-v17-bonus-cta:hover{
  transform:translateY(-2px);
  border-color:var(--oj-accent-hover);
  color:#fff;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.05),0 20px 42px rgba(0,0,0,.38),0 0 28px rgba(var(--oj-accent-rgb),.13);
}
.oj-v17-bonus-icon{
  position:relative;
  display:block;
  width:42px;
  height:42px;
}
.oj-v17-bonus-icon i{
  position:absolute;
  left:6px;
  width:29px;
  height:12px;
  border:2px solid #ffdb54;
  border-radius:50%;
  background:linear-gradient(180deg,#ffec79,#e8a900);
  box-shadow:inset 0 -3px 0 rgba(132,73,0,.24),0 2px 7px rgba(0,0,0,.28);
}
.oj-v17-bonus-icon i:nth-child(1){top:7px}
.oj-v17-bonus-icon i:nth-child(2){top:15px;left:2px}
.oj-v17-bonus-icon i:nth-child(3){top:23px;left:8px}
.oj-v17-bonus-copy{position:relative;z-index:1;min-width:0}
.oj-v17-bonus-copy strong,
.oj-v17-bonus-copy small{display:block}
.oj-v17-bonus-copy strong{
  font-size:15px;
  line-height:1.1;
  letter-spacing:-.015em;
}
.oj-v17-bonus-copy small{
  margin-top:4px;
  color:#e6e7eb;
  font-size:12px;
  font-weight:700;
  line-height:1.15;
}
.oj-v17-bonus-arrow{
  position:relative;
  z-index:1;
  color:var(--oj-accent-hover);
  font-size:18px;
  font-weight:900;
  transition:transform .2s ease;
}
.oj-v17-bonus-cta:hover .oj-v17-bonus-arrow{transform:translate(2px,-2px)}

.oj-v17-model-tags-seo{
  position:relative;
  display:grid;
  grid-template-columns:minmax(260px,.68fr) minmax(0,1.32fr);
  gap:24px clamp(36px,5vw,76px);
  margin-top:38px;
  margin-bottom:34px;
  padding:clamp(30px,4.5vw,56px);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.085);
  border-radius:24px;
  background:
    radial-gradient(circle at 0 0,rgba(var(--oj-accent-rgb),.15),transparent 31rem),
    linear-gradient(145deg,#111319,#0a0c10 70%);
  box-shadow:0 24px 70px rgba(0,0,0,.2);
}
.oj-v17-model-tags-seo:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(112deg,rgba(255,255,255,.035),transparent 34%);
}
.oj-v17-model-tags-seo>*{position:relative;z-index:1}
.oj-v17-model-tags-seo header>span{
  color:var(--oj-accent-hover);
  font-size:11px;
  font-weight:900;
  letter-spacing:.15em;
  text-transform:uppercase;
}
.oj-v17-model-tags-seo h2{
  margin:10px 0 0;
  font-size:clamp(30px,3.4vw,48px);
  line-height:1.04;
  letter-spacing:-.05em;
}
.oj-v17-model-tags-copy p{
  margin:0 0 18px;
  color:#b9bec8;
  font-size:16px;
  line-height:1.82;
}
.oj-v17-model-tags-copy p:last-child{margin-bottom:0}
.oj-v17-model-tags-copy a{
  color:#fff;
  font-weight:800;
  text-decoration:underline;
  text-decoration-color:rgba(var(--oj-accent-rgb),.74);
  text-underline-offset:4px;
}
.oj-v17-model-tags-seo nav{
  grid-column:1/-1;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  padding-top:25px;
  border-top:1px solid rgba(255,255,255,.08);
}
.oj-v17-model-tags-seo nav a{
  display:inline-flex;
  align-items:center;
  gap:4px;
  min-height:40px;
  padding:0 13px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:10px;
  background:rgba(255,255,255,.03);
  color:#d9dce2;
  font-size:12px;
  font-weight:780;
  transition:border-color .2s ease,background .2s ease,color .2s ease,transform .2s ease;
}
.oj-v17-model-tags-seo nav a span{color:var(--oj-accent-hover)}
.oj-v17-model-tags-seo nav a:hover{
  transform:translateY(-1px);
  border-color:rgba(var(--oj-accent-rgb),.55);
  background:rgba(var(--oj-accent-rgb),.09);
  color:#fff;
}

/* Keep the longer V17 homepage text readable and balanced. */
.oj-v1605-home-seo .oj-v1605-seo-copy>p{
  text-wrap:pretty;
}
.oj-v1605-home-seo .oj-v1605-seo-copy>p:nth-child(odd){padding-right:clamp(0px,1vw,10px)}
.oj-v1605-home-seo .oj-v1605-seo-copy>p:nth-child(even){padding-left:clamp(0px,1vw,10px)}
.oj-v1605-home-seo .oj-v1605-seo-copy>p strong{color:#fff}

@media(max-width:1050px){
  .oj-v17-bonus-cta{grid-column:1/-1}
}
@media(max-width:900px){
  .oj-v17-model-tags-seo{grid-template-columns:1fr}
  .oj-v17-model-tags-seo nav{grid-column:1}
  .oj-v1605-home-seo .oj-v1605-seo-copy>p:nth-child(n){padding-inline:0}
}
@media(max-width:560px){
  .oj-v17-bonus-cta{grid-template-columns:42px minmax(0,1fr) 18px;padding:11px 12px}
  .oj-v17-model-tags-seo{padding:28px 20px;border-radius:18px}
  .oj-v17-model-tags-seo nav a{width:100%;justify-content:flex-start}
}
