/* Developer guides in the service-page look (inc/guide-layout.php). The osc-* blocks come from the service pages; these are the guide-only parts. */

.osc-guide-page .osc-intro-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:56px;align-items:start}
.osc-guide-page .osc-intro-content>p{font-size:1.08rem;line-height:1.7;color:var(--ink);margin:0 0 1em}
.osc-guide-page .osc-intro-content>p:first-child{margin-top:0}

.osc-guide-intro-h{font-size:clamp(1.8rem,3vw,2.4rem)!important;margin:0 0 6px!important}
.osc-guide-intro-h+.osc-guide-toc{margin-top:18px}

/* contents list */
.osc-guide-toc{margin-top:28px;padding:22px 24px;border:1px solid var(--line);border-radius:var(--r);background:var(--paper)}
.osc-guide-toc-h{font:700 13px var(--f-body);letter-spacing:.08em;text-transform:uppercase;color:var(--lime-text);margin:0 0 10px!important}
.osc-guide-toc ol{list-style:none;margin:0;padding:0;columns:2;column-gap:28px;counter-reset:toc}
.osc-guide-toc li{break-inside:avoid;counter-increment:toc;margin:0;padding:6px 0;border-top:1px solid var(--line)}
.osc-guide-toc li:first-child{border-top:0}
.osc-guide-toc a{display:flex;gap:10px;color:var(--ink);text-decoration:none;font-weight:600;font-size:15px;line-height:1.35}
.osc-guide-toc a::before{content:counter(toc,decimal-leading-zero);flex:none;font-weight:700;font-size:13px;color:var(--lime-text);padding-top:1px;font-variant-numeric:tabular-nums}
.osc-guide-toc a:hover{color:var(--lime-text)}

/* side box */
.osc-guide-side{position:sticky;top:110px}
.osc-guide-side h3{margin-bottom:14px!important}
.osc-guide-side .osc-button{width:100%;justify-content:center;margin-top:18px;box-sizing:border-box}
.osc-guide-prices{margin:0;padding:0}
.osc-guide-prices>div{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:11px 0;border-top:1px solid var(--line)}
.osc-guide-prices>div:first-child{border-top:0;padding-top:2px}
.osc-guide-prices dt{margin:0;font-size:15px;line-height:1.35}
.osc-guide-prices dt a{color:var(--ink);text-decoration:none;font-weight:600}
.osc-guide-prices dt a:hover{color:var(--lime-text)}
.osc-guide-prices dt{flex:1 1 auto;min-width:0}
.osc-guide-prices dd{margin:0;flex:0 1 auto;max-width:58%;text-align:right;font:800 15px/1.3 var(--f-display);font-stretch:104%;color:var(--ink);overflow-wrap:anywhere}
.osc-guide-side-note{font-size:13.5px!important;color:var(--muted)!important;margin:12px 0 0!important}

/* section body */
.osc-guide-page .osc-section-heading{max-width:780px;margin-bottom:28px}
.osc-guide-prose{max-width:780px}
.osc-guide-prose+.osc-guide-prose,.osc-guide-prose+.osc-guide-table,.osc-guide-table+.osc-guide-prose,.osc-guide-cards+.osc-guide-prose,.osc-guide-prose+.osc-guide-cards,.osc-guide-cta+.osc-guide-prose,.osc-guide-prose+.osc-guide-cta,.osc-guide-cards+.osc-guide-cta,.osc-guide-table+.osc-guide-cta{margin-top:28px}
.osc-guide-prose p{font-size:1.04rem;line-height:1.72;margin:0 0 1em}
.osc-guide-prose>:last-child{margin-bottom:0}
.osc-guide-prose a,.osc-guide-table a,.osc-guide-page .osc-faq-answer a,.osc-guide-page .osc-intro-content a,.osc-guide-page .osc-card a{color:var(--lime-text);font-weight:600;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.osc-guide-prose ul,.osc-guide-prose ol{margin:0 0 1.1em;padding:0;list-style:none}
.osc-guide-prose ul li{position:relative;padding:9px 0 9px 34px;line-height:1.6;border-top:1px solid var(--line)}
.osc-guide-prose ul li:first-child{border-top:0}
.osc-guide-prose ul li::before{content:"";position:absolute;left:0;top:12px;width:20px;height:20px;border-radius:50%;background:#EEF6E2 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234E7A16' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/12px no-repeat}
.osc-guide-prose ol{counter-reset:gl}
.osc-guide-prose ol li{position:relative;counter-increment:gl;padding:9px 0 9px 40px;line-height:1.6}
.osc-guide-prose ol li::before{content:counter(gl);position:absolute;left:0;top:9px;width:26px;height:26px;border-radius:50%;background:var(--ink);color:#fff;font:700 13px/26px var(--f-body);text-align:center}
.osc-guide-prose strong{color:var(--ink)}

/* text sections: heading on the left, text on the right */
.osc-guide-split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;align-items:start}
.osc-guide-split .osc-section-heading{position:sticky;top:110px;margin-bottom:0}
.osc-guide-split .osc-guide-prose{max-width:none}
.osc-guide-prose ul.osc-guide-ticks-2{display:grid;grid-template-columns:1fr 1fr;column-gap:28px}
.osc-guide-prose ul.osc-guide-ticks-2 li:nth-child(2){border-top:0}

/* numbered cards for "term: explanation" lists */
.osc-guide-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.osc-guide-cards-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.osc-guide-cards .osc-card{margin:0;padding:24px;border:1px solid var(--line);border-radius:var(--r);background:var(--paper);box-shadow:var(--shadow);transition:border-color .15s,transform .15s}
.osc-guide-cards .osc-card:hover{border-color:var(--lime);transform:translateY(-2px)}
.osc-guide-num{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:var(--r);background:var(--band);color:var(--lime);font:800 15px var(--f-display);margin-bottom:16px;font-variant-numeric:tabular-nums}
.osc-guide-cards h3{font-size:1.18rem!important;margin:0 0 8px!important;line-height:1.2!important}
.osc-guide-cards p{font-size:15.5px;line-height:1.6;color:var(--muted);margin:0}

/* tables */
.osc-guide-table{border:1px solid var(--line);border-radius:var(--r);overflow:auto;background:var(--paper);box-shadow:var(--shadow);-webkit-overflow-scrolling:touch}
.osc-guide-table table{width:100%;border-collapse:collapse;margin:0;font-size:15.5px;line-height:1.5}
.osc-guide-table th{background:var(--band);color:var(--on-band);text-align:left;font:700 14px var(--f-body);letter-spacing:.02em;padding:14px 18px}
.osc-guide-table td{padding:14px 18px;border-top:1px solid var(--line);vertical-align:top}
.osc-guide-table tbody tr:nth-child(even) td{background:#F7F9F4}
.osc-guide-table td:first-child{font-weight:600;color:var(--ink)}
.osc-guide-table td:last-child:not(:first-child){white-space:normal}

/* quote band inside the guide */
.osc-guide-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 32px;padding:28px 32px;border-radius:var(--r);background:var(--band);color:var(--on-band);box-shadow:var(--shadow)}
.osc-guide-cta strong{display:block;font:800 1.35rem/1.15 var(--f-display);font-stretch:106%;letter-spacing:-.01em;color:#fff}
.osc-guide-cta p{margin:6px 0 0!important;color:var(--on-band-muted)!important;max-width:56ch}
.osc-guide-cta .osc-button-row{margin:0!important}
.osc-guide-cta .osc-button-secondary{border-color:var(--band-line)!important;color:var(--on-band)!important;background:transparent!important}

/* FAQs and related links */
.osc-guide-page .osc-faq-list{max-width:880px;margin-left:0!important;margin-right:auto!important}
.osc-guide-related .osc-related-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.osc-guide-related a.osc-related-item{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink);font-weight:600;transition:border-color .15s,transform .15s,box-shadow .15s}
.osc-guide-related a.osc-related-item:hover{border-color:var(--lime);transform:translateY(-2px);box-shadow:var(--shadow)}
.osc-guide-note{max-width:780px;margin:28px 0 0!important;font-size:13.5px!important;color:var(--on-band-muted)!important}
.osc-guide-note strong{color:var(--on-band)}

@media (max-width:980px){
  .osc-guide-page .osc-intro-grid,.osc-guide-split{grid-template-columns:minmax(0,1fr)!important;gap:32px}
  .osc-guide-side,.osc-guide-split .osc-section-heading{position:static}
  .osc-guide-split .osc-section-heading{margin-bottom:4px}
  .osc-guide-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:700px){
  .osc-guide-cards,.osc-guide-cards-2{grid-template-columns:1fr}
}
@media (max-width:640px){
  .osc-guide-prose ul.osc-guide-ticks-2{grid-template-columns:1fr}
  .osc-guide-prose ul.osc-guide-ticks-2 li:nth-child(2){border-top:1px solid var(--line)}
}
@media (max-width:640px){
  .osc-guide-toc{padding:18px}
  .osc-guide-toc ol{columns:1}
  .osc-guide-cta{padding:22px}
  .osc-guide-cta .osc-button-row,.osc-guide-cta .osc-button{width:100%}
  .osc-guide-table th,.osc-guide-table td{padding:12px 14px}
  .osc-guide-table table{font-size:14.5px}
}
