/* Editorial redesign system: shared across portfolio, article, about and contact pages. */
:root{--rd-ink:#18231f;--rd-muted:#607068;--rd-paper:#f5f3ee;--rd-surface:#fffefa;--rd-line:#d7ddd7;--rd-green:#0c6b59;--rd-green-soft:#dceee8;--rd-warm:#d78242;--rd-shadow:0 16px 38px rgba(24,35,31,.08)}
html{background:var(--rd-paper)}body{background:var(--rd-paper)!important;color:var(--rd-ink)!important;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif!important;line-height:1.55}body::before,body::after{display:none!important}a{color:var(--rd-green)}a:hover,a:focus-visible{color:#07483c}.nav{position:sticky;top:0;background:rgba(245,243,238,.93)!important;backdrop-filter:blur(12px);border-bottom:1px solid var(--rd-line)!important;box-shadow:none!important}.navin{max-width:1180px!important;padding:18px 20px!important}.navin::after{display:none!important}.brand{color:var(--rd-ink)!important;background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;padding:0!important;font-weight:800!important;letter-spacing:-.025em!important;text-transform:none!important}.brand::before{width:8px!important;height:8px!important;background:var(--rd-green)!important;box-shadow:none!important}.links{gap:22px!important}.links a{background:none!important;border:0!important;box-shadow:none!important;border-radius:0!important;padding:4px 0!important;color:var(--rd-muted)!important;font-size:.92rem!important;font-weight:650!important}.links a::after{background:var(--rd-green)!important}.links a:hover{color:var(--rd-ink)!important}.hero{min-height:0!important;padding:70px max(20px,calc((100vw - 1140px)/2)) 52px!important;background:var(--rd-paper)!important;border-bottom:1px solid var(--rd-line);overflow:visible!important}.hero::before,.hero::after,.hero-bubbles,.hero-wave,.bubble{display:none!important}.hero-inner,.heroBox{max-width:1140px!important;margin:0 auto!important;background:none!important;border:0!important;border-radius:0!important;padding:0!important;box-shadow:none!important}.hero h1,.heroBox h1,.hero-inner h1{font-family:Georgia,"Times New Roman",serif!important;color:var(--rd-ink)!important;font-size:clamp(2.7rem,6vw,5.6rem)!important;font-weight:500!important;line-height:.95!important;letter-spacing:-.06em!important;max-width:13ch}.hero p,.heroBox p,.hero-inner p{color:var(--rd-muted)!important;max-width:62ch!important;font-size:1.06rem!important}.wrap{max-width:1180px!important;padding:50px 20px 70px!important}.card,.panel,.band,.summary,.pathCard,.tourBoard,.flowGrid article,.path article,.chooser,.step,.diagram,.decisionCard{background:var(--rd-surface)!important;border:1px solid var(--rd-line)!important;border-radius:0!important;box-shadow:none!important;backdrop-filter:none!important;color:var(--rd-ink)!important}.card::before,.panel::before,.band::before,.summary::before,.pathCard::before,.tourBoard::before,.flowGrid article::before,.path article::before,.chooser::before,.chooser::after,.panel::after{display:none!important}.card:hover,.panel:hover,.chooser:hover{transform:translateY(-3px)!important;border-color:var(--rd-green)!important;box-shadow:var(--rd-shadow)!important;filter:none!important}.card h2,.card h3,.band h2,.band h3,.panel h2,.panel h3,.chooser h2{color:var(--rd-ink)!important;font-family:Georgia,"Times New Roman",serif!important;letter-spacing:-.035em!important}.card p,.band p,.panel p,.chooser p,.step p,.diagram p{color:var(--rd-muted)!important}.tag,.chip,.meta span{background:transparent!important;border:1px solid var(--rd-line)!important;border-radius:0!important;color:var(--rd-green)!important;font-size:.72rem!important;font-weight:750!important;letter-spacing:.08em!important;text-transform:uppercase!important}.section-chooser{gap:18px!important}.chooser{min-height:210px!important;padding:24px!important}.chooser h2{font-size:1.45rem!important;max-width:20ch!important}.chooser svg{display:none!important}.chooser .shine{display:none!important}.section-chooser .chooser:nth-child(5){background:var(--rd-green-soft)!important}.intro,.callout,.quote{background:var(--rd-green-soft)!important;border:0!important;border-left:3px solid var(--rd-green)!important;border-radius:0!important;color:var(--rd-ink)!important}.quote{font-family:Georgia,"Times New Roman",serif!important;font-size:1.25rem!important}table{background:var(--rd-surface)!important;border:1px solid var(--rd-line)!important;border-radius:0!important;box-shadow:none!important}table thead th{background:var(--rd-green-soft)!important;color:var(--rd-ink)!important}table th,table td{border-color:var(--rd-line)!important;color:var(--rd-ink)!important}.page-nav a,.button,.code-btn{background:var(--rd-ink)!important;border:1px solid var(--rd-ink)!important;border-radius:0!important;color:var(--rd-surface)!important;box-shadow:none!important}.page-nav a:hover,.button:hover,.code-btn:hover{background:var(--rd-green)!important;border-color:var(--rd-green)!important}.foot,.footer{color:var(--rd-muted)!important;border-top:1px solid var(--rd-line)!important;text-transform:none!important;letter-spacing:0!important}.breadcrumbs,.crumbs{color:var(--rd-muted)!important}.breadcrumbs a,.crumbs a{color:var(--rd-green)!important}@media(max-width:700px){.navin{padding:14px 16px!important}.hero{padding:48px 16px 38px!important}.wrap{padding:36px 16px 52px!important}.links{gap:14px!important}.links a{font-size:.86rem!important}.chooser{min-height:0!important}.hero h1,.heroBox h1,.hero-inner h1{font-size:3rem!important}}
.screen{min-height:auto!important;padding:0!important;display:block!important}.shell{width:100%!important;min-height:0!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;backdrop-filter:none!important;overflow:visible!important}.shell::before,.shell::after,.floating{display:none!important}.topbar{width:min(1180px,calc(100% - 40px))!important;margin:auto!important;padding:22px 0!important;border-bottom:1px solid var(--rd-line)!important}.layout{width:min(1180px,calc(100% - 40px))!important;margin:0 auto!important;display:grid!important;grid-template-columns:repeat(12,minmax(0,1fr))!important;gap:18px!important;min-height:0!important;padding:70px 0!important}.layout .panel{min-height:330px!important;padding:28px!important;border-radius:0!important}.layout .portfolio{grid-column:span 7!important}.layout .articles{grid-column:span 5!important}.layout .contact{grid-column:span 5!important}.layout .panel:nth-child(3){grid-column:span 7!important;background:var(--rd-green-soft)!important}.layout .panel h2{font-size:clamp(2rem,4vw,4rem)!important;line-height:.95!important}.layout .panel .cta{color:var(--rd-green)!important;letter-spacing:.1em!important}.layout .panel .cta::after{background:var(--rd-green)!important}.layout .panel .meta{margin-top:auto!important}.footer-hint{width:min(1180px,calc(100% - 40px))!important;margin:0 auto!important;padding:0 0 36px!important;text-align:left!important;color:var(--rd-muted)!important}@media(max-width:700px){.topbar,.layout,.footer-hint{width:min(100% - 28px,1180px)!important}.layout{display:block!important;padding:42px 0!important}.layout .panel,.layout .portfolio,.layout .articles,.layout .contact,.layout .panel:nth-child(3){grid-column:auto!important;min-height:220px!important;margin-bottom:12px}.topbar{padding:16px 0!important}}
.avatar{display:block!important;width:84px!important;height:84px!important;object-fit:cover!important;border:2px solid var(--rd-green)!important;box-shadow:none!important}.sub,.panel-list,.list,.milestone p,.metric p,.skills-card p,.section p{color:var(--rd-muted)!important}.hero-main,.hero-side,.metric,.milestone,.skills-card,.timeline,.skills{background:var(--rd-surface)!important;border-color:var(--rd-line)!important;color:var(--rd-ink)!important}.hero-main h1,.section h2,.milestone h3,.skills-card h3{color:var(--rd-ink)!important}.btn.p{background:var(--rd-ink)!important;color:var(--rd-surface)!important}.btn.g{background:transparent!important;color:var(--rd-ink)!important;border:1px solid var(--rd-line)!important}.path-chip,.skill-tag{background:transparent!important;color:var(--rd-green)!important;border-color:var(--rd-line)!important}
body:has(.gateway) .hero{max-width:1180px!important;margin:0 auto!important;padding:46px 20px 28px!important;border:0!important}body:has(.gateway) .gateway{padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;backdrop-filter:none!important}body:has(.gateway) .gateway::before,body:has(.gateway) .gateway::after{display:none!important}body:has(.gateway) .hero-main{padding:32px!important;border-left:4px solid var(--rd-green)!important}body:has(.gateway) .grid3{display:grid!important;grid-template-columns:1.4fr 1fr .9fr!important;gap:18px!important;margin-top:18px!important}body:has(.gateway) .metric{padding:20px!important;border-radius:0!important}.feedback .quote{display:none!important;position:static!important;opacity:1!important;transform:none!important;pointer-events:auto!important;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important}.feedback .quote.active{display:block!important}.feedback-track{min-height:0!important}.feedback .quote-main{background:var(--rd-surface)!important;border:1px solid var(--rd-line)!important;border-left:4px solid var(--rd-green)!important;border-radius:0!important;box-shadow:none!important;padding:24px!important}.feedback .quote-main p{color:var(--rd-ink)!important}.feedback .quote-name{color:var(--rd-green)!important}.feedback-dot{background:var(--rd-line)!important;border-radius:0!important}.feedback-dot.active{background:var(--rd-green)!important}@media(max-width:700px){body:has(.gateway) .hero{padding:32px 16px 20px!important}body:has(.gateway) .grid3{grid-template-columns:1fr!important}.feedback .quote-main{padding:18px!important}}
body:has(.contact-grid) .contact-grid{gap:18px!important}body:has(.contact-grid) .contact-grid .panel,body:has(.contact-grid) .contact-grid .card,body:has(.contact-grid) .contact-item{background:var(--rd-surface)!important;border:1px solid var(--rd-line)!important;border-radius:0!important;box-shadow:none!important;color:var(--rd-ink)!important}body:has(.contact-grid) .contact-grid .panel{padding:30px!important;border-left:4px solid var(--rd-green)!important}body:has(.contact-grid) .contact-grid .card{padding:24px!important}body:has(.contact-grid) .contact-item{padding:18px!important;grid-template-columns:42px minmax(0,1fr)!important;align-items:start!important}body:has(.contact-grid) .contact-item p,body:has(.contact-grid) .contact-item strong{color:var(--rd-ink)!important}body:has(.contact-grid) .contact-item a{color:var(--rd-green)!important;overflow-wrap:anywhere}body:has(.contact-grid) .label{color:var(--rd-muted)!important}body:has(.contact-grid) .icon{border-radius:0!important;background:var(--rd-green-soft)!important;border:1px solid var(--rd-line)!important;color:var(--rd-green)!important}body:has(.contact-grid) .meta-row .chip{background:transparent!important;color:var(--rd-green)!important}@media(max-width:640px){body:has(.contact-grid) .contact-item{grid-template-columns:38px minmax(0,1fr)!important;padding:16px!important}}

/* Articles use one editorial column: the title, introduction and every card share its left edge. */
body:has(.breadcrumbs) .hero,body:has(.crumbs) .hero,body:has(.section-grid) .hero,body:has(.grid) .hero{padding:70px 0 52px!important}
/* Older article files do not all define border-box. Without it, a 20px content inset changes the actual width of .wrap and makes it drift from the hero. */
body:has(main.wrap) .navin,body:has(main.wrap) .hero,body:has(main.wrap) .hero-inner,body:has(main.wrap) .heroBox,body:has(main.wrap) .wrap{box-sizing:border-box!important}
body:has(.breadcrumbs) .hero-inner,body:has(.breadcrumbs) .heroBox,body:has(.crumbs) .hero-inner,body:has(.crumbs) .heroBox,body:has(.section-grid) .hero-inner,body:has(.section-grid) .heroBox,body:has(.grid) .hero-inner,body:has(.grid) .heroBox{width:min(1180px,100%)!important;max-width:1180px!important;margin:0 auto!important;padding:0 20px!important}
body:has(.breadcrumbs) .wrap,body:has(.crumbs) .wrap,body:has(.section-grid) .wrap,body:has(.grid) .wrap{width:min(1180px,100%)!important;max-width:1180px!important;margin:0 auto!important;padding:50px 20px 70px!important}

/* The systems hub nests its hero inside a portal. Flatten the portal so it follows the same grid as every other article hub. */
body:has(.section-grid) .portal{padding:0!important;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;backdrop-filter:none!important}
body:has(.section-grid) .portal::before,body:has(.section-grid) .portal::after{display:none!important}
body:has(.section-grid) .portal .hero{padding:34px 0!important;background:transparent!important;border:0!important;border-bottom:1px solid var(--rd-line)!important;border-radius:0!important;box-shadow:none!important}
body:has(.section-grid) .portal .hero h1{max-width:18ch!important;font-size:clamp(2.3rem,4.5vw,4.35rem)!important}
body:has(.section-grid) .section-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:18px!important;margin-top:18px!important;align-items:stretch!important}
body:has(.section-grid) .section-card{display:flex!important;min-height:300px!important;padding:24px!important;flex-direction:column!important;align-items:stretch!important;justify-content:flex-start!important;background:var(--rd-surface)!important;border:1px solid var(--rd-line)!important;border-top:3px solid var(--rd-green)!important;border-radius:0!important;box-shadow:none!important;color:var(--rd-ink)!important;text-decoration:none!important}
body:has(.section-grid) .section-card::before,body:has(.section-grid) .section-card::after{display:none!important}
body:has(.section-grid) .section-card .topic{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;margin:0 0 24px!important}
body:has(.section-grid) .section-card .tag,body:has(.section-grid) .section-card .pill{background:transparent!important;border:1px solid var(--rd-line)!important;border-radius:0!important;color:var(--rd-green)!important}
body:has(.section-grid) .section-card .icon{display:grid!important;place-items:center!important;width:38px!important;height:38px!important;padding:0!important;background:var(--rd-green-soft)!important;border:1px solid var(--rd-line)!important;border-radius:0!important;color:var(--rd-green)!important}
body:has(.section-grid) .section-card h2{margin:0 0 10px!important;color:var(--rd-ink)!important;font-family:Georgia,"Times New Roman",serif!important;font-size:1.55rem!important;line-height:1.08!important;letter-spacing:-.035em!important}
body:has(.section-grid) .section-card p{margin:0!important;color:var(--rd-muted)!important;line-height:1.58!important}
body:has(.section-grid) .section-card .meta{display:flex!important;flex-wrap:wrap!important;gap:7px!important;margin-top:auto!important;padding-top:22px!important}
body:has(.section-grid) .footnote{margin:22px 0 0!important;color:var(--rd-muted)!important}

/* Consistent article card rhythm for category pages such as Latest Tech. */
body:has(.grid) .grid{gap:18px!important;align-items:stretch!important}
body:has(.grid) .grid > .card{display:flex!important;min-height:260px!important;padding:24px!important;flex-direction:column!important;align-items:flex-start!important;border-top:3px solid var(--rd-green)!important}
body:has(.grid) .grid > .card h2{margin:20px 0 10px!important;line-height:1.08!important}
body:has(.grid) .grid > .card p{margin:0!important}
body:has(.grid) .grid > .card svg{margin-top:auto!important;align-self:flex-end!important}
@media(max-width:700px){body:has(.breadcrumbs) .hero,body:has(.crumbs) .hero,body:has(.section-grid) .hero,body:has(.grid) .hero{padding:48px 0 38px!important}body:has(.breadcrumbs) .hero-inner,body:has(.breadcrumbs) .heroBox,body:has(.crumbs) .hero-inner,body:has(.crumbs) .heroBox,body:has(.section-grid) .hero-inner,body:has(.section-grid) .heroBox,body:has(.grid) .hero-inner,body:has(.grid) .heroBox{padding:0 16px!important}body:has(.section-grid) .portal .hero{padding:26px 0!important}body:has(.section-grid) .section-grid{grid-template-columns:1fr!important}body:has(.section-grid) .section-card,body:has(.grid) .grid > .card{min-height:0!important;padding:20px!important}}

/* Legacy redirect pages should not leave their only line of content against the viewport edge. */
body > p:only-child{box-sizing:border-box!important;width:min(760px,calc(100% - 40px))!important;margin:72px auto!important;padding:22px 24px!important;background:var(--rd-surface)!important;border:1px solid var(--rd-line)!important;border-left:4px solid var(--rd-green)!important;color:var(--rd-ink)!important}
@media(max-width:700px){body > p:only-child{width:calc(100% - 32px)!important;margin:40px auto!important;padding:18px!important}}

/* Portfolio source styles predate the shared palette. Keep every text role in that page consistent and readable. */
body:has(.gateway) .gateway,body:has(.gateway) .section{color:var(--rd-ink)!important}
body:has(.gateway) .section h2,body:has(.gateway) .metric h3,body:has(.gateway) .milestone b,body:has(.gateway) .skills-card h3,body:has(.gateway) .kpi b{color:var(--rd-ink)!important}
body:has(.gateway) .metric p,body:has(.gateway) .section p,body:has(.gateway) .section li,body:has(.gateway) .milestone span,body:has(.gateway) .skills-card p,body:has(.gateway) .panel-list,body:has(.gateway) .kpi span{color:var(--rd-muted)!important}
body:has(.gateway) .list li::marker{color:var(--rd-green)!important}
body:has(.gateway) .quote-main p{color:var(--rd-ink)!important}
body:has(.gateway) .feedback-nav{display:flex!important;align-items:center!important;gap:12px!important;margin-top:16px!important}
body:has(.gateway) .feedback-dots{display:flex!important;align-items:center!important;gap:8px!important;margin:0!important}
body:has(.gateway) .feedback-control{appearance:none!important;background:transparent!important;border:1px solid var(--rd-line)!important;border-radius:0!important;color:var(--rd-ink)!important;padding:8px 12px!important;font:inherit!important;font-size:.8rem!important;font-weight:700!important;cursor:pointer!important}
body:has(.gateway) .feedback-control:hover,body:has(.gateway) .feedback-control:focus-visible{background:var(--rd-green-soft)!important;border-color:var(--rd-green)!important;color:var(--rd-green)!important;outline:2px solid transparent!important}
body:has(.gateway) .feedback-dot{width:12px!important;height:12px!important;border:1px solid var(--rd-line)!important;opacity:1!important;cursor:pointer!important}
body:has(.gateway) .feedback-dot:focus-visible{outline:2px solid var(--rd-green)!important;outline-offset:3px!important}
@media(max-width:520px){body:has(.gateway) .feedback-nav{flex-wrap:wrap!important}body:has(.gateway) .feedback-dots{order:3!important;width:100%!important}}

/* Keep feedback quiet but visually consistent with the rest of the light portfolio cards. */
body:has(.gateway) .feedback-track{min-height:340px!important}
body:has(.gateway) .feedback,body:has(.gateway) .feedback-track,body:has(.gateway) .feedback .quote{background:transparent!important}
body:has(.gateway) .feedback .quote-main{background:var(--rd-surface)!important;border:1px solid var(--rd-line)!important;border-left:4px solid var(--rd-green)!important;border-radius:0!important;box-shadow:none!important;padding:24px!important}
@media(max-width:700px){body:has(.gateway) .feedback-track{min-height:540px!important}body:has(.gateway) .feedback .quote-main{padding:18px!important}}

/* A real track carousel: all testimonials sit in one row and the track moves between them. */
body:has(.gateway) .feedback{overflow:hidden!important}
body:has(.gateway) .feedback-track{display:flex!important;align-items:stretch!important;gap:0!important;transition:transform .62s cubic-bezier(.22,.61,.36,1)!important;will-change:transform!important}
body:has(.gateway) .feedback .quote,body:has(.gateway) .feedback .quote.active{display:block!important;position:relative!important;inset:auto!important;flex:0 0 100%!important;width:100%!important;opacity:1!important;transform:none!important;pointer-events:auto!important;padding:0!important}

/* CSS-only feedback carousel: a cloned first slide provides a seamless loop without controls or JavaScript state. */
@keyframes portfolio-feedback-cycle{0%,16%{transform:translateX(0)}20%,36%{transform:translateX(-20%)}40%,56%{transform:translateX(-40%)}60%,76%{transform:translateX(-60%)}80%,96%{transform:translateX(-80%)}100%{transform:translateX(-80%)}}
body:has(.gateway) .feedback-track{width:500%!important;animation:portfolio-feedback-cycle 22s ease-in-out infinite!important;transition:none!important}
body:has(.gateway) .feedback .quote,body:has(.gateway) .feedback .quote.active{flex:0 0 20%!important;width:20%!important}
@media(prefers-reduced-motion:reduce){body:has(.gateway) .feedback-track{animation:none!important}}

/* Dots make the other recommendations discoverable while retaining the automatic carousel. */
body:has(.gateway) .feedback-track{width:100%!important;animation:none!important;transition:transform .62s cubic-bezier(.22,.61,.36,1)!important}
body:has(.gateway) .feedback .quote,body:has(.gateway) .feedback .quote.active{flex:0 0 100%!important;width:100%!important}
body:has(.gateway) .feedback-dots{display:flex!important;justify-content:center!important;gap:9px!important;margin:16px 0 0!important}
body:has(.gateway) .feedback-dot{width:9px!important;height:9px!important;padding:0!important;background:var(--rd-line)!important;border:0!important;border-radius:50%!important;transition:transform .2s ease,background .2s ease!important}
body:has(.gateway) .feedback-dot.active{background:var(--rd-green)!important;transform:scale(1.35)!important}

/* Keep the controls visually subtle, but make each dot easy to tap or click. */
body:has(.gateway) .feedback-dot{display:grid!important;place-items:center!important;width:36px!important;height:36px!important;background:transparent!important;border:0!important;border-radius:50%!important;transform:none!important}
body:has(.gateway) .feedback-dot::before{content:""!important;display:block!important;width:9px!important;height:9px!important;background:var(--rd-line)!important;border-radius:50%!important;transition:transform .2s ease,background .2s ease!important}
body:has(.gateway) .feedback-dot.active::before{background:var(--rd-green)!important;transform:scale(1.35)!important}

/* Native fallback controls: selecting a dot works without any JavaScript and pauses the automatic loop on that slide. */
body:has(.gateway) .feedback-choice{position:absolute!important;inline-size:1px!important;block-size:1px!important;opacity:0!important;pointer-events:none!important}
body:has(.gateway) .sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
body:has(.gateway) .feedback-track{width:500%!important;animation:portfolio-feedback-cycle 22s ease-in-out infinite!important;transition:none!important}
body:has(.gateway) .feedback .quote,body:has(.gateway) .feedback .quote.active{flex:0 0 20%!important;width:20%!important}
body:has(.gateway) #feedback-slide-1:checked~.feedback-track{animation:none!important;transform:translateX(0)!important}
body:has(.gateway) #feedback-slide-2:checked~.feedback-track{animation:none!important;transform:translateX(-20%)!important}
body:has(.gateway) #feedback-slide-3:checked~.feedback-track{animation:none!important;transform:translateX(-40%)!important}
body:has(.gateway) #feedback-slide-4:checked~.feedback-track{animation:none!important;transform:translateX(-60%)!important}
body:has(.gateway) #feedback-slide-1:checked~.feedback-dots label:nth-child(1)::before,body:has(.gateway) #feedback-slide-2:checked~.feedback-dots label:nth-child(2)::before,body:has(.gateway) #feedback-slide-3:checked~.feedback-dots label:nth-child(3)::before,body:has(.gateway) #feedback-slide-4:checked~.feedback-dots label:nth-child(4)::before{background:var(--rd-green)!important;transform:scale(1.35)!important}

/* Legacy article pages use .heroin instead of .hero-inner. Put both the title block and the article body on the same editorial guide. */
body:has(.heroin) .hero{padding:70px 0 52px!important}
body:has(.heroin) .heroin{box-sizing:border-box!important;width:min(1180px,100%)!important;max-width:1180px!important;margin:0 auto!important;padding:0 20px!important}
body:has(.heroin) main.wrap{box-sizing:border-box!important;width:min(1180px,100%)!important;max-width:1180px!important;margin:0 auto!important;padding:50px 20px 70px!important}
@media(max-width:700px){body:has(.heroin) .hero{padding:48px 0 38px!important}body:has(.heroin) .heroin{padding:0 16px!important}body:has(.heroin) main.wrap{padding:36px 16px 52px!important}}

/* Refinement pass: a smaller, repeatable spacing system and calmer reading measure. */
:root{--space-1:8px;--space-2:16px;--space-3:24px;--space-4:40px;--space-5:64px}
.skip-link{position:fixed;z-index:1000;top:10px;left:10px;transform:translateY(-160%);padding:10px 14px;background:var(--rd-ink);color:var(--rd-surface)!important;font-weight:700;text-decoration:none}.skip-link:focus{transform:translateY(0);outline:3px solid var(--rd-warm);outline-offset:3px}
:where(a,button,input,label):focus-visible{outline:3px solid var(--rd-green)!important;outline-offset:3px!important}
body:has(.gateway) .section{margin-block:var(--space-5)!important}body:has(.gateway) .section:first-child{margin-top:0!important}body:has(.gateway) .band{padding:var(--space-3)!important}body:has(.gateway) .timeline,body:has(.gateway) .skills{gap:var(--space-2)!important}body:has(.gateway) .metric{padding:var(--space-3)!important}
body:has(.gateway) .section:nth-of-type(4) .band,body:has(.gateway) .section:nth-of-type(7) .band{background:transparent!important;border:0!important;border-left:3px solid var(--rd-green)!important;padding:0 0 0 var(--space-3)!important}
body:has(.breadcrumbs) .article>.band>p,body:has(.crumbs) .article>.band>p,body:has(.heroin) .article>.band>p,body:has(.breadcrumbs) .article>.band>.list,body:has(.crumbs) .article>.band>.list,body:has(.heroin) .article>.band>.list{max-width:72ch}
body:has(.breadcrumbs) .article>.band,body:has(.crumbs) .article>.band,body:has(.heroin) .article>.band{margin-block:var(--space-3)!important;padding:var(--space-3)!important}
body:has(.gateway) .feedback-note{margin:var(--space-2) 0 0!important;color:var(--rd-muted)!important;font-size:.9rem!important;text-align:center!important}
@media(min-width:701px){.hero h1,.heroBox h1,.hero-inner h1{font-size:clamp(2.7rem,5vw,5rem)!important}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}
@media(max-width:700px){body:has(.gateway) .section{margin-block:var(--space-4)!important}body:has(.gateway) .band,body:has(.breadcrumbs) .article>.band,body:has(.crumbs) .article>.band,body:has(.heroin) .article>.band{padding:20px!important}}

/* Landing choices are peers: reserve colour fills for genuine featured actions only. */
body:has(.layout) .layout .panel:nth-child(3){background:var(--rd-surface)!important}

/* Article cards are already links; make the action visible without adding another control. */
body:has(.grid) .grid>a.card::after{content:"Read article →";display:block;margin-top:16px;color:var(--rd-green);font-size:.78rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}

/* Article categories are peer destinations; no category is permanently featured. */
body:has(.section-chooser) .section-chooser .chooser:nth-child(5){background:var(--rd-surface)!important}