/* Homepage presentation: existing Registry palette, content and data contracts. */
:root{--ui-panel:#f7ead6;--ui-line:#d7ccb9}
html.dark{--ui-panel:#485141;--ui-line:rgba(255,240,220,.12)}
body{line-height:1.65}
a,button{touch-action:manipulation}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--fg);outline-offset:5px}
.registry-nav{border-top:3px solid var(--signal)}
.registry-nav>div{min-height:86px}
.registry-nav>div>a:first-child{max-width:220px;line-height:1.5;letter-spacing:.15em;font-size:12px}
.registry-nav .btn-outline{border-color:var(--fg);font-weight:500;padding:11px 18px}
#themeToggle{padding:10px 0 10px 16px;border-left:1px solid var(--hair);font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.07em}
.registry-hero{min-height:0;position:relative}
.registry-hero>div{padding-top:86px;padding-bottom:86px}
.registry-hero h1{font-size:clamp(3.5rem,6.3vw,6.15rem);line-height:1.02;letter-spacing:-.035em;max-width:740px;margin-bottom:28px}
.registry-hero .hero-copy>p{font-size:18px;line-height:1.75;max-width:510px;margin-bottom:30px}
.chip{font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.1em;padding:7px 11px}
.hero-copy>.chip{border:0;border-left:2px solid var(--signal);padding:0 0 0 12px;margin-bottom:28px;color:var(--muted)}
.btn-primary,.btn-outline,.btn-signal{padding:15px 22px;line-height:1.3;min-height:48px;text-align:center}
.btn-signal{background:var(--fg);color:var(--bg);font-size:11px;font-weight:500;letter-spacing:.06em}
.btn-primary:hover,.btn-signal:hover{opacity:1;box-shadow:inset 0 -3px 0 var(--signal)}
.btn-outline{border-color:var(--ui-line)}
.cta-caption{margin-top:16px;font-size:10px;letter-spacing:.04em}
.hero-copy>.flex:last-child{padding-top:24px;border-top:1px solid var(--hair);line-height:1.7;max-width:535px;font-size:11px;gap:8px 14px}
.hero-record{padding-left:24px}
.hero-record>div{border:1px solid var(--ui-line);border-top:3px solid var(--signal)}
.eco-card .card{--ground:var(--ui-panel);--ink:var(--fg);--ink-soft:var(--muted);--rule:var(--ui-line);padding:30px!important}
.eco-card .eyebrow{font-size:10px;letter-spacing:.12em}
.eco-card .hero{padding:30px 24px;margin-top:20px;background:#3d4535;border-left:3px solid var(--signal);min-height:155px;gap:20px}
.eco-card .score{font-size:108px;line-height:.88}
.eco-card .tier{font-size:12px;max-width:180px;line-height:1.5}
.eco-card .ladder{margin-top:26px}
.eco-card .next{font-size:13px;line-height:1.6;margin-top:16px}
.eco-card .badge{background:var(--bg);color:var(--fg);border:1px solid var(--ui-line);font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.04em;padding:7px 9px}
.eco-card .dot,.eco-card .dot.here,.eco-card .dot.here:after{border-radius:0!important}
.eco-card .dot{border-color:var(--muted)}
.eco-card .dot.done{background:var(--signal);border-color:var(--signal)}
.eco-card .dot.here{background:var(--fg);border-color:var(--fg)}
.eco-card .dot.here:after{border-color:var(--fg);animation:none;opacity:.35;transform:translate(-50%,-50%) scale(1.6)}
.eco-card .seg{background:var(--ui-line)}
.eco-card .seg.done{background:var(--signal)}
.hero-record>div>div:last-child{background:var(--bg)!important;padding:20px 24px;gap:16px}
#heroIdentity{opacity:1!important;line-height:1.6;font-size:10px!important}
#heroGardenId{opacity:1!important;color:var(--muted);font-size:10px!important}
.registry-section{padding-top:88px;padding-bottom:88px}
.registry-section h2{font-size:clamp(2.1rem,3.4vw,3.4rem);line-height:1.15;letter-spacing:-.025em;max-width:680px}
.registry-section>.max-w-7xl>.chip,.registry-section .grid>div>.chip:first-child{border:0;border-bottom:1px solid var(--ui-line);padding:0 0 10px;margin-bottom:24px;color:var(--muted)}
.registry-context .space-y-4{display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid var(--ui-line);border-left:1px solid var(--ui-line)}
.registry-context .space-y-4>div{margin:0!important;border:0;border-right:1px solid var(--ui-line);border-bottom:1px solid var(--ui-line);padding:26px;min-height:186px;background:var(--ui-panel)}
.registry-context .space-y-4>div>div{font-size:16px;margin-bottom:14px}
.registry-steps .grid>div{border-top:1px solid var(--ui-line);padding:24px 18px 0 0}
.step-num{font-family:'IBM Plex Mono',monospace;font-size:14px;line-height:1;color:var(--fg);border-bottom:2px solid var(--signal);padding-bottom:12px;width:32px;margin-bottom:20px}
.registry-steps .grid>div>.font-medium{font-size:18px;margin-bottom:12px}
.registry-pillars .space-y-3{border-top:1px solid var(--ui-line)}
.registry-pillars .space-y-3>div{margin:0!important;border:0;border-bottom:1px solid var(--ui-line);padding:21px 0}
.registry-pillars .font-mono{font-size:12px;border-left:1px solid var(--ui-line);padding-left:20px;white-space:nowrap}
.registry-badges>.max-w-7xl>.flex{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.registry-badges .chip{padding:18px 14px;display:flex;align-items:center;min-height:66px;line-height:1.6}
.registry-paths .grid>div{padding:36px;border-top:3px solid var(--ui-line);display:flex;flex-direction:column}
.registry-paths .grid>div>.btn-primary{align-self:flex-start;margin-top:auto}
.registry-paths h3{font-size:30px;line-height:1.25}
#gardenStrip{gap:0;border-top:1px solid var(--ui-line);border-left:1px solid var(--ui-line)}
#gardenStrip>div{border:0;border-right:1px solid var(--ui-line);border-bottom:1px solid var(--ui-line);padding:28px 24px;background:var(--ui-panel);display:flex;flex-direction:column;gap:4px}
#gardenStrip>div>a{display:inline-block;border-top:1px solid var(--ui-line);padding-top:16px;margin-top:auto}
#gardenStrip .font-serif{font-size:25px}
.registry-privacy{padding-top:72px;padding-bottom:72px}
.registry-close{padding-top:88px;padding-bottom:88px}
.gs-badge{bottom:14px;right:14px;font-size:8px;padding:7px 10px}
@media(max-width:1023px){.hero-record{padding-left:0;max-width:560px}.registry-hero>div{padding-top:56px;padding-bottom:56px}.registry-section{padding-top:64px;padding-bottom:64px}}
@media(max-width:639px){.registry-nav>div{min-height:76px;gap:12px;padding-left:20px;padding-right:20px}.registry-nav>div>a:first-child{font-size:10px;max-width:135px}.registry-nav .flex.items-center{gap:12px}.registry-nav .btn-outline{font-size:10px;padding:10px;min-height:40px;max-width:110px}#themeToggle{font-size:9px;padding-left:10px}.registry-hero h1{font-size:clamp(2.8rem,12vw,4rem)}.registry-hero>div{padding-top:42px;padding-bottom:44px}.registry-hero .hero-copy>p{font-size:16px}.hero-copy .btn-outline,.hero-copy .btn-signal{width:100%}.hero-copy>.flex:last-child{gap:5px 10px}.eco-card .card{padding:23px!important}.eco-card .score{font-size:90px}.eco-card .hero{padding:25px 20px}.registry-section{padding-top:48px;padding-bottom:48px}.registry-context .space-y-4{grid-template-columns:1fr}.registry-context .space-y-4>div{min-height:0;padding:24px}.registry-badges>.max-w-7xl>.flex{grid-template-columns:1fr 1fr;gap:8px}.registry-badges .chip{font-size:9px;padding:12px 10px}.registry-paths .grid>div{padding:26px}.gs-badge{position:static;display:block;text-align:center;border:0;border-bottom:1px solid var(--hair);padding:10px;opacity:.65}.gs-badge br{display:none}.registry-privacy h2{font-size:30px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}.fade-in{animation:none;opacity:1;transform:none}body,.bar-fill{transition:none}}
/* Keep endpoint tooltips inside the level track on narrow screens. */
.eco-card .dot:first-child::before{left:0;transform:translateY(3px)}
.eco-card .dot:first-child:hover::before{transform:translateY(0)}
.eco-card .dot:last-child::before{left:auto;right:0;transform:translateY(3px)}
.eco-card .dot:last-child:hover::before{transform:translateY(0)}

/* Navigation labels share one interface treatment; brand remains distinct. */
.registry-nav>div>.flex>a,.registry-nav #themeToggle{font-family:"IBM Plex Sans",sans-serif;font-size:13px;font-weight:400;letter-spacing:0;line-height:1.4}
.registry-nav>div>.flex>a{white-space:nowrap}
.registry-nav>div>.flex>.btn-outline{font-weight:500;max-width:none}
.registry-nav>div{min-height:76px}
html{scroll-padding-top:76px}
/* A screen per content section, with natural growth for longer content. */
@media(min-width:1024px){
 .registry-hero,.registry-section{min-height:calc(100svh - 76px);display:flex;align-items:center;scroll-margin-top:0}
 .registry-hero>div,.registry-section>div{width:100%}
 .registry-hero>div{padding-block:clamp(28px,5svh,64px)}
 .registry-section{padding-block:clamp(32px,5svh,64px)}
 .registry-hero h1{font-size:clamp(3.5rem,min(6.3vw,9.4svh),6.15rem)}
 .registry-section h2{font-size:clamp(2.1rem,min(3.4vw,6.4svh),3.4rem)}
}
@media(min-width:1024px) and (max-height:800px){
 .hero-copy>.chip{margin-bottom:20px}
 .registry-hero h1{margin-bottom:20px}
 .registry-hero .hero-copy>p{margin-bottom:22px;font-size:17px;line-height:1.6}
 .eco-card .card{padding:24px!important}
 .eco-card .hero{min-height:128px;padding:23px 20px}
 .eco-card .score{font-size:90px}
 .eco-card .ladder{margin-top:20px}
 .registry-context .space-y-4>div{min-height:0;padding:22px}
 .registry-paths .grid>div{padding:28px}
}
@media(max-width:639px){
 .registry-nav>div>.flex>a,.registry-nav #themeToggle{font-size:11px}
 .registry-nav>div>.flex>.btn-outline{max-width:110px;white-space:normal}
}
.registry-nav>div{min-height:72px;padding-top:12px;padding-bottom:12px}
.registry-nav .btn-outline{min-height:40px}
@media(min-width:1024px){.registry-hero.registry-hero{min-height:calc(100svh - 76px)}}
@media(min-width:1024px) and (max-height:800px){
 .registry-badges .chip{min-height:52px;padding:12px}
 .registry-badges .items-end{margin-bottom:24px}
 .registry-paths .grid>div{padding:24px}
 .registry-paths .grid>div>.chip{margin-bottom:16px}
 .registry-paths .grid>div>.space-y-2{margin-bottom:22px}
 .registry-paths h3{font-size:28px}
}
@media(min-width:1024px) and (max-height:800px){.registry-section{padding-block:30px}}
@media(min-width:1024px) and (max-height:800px){.registry-section.registry-section{padding-block:28px}.registry-paths .grid>div{padding:20px}}

/* The homepage preview uses the same highlighted panel as profile scorecards. */
.hero-record .eco-card .card{--ground:var(--fg);--ink:var(--bg);--ink-soft:var(--bg);--rule:color-mix(in srgb,var(--bg) 25%,transparent)}
.hero-record .eco-card .dot{border-color:var(--bg)}
.hero-record .eco-card .dot.here{background:var(--bg);border-color:var(--bg)}
.hero-record .eco-card .dot.here:after{border-color:var(--bg)}
.hero-record .eco-card .seg{background:color-mix(in srgb,var(--bg) 25%,transparent)}
.hero-record .eco-card .seg.done{background:var(--signal)}

/* Professional entry points remain at the top on small screens. */
.registry-mobile-audiences{display:none}
@media(min-width:768px) and (max-width:1199px){.registry-nav>div{flex-wrap:wrap;gap:10px}.registry-nav>div>.flex{width:100%;justify-content:space-between;gap:12px}}
@media(max-width:767px){.registry-nav>div{flex-wrap:wrap;row-gap:10px}.registry-mobile-audiences{display:flex;flex-basis:100%;gap:22px;font:11px/1.5 "IBM Plex Sans",sans-serif;padding-top:8px;border-top:1px solid var(--hair)}.registry-mobile-audiences a{color:var(--muted)}}
@media(min-width:1024px) and (max-width:1199px){html{scroll-padding-top:96px}.registry-hero.registry-hero,.registry-section{min-height:calc(100svh - 96px)}}

@media(max-width:767px){.registry-mobile-audiences{gap:12px 22px;flex-wrap:wrap}}