@font-face{font-family:'ZT Nature';font-style:normal;font-weight:400;font-display:swap;src:url('assets/fonts/zt-nature-regular.woff2') format('woff2')}
@font-face{font-family:'ZT Nature';font-style:normal;font-weight:600;font-display:swap;src:url('assets/fonts/zt-nature-semibold.woff2') format('woff2')}
@font-face{font-family:'ZT Nature';font-style:normal;font-weight:700;font-display:swap;src:url('assets/fonts/zt-nature-bold.woff2') format('woff2')}
@font-face{font-family:'ZT Nature';font-style:normal;font-weight:900;font-display:swap;src:url('assets/fonts/zt-nature-black.woff2') format('woff2')}
:root{--yellow:#ffcf19;--ink:#20211e;--paper:#f5f3e9;--muted:#77786e}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:'ZT Nature',Arial,Helvetica,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}a{color:inherit}.page{min-height:100svh;display:grid;grid-template-columns:1fr 1fr}.story{background:var(--yellow);position:relative;overflow:hidden;min-height:100svh;padding:40px 56px;display:flex;flex-direction:column;justify-content:space-between}.eyebrow{font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;display:flex;align-items:center;gap:12px}.mark{width:10px;height:10px;background:currentColor;clip-path:polygon(0 0,100% 50%,0 100%)}.edition{display:flex;justify-content:space-between;border-top:1px solid #20211e66;padding-top:20px;font-size:10px;letter-spacing:1.7px;font-weight:bold}.headline{font-size:clamp(74px,9.3vw,150px);font-weight:900;letter-spacing:-.09em;line-height:.88;margin:65px 0;position:relative;z-index:1}.headline .outline{color:transparent;-webkit-text-stroke:2px var(--ink)}.headline span{display:block}.graphic{position:absolute;right:-100px;top:34%;height:360px;width:360px;border:1px solid #20211e24;transform:rotate(45deg)}.graphic:after{content:"";position:absolute;inset:24px;border:1px solid #20211e24}.story-note{font-size:14px;line-height:1.65;max-width:230px;margin-bottom:48px}.content{display:flex;align-items:center;justify-content:center;position:relative;padding:72px 48px 40px}.profile{width:100%;max-width:410px}.topline{display:flex;justify-content:space-between;align-items:center;margin-bottom:53px;font-size:10px;letter-spacing:2px;text-transform:uppercase}.tiny-symbol{display:flex;gap:3px}.tiny-symbol i{display:block;width:8px;height:8px;background:var(--ink)}.tiny-symbol i:nth-child(2){background:var(--yellow)}.logo{width:100%;height:auto;display:block;mix-blend-mode:multiply;margin:0 auto 34px}.intro{text-align:center;margin:0 0 35px}.intro .tagline{font-size:10px;font-weight:700;letter-spacing:2.8px;text-transform:uppercase;margin:0 0 18px}.intro h1{font-size:24px;line-height:1.2;letter-spacing:-.8px;margin:0 0 11px;font-weight:700}.intro p{font-size:14px;line-height:1.65;margin:0;color:#686960}.links{display:grid;gap:12px}.link{width:100%;text-align:left;text-decoration:none;display:flex;align-items:center;gap:17px;border:1px solid var(--ink);background:transparent;padding:23px 22px;cursor:pointer;position:relative;transition:transform .2s,box-shadow .2s}.link.primary{background:var(--yellow);border-color:var(--yellow)}.link:hover{transform:translate(-3px,-3px);box-shadow:4px 4px 0 var(--ink)}.link:active{transform:translate(0,0);box-shadow:none}.link:focus-visible,.close:focus-visible{outline:3px solid var(--ink);outline-offset:5px}.icon{width:25px;height:25px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.link-text{display:flex;flex-direction:column;gap:6px}.link-text strong{font-size:16px;letter-spacing:-.3px}.link-text small{font-size:12px;color:#525349}.arrow{margin-left:auto;font-size:24px;font-weight:400}.services{margin:32px 0 0;display:flex;justify-content:center;gap:14px;align-items:center;font-size:9px;letter-spacing:1.7px;font-weight:bold;text-transform:uppercase}.services .dot{width:3px;height:3px;background:#99998f;border-radius:50%}.signature{margin-top:64px;border-top:1px solid #d7d7cb;padding-top:22px;display:flex;justify-content:space-between;align-items:center;font-size:9px;letter-spacing:1.7px;color:var(--muted);text-transform:uppercase}.signature .sign{font-weight:900;font-size:12px;color:var(--ink);letter-spacing:-.5px}.mobile-motto{display:none}dialog{border:0;padding:38px;background:var(--paper);color:var(--ink);max-width:390px;width:calc(100% - 40px);box-shadow:12px 12px 0 var(--yellow)}dialog::backdrop{background:#171915a8;backdrop-filter:blur(4px)}dialog h2{font-size:26px;letter-spacing:-1px;margin:14px 0}dialog p{font-size:14px;line-height:1.7;color:#5b5c52}.close{background:var(--ink);color:var(--paper);border:0;padding:14px 20px;cursor:pointer;margin-top:12px;width:100%}
@media(min-width:1600px){.story{padding:56px 80px}.content{padding:80px}.profile{max-width:440px}}
@media(max-width:760px){.page{display:block}.story{display:none}.content{padding:27px 24px 28px;min-height:100svh;align-items:flex-start;border-top:7px solid var(--yellow)}.profile{max-width:440px}.topline{margin-bottom:38px;font-size:9px}.logo{width:91%;margin-bottom:27px}.intro{margin-bottom:27px}.intro h1{font-size:23px}.intro p{font-size:13px}.intro .tagline{font-size:9px;margin-bottom:18px}.link{padding:22px 18px}.link-text strong{font-size:15px}.link-text small{font-size:11px}.services{margin-top:25px;font-size:8px;gap:11px}.mobile-motto{display:flex;background:var(--yellow);position:relative;overflow:hidden;margin:35px 0 0;padding:20px 22px;align-items:center;justify-content:flex-end}.mobile-motto p{margin:0;font-size:33px;font-weight:900;line-height:.95;letter-spacing:-1.9px}.triangles{display:flex;gap:7px}.triangles i{width:25px;height:35px;background:var(--ink);clip-path:polygon(0 0,100% 50%,0 100%)}.triangles i:last-child{transform:rotate(180deg)}.signature{margin-top:26px;padding-top:18px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.logo-colored{position:relative}.logo-colored img{display:block;width:100%;height:auto}.logo-colored svg{position:absolute;inset:0;width:100%;height:100%;fill:var(--yellow);pointer-events:none}.link[hidden]{display:none}.link-text{min-width:0}.link-text small{overflow-wrap:anywhere}
.footer-name{font-size:12px;font-weight:700;letter-spacing:1.2px;text-transform:none;white-space:nowrap;color:var(--ink)}

.hero-copy{position:relative;z-index:1;margin:40px 0;font-size:clamp(52px,6.7vw,110px);font-weight:900;line-height:.95;letter-spacing:-.065em}
.hero-copy span{display:block;animation:word-enter .7s both cubic-bezier(.2,.7,.3,1)}
.hero-copy span:nth-child(2){animation-delay:.12s}.hero-copy span:nth-child(3){animation-delay:.24s}.hero-copy span:nth-child(4){animation-delay:.36s}
.hero-outline{color:transparent;-webkit-text-stroke:1.5px var(--ink)}
@keyframes word-enter{from{opacity:0;transform:translateY(24px) rotate(-2deg)}to{opacity:1;transform:translateY(0) rotate(0)}}
.profile{max-width:540px}.links{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:1fr;gap:14px}
.links .link{display:grid;grid-template-columns:1fr auto;grid-template-rows:26px 1fr;align-items:start;gap:21px 10px;min-width:0;min-height:190px;padding:22px}
.links .icon{grid-column:1;grid-row:1}.links .arrow{grid-column:2;grid-row:1;line-height:1}
.links .link-text{grid-column:1 / -1;grid-row:2;gap:9px}.links .link-text strong{line-height:1.2}.links .link-text small{line-height:1.45}
.signature{justify-content:flex-end}
@media(max-width:760px){.profile{max-width:440px}.links{gap:10px}.links .link{padding:17px 13px;min-height:184px;gap:17px 8px}.links .link-text strong{font-size:15px}.links .link-text small{font-size:11px}.links .icon{width:24px;height:24px}}
@media(prefers-reduced-motion:reduce){.hero-copy span{animation:none}}

.page{min-height:100svh}.story{min-height:100svh;justify-content:center;padding:32px clamp(24px,4vw,64px)}
.hero-copy{margin:0;font-size:clamp(48px,min(6.2vw,14svh),100px)}.hero-copy span{animation:none}
.rotating-word{min-height:1em;white-space:nowrap}
.content{padding:24px clamp(20px,3vw,48px);min-height:0;align-items:center}.profile{max-width:500px}
.logo{width:min(82%,340px,43svh);margin:0 auto 20px}.intro{margin:0 0 20px}.intro p{font-size:13px;line-height:1.4}
.links{gap:12px}.links .link{min-height:0;padding:18px;grid-template-rows:22px 1fr;gap:14px 8px}.links .link-text{gap:6px}.links .link-text strong{font-size:15px}.links .link-text small{font-size:11px}.links .icon{width:22px;height:22px}.links .link[hidden]{display:none}
@media(max-width:760px){.page{display:flex;flex-direction:column;justify-content:center;min-height:100svh}.story{display:block;min-height:0;padding:20px 24px}.hero-copy{font-size:clamp(27px,7.5vw,42px);line-height:1.02;letter-spacing:-.05em}.hero-copy span{display:inline}.hero-copy span:nth-child(2)::after{content:"";display:block}.hero-copy span:not(:last-child)::before{content:" "}.hero-copy span:first-child::before{content:none}.story>div:last-child{position:relative}.graphic{display:none}.content{padding:18px 18px 22px;border:0;min-height:0;flex:1}.profile{max-width:440px}.logo{width:min(65%,250px,29svh);margin-bottom:14px}.intro{margin-bottom:14px}.intro p{font-size:12px}.links{gap:10px}.links .link{padding:13px;gap:10px 6px;grid-template-rows:20px 1fr}.links .link-text strong{font-size:14px}.links .link-text small{font-size:11px;line-height:1.35}.links .icon{width:20px;height:20px}}
@media(max-height:650px) and (min-width:761px){.logo{width:min(60%,230px);margin-bottom:12px}.intro{margin-bottom:12px}.links .link{padding:13px;gap:9px}.content{padding-top:16px;padding-bottom:16px}}
@media(max-height:700px) and (max-width:760px){.story{padding:13px 20px}.hero-copy{font-size:27px}.content{padding:12px 16px}.logo{width:min(55%,180px);margin-bottom:10px}.intro{margin-bottom:10px}.links .link{padding:11px;gap:7px}.links .link-text strong{font-size:13px}}
@media(min-width:761px){.profile{max-width:460px}.links{gap:10px}.links .link{padding:14px;gap:9px 8px;grid-template-rows:20px 1fr}.links .link-text strong{font-size:14px}.links .icon{width:20px;height:20px}}

/* Mobile layout and monochrome arrows, including iOS. */
.links .link,.links .link:visited{color:var(--ink)}
.links .arrow{width:24px;height:24px;fill:none;stroke:var(--ink);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:760px){
 .page{justify-content:flex-start}
 .story{padding:24px 22px}
 .hero-copy{font-size:clamp(30px,8.6vw,44px);line-height:1.06;letter-spacing:-.045em}
 .hero-copy .rotating-word::before{content:" "}
 
 .content{padding:clamp(22px,4svh,38px) 18px max(24px,env(safe-area-inset-bottom));align-items:stretch}
 .profile{display:flex;flex-direction:column;justify-content:space-evenly;gap:clamp(18px,3svh,28px)}
 .logo{width:min(90%,330px);margin:0 auto}
 .intro{margin:0}.intro p{font-size:14px;line-height:1.45}
 .links{gap:12px}
 .links .link{min-height:clamp(142px,20svh,182px);padding:16px;gap:16px 8px;grid-template-rows:24px 1fr}
 .links .icon{width:24px;height:24px}
 .links .link-text strong{font-size:15px;line-height:1.2}
 .links .link-text small{font-size:12px;line-height:1.4}
}
@media(max-width:760px) and (max-height:700px){
 .story{padding:16px 20px}.hero-copy{font-size:29px}
 .content{padding:18px 16px}.profile{gap:14px}
 .logo{width:min(73%,245px)}.intro p{font-size:12px}
 .links .link{min-height:126px;padding:12px;gap:10px 6px}
 .links .link-text strong{font-size:14px}.links .link-text small{font-size:11px}
}

@media(max-width:760px){
 .content{flex:1;padding:24px 18px;align-items:flex-start}
 .profile{justify-content:flex-start;gap:18px}
 .logo{width:min(92%,350px);margin:0 auto}
 .intro{margin:0 0 4px}
 .links .link{min-height:clamp(145px,22svh,195px)}
 .links .arrow,.links .arrow path{stroke:#20211e!important;color:#20211e!important;fill:none!important}
}
@media(max-width:760px) and (max-height:700px){
 .content{padding:18px 16px}.profile{gap:14px}.logo{width:min(78%,260px)}
 .links .link{min-height:126px}
}

/* Filled CSS shapes keep arrows monochrome on every browser. */
.links .arrow{display:block;position:relative;width:24px;height:24px;margin:0;justify-self:end}
.links .arrow::before{content:"";position:absolute;width:23px;height:2px;background:#20211e;top:11px;left:0;transform:rotate(-45deg)}
.links .arrow::after{content:"";position:absolute;top:3px;right:3px;width:13px;height:13px;border-top:2px solid #20211e;border-right:2px solid #20211e}
@media(max-width:760px){
 .page{min-height:100svh}
 .story{padding:25px 22px}
 .content{padding:32px 18px max(26px,env(safe-area-inset-bottom));align-items:stretch}
 .profile{min-height:calc(100svh - 176px);justify-content:space-between;gap:26px}
 .logo{width:min(89%,320px);margin:0 auto}
 .intro{margin:0}.intro p{font-size:14px;line-height:1.5}
 .links{gap:16px}
 .links .link{min-height:clamp(138px,18svh,168px);padding:16px;gap:15px 8px}
 .links .link-text strong{font-size:15px}.links .link-text small{font-size:12px}
}
@media(max-width:760px) and (max-height:700px){
 .story{padding:18px 20px}.content{padding:22px 16px}.profile{min-height:calc(100svh - 146px);gap:20px}
 .logo{width:min(78%,240px)}.intro p{font-size:12px}
 .links{gap:12px}.links .link{min-height:120px;padding:12px;gap:10px}.links .link-text strong{font-size:14px}.links .link-text small{font-size:11px}
}

/* HOOD yellow-to-black background and prominent logo. */
.content{background:linear-gradient(165deg,#ffcf19 0%,#f2c41a 38%,#655619 65%,#10110f 100%)}
.links .link{background:#f5f3e9;border-color:#f5f3e9}
.links .link.primary{background:#ffcf19;border-color:#ffcf19}
.logo{width:min(96%,410px)}
@media(max-width:760px){
 .page{background:linear-gradient(165deg,#ffcf19 0%,#ffcf19 40%,#9b7f1a 56%,#24251c 77%,#080907 100%)}
 .story,.content{background:transparent}
 .logo{width:100%;max-width:420px;margin:0 auto}
 .intro p{color:#20211e}
 .profile{gap:26px}
}
@media(max-width:760px) and (max-height:700px){
 .logo{width:min(96%,340px)}.profile{gap:20px}
}

/* Dark HOOD surface with a restrained yellow glow; keep brand yellow exact. */
:root{color-scheme:dark}
body{background:#10110f}
.page{background:#10110f;background-image:radial-gradient(ellipse at 85% 0%,rgba(255,207,25,.17) 0%,rgba(255,207,25,.045) 24%,transparent 52%);color:#f5f3e9}
.story,.content{background:transparent}
.hero-copy{color:#f5f3e9}
.hero-outline{color:transparent;-webkit-text-stroke-color:#ffcf19}
.graphic,.graphic:after{border-color:rgba(255,207,25,.12)}

.logo{mix-blend-mode:normal}
.logo-colored img{filter:invert(1);mix-blend-mode:screen}
.logo-colored svg{fill:#ffcf19;mix-blend-mode:normal}
.logo-colored polygon{fill:#ffcf19}
.intro p{color:#dddcd4}
.links .link,.links .link:visited{color:#20211e}
.links .link.primary{background:#ffcf19;border-color:#ffcf19}
.links .link:not(.primary){background:#f5f3e9;border-color:#f5f3e9}
.link:focus-visible{outline-color:#ffcf19}
dialog{color-scheme:light}
@media(max-width:760px){
 .page{background:#10110f;background-image:radial-gradient(ellipse 110% 52% at 88% 0%,rgba(255,207,25,.18) 0%,rgba(255,207,25,.04) 35%,transparent 75%)}
 .story,.content{background:transparent}
 .story{padding-top:26px;padding-bottom:24px}
 .intro p{color:#dddcd4}
}
@media(prefers-reduced-motion:reduce){.link{transform:none!important}}

.hero-outline{-webkit-text-stroke:1.5px #ffcf19}
.hero-outline.rotating-word{color:#ffcf19;-webkit-text-stroke:0}
@media(max-width:760px){.profile{min-height:0}}

/* Keep link typography consistent with the logo designer’s type family. */
@media(max-width:760px){
 .links .link-text strong{font-family:inherit;font-weight:700;font-size:clamp(16px,4.45vw,18px);letter-spacing:0;text-transform:none;line-height:1.15}
}
@media(max-width:760px) and (max-height:700px){.links .link-text strong{font-size:16px}}

/* Single-screen trial: lock the document and size the page to the visible viewport. */
html,body{height:100%;overflow:hidden;overscroll-behavior:none}
body{position:fixed;inset:0;width:100%}
.page{height:100%;height:100dvh;min-height:0;overflow:hidden;grid-template-rows:minmax(0,1fr)}
.story{height:100%;min-height:0}
.content{min-height:0;max-height:100%}
dialog{max-height:calc(100dvh - 32px);overflow:auto;overscroll-behavior:contain}
@media(max-width:760px){
 .page{height:100dvh;min-height:0}
 .story{height:auto;min-height:0;flex:0 0 auto}
 .content{min-height:0;flex:1}
 .profile{min-height:0}
}
@media(max-width:760px) and (max-height:620px) and (orientation:portrait){
 .story{padding:14px 18px}.hero-copy{font-size:26px}
 .content{padding:12px 14px}.profile{gap:12px}
 .logo{width:min(82%,220px)}.intro p{font-size:11px;line-height:1.3}
 .links{gap:10px}.links .link{min-height:0;padding:9px;gap:8px 6px;grid-template-rows:18px 1fr}
 .links .icon{width:18px;height:18px}.links .link-text{gap:4px}
 .links .link-text strong{font-size:15px}.links .link-text small{font-size:10px;line-height:1.3}
}
@media(max-width:760px) and (max-height:500px) and (orientation:landscape){
 .story{padding:10px 18px}.hero-copy{font-size:26px}
 .content{padding:10px 18px}
 .profile{max-width:none;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);grid-template-rows:auto auto;gap:10px 22px;align-items:center;align-content:center}
 .logo{grid-column:1;grid-row:1;width:min(100%,220px);margin:0 auto}
 .intro{grid-column:1;grid-row:2;margin:0}.intro p{font-size:11px;line-height:1.3}
 .links{grid-column:2;grid-row:1 / span 2;gap:10px}
 .links .link{min-height:0;padding:9px;gap:7px 6px;grid-template-rows:16px 1fr}
 .links .icon{width:16px;height:16px}.links .arrow{width:20px;height:20px}
 .links .link-text{gap:4px}.links .link-text strong{font-size:14px}.links .link-text small{font-size:10px;line-height:1.3}
}
@media(min-width:761px) and (max-height:560px){
 .story{padding:20px clamp(24px,4vw,64px)}.hero-copy{font-size:clamp(36px,12dvh,64px)}
 .content{padding-top:14px;padding-bottom:14px}
 .logo{width:min(52%,200px);margin-bottom:10px}.intro{margin-bottom:10px}.intro p{font-size:12px;line-height:1.3}
 .links .link{padding:10px;gap:7px 6px;grid-template-rows:16px 1fr}
 .links .icon{width:16px;height:16px}.links .link-text{gap:4px}
 .links .link-text strong{font-size:13px}.links .link-text small{font-size:10px;line-height:1.25}
}

/* The legal line uses the lower safe area without adding page scroll. */
.site-legal{position:absolute;left:14px;right:14px;bottom:calc(5px + env(safe-area-inset-bottom));margin:0;text-align:center;font-size:10px;line-height:1.3;letter-spacing:.4px;color:#c0c0b5;pointer-events:none}
@media(max-width:760px){.content{padding-bottom:calc(26px + env(safe-area-inset-bottom))}}
@media(max-width:760px) and (max-height:620px) and (orientation:portrait){.content{padding-bottom:calc(28px + env(safe-area-inset-bottom))}}

/* ZT Nature keeps display type confident without squeezing the letterforms. */
.hero-copy{font-weight:700;letter-spacing:-.05em}
@media(max-width:760px){.hero-copy{letter-spacing:-.03em}}

/* Compact, reachable legal links; reserve their space on the single-screen home. */
.site-legal{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;column-gap:12px;row-gap:0;bottom:calc(3px + env(safe-area-inset-bottom));font-size:10.5px;line-height:1.4;letter-spacing:.1px;pointer-events:auto;z-index:2}
.site-legal a{display:inline-block;padding:6px 0;color:#deded5;text-decoration:underline;text-decoration-color:#77786e;text-underline-offset:3px;white-space:nowrap}
.site-legal a:hover{color:#ffcf19;text-decoration-color:currentColor}
.site-legal a:focus-visible{outline:2px solid #ffcf19;outline-offset:3px}
.content{padding-bottom:calc(40px + env(safe-area-inset-bottom))}
@media(max-width:760px){.content{padding-bottom:calc(40px + env(safe-area-inset-bottom))}}