:root{--paper:#e8edeb;--ink:#102431;--muted:#60716e;--navy:#07111b;--cyan:#24d3ee;--blue:#2e7bff;--line:rgba(16,36,49,.17);--display:'Zodiak',Georgia,serif;--body:'General Sans',Arial,sans-serif;--mono:'DM Mono',monospace}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}.skip-link{position:absolute;left:14px;top:-60px;background:var(--cyan);padding:10px;color:var(--navy);z-index:20;font-weight:700}.skip-link:focus{top:14px}.site-header{height:82px;padding:0 clamp(20px,4vw,72px);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;background:var(--navy);color:#edf6f8}.brand img{display:block;width:auto;height:29px}.header-label{margin:0;color:#9dadb6;font:500 10px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase}.contact-pill{justify-self:end;padding:12px 17px;border-radius:999px;background:linear-gradient(100deg,var(--cyan),var(--blue));color:var(--navy);font-size:13px;font-weight:700}.contact-pill span{margin-left:6px}.hero{position:relative;overflow:hidden;min-height:calc(100svh - 82px);width:min(1240px,calc(100% - 48px));margin:auto;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(300px,.72fr);gap:60px;align-items:center;padding:105px 0}.hero-copy{position:relative;z-index:2}.eyebrow{display:flex;align-items:center;gap:11px;margin:0 0 24px;color:var(--blue);font:500 10px/1 var(--mono);letter-spacing:.15em;text-transform:uppercase}.eyebrow span{display:block;width:25px;height:1px;background:currentColor}h1{max-width:9ch;margin:0;font:500 clamp(64px,9.3vw,130px)/.79 var(--display);letter-spacing:-.085em}h1 em{color:#267ed8;font-style:italic}.hero-lead{max-width:41ch;margin:34px 0 0;color:var(--muted);font-size:19px;line-height:1.48}.hero-link{display:inline-flex;gap:12px;margin-top:38px;padding-bottom:7px;border-bottom:1px solid var(--ink);font-size:14px;font-weight:700}.hero-note{position:relative;z-index:2;align-self:end;max-width:310px;padding:24px 0 4px 28px;border-left:2px solid #cc6049}.hero-note p{margin:0;color:#314750;font:500 23px/1.18 var(--display);letter-spacing:-.045em}.hero-note span{display:block;margin-top:16px;color:#6c7d79;font:500 10px/1.4 var(--mono);letter-spacing:.09em;text-transform:uppercase}.hero-orbit{position:absolute;border-radius:50%;pointer-events:none}.orbit-a{width:710px;height:710px;right:-350px;top:-340px;border:1px solid rgba(46,123,255,.28);box-shadow:0 0 0 40px rgba(36,211,238,.05),0 0 0 92px rgba(46,123,255,.025)}.orbit-b{width:360px;height:360px;right:5%;bottom:-235px;background:radial-gradient(circle,rgba(36,211,238,.17),transparent 67%)}.cases{border-top:1px solid var(--line);padding:0 clamp(20px,4vw,72px) 100px}.section-head{max-width:1240px;margin:auto;padding:27px 0 31px;display:flex;justify-content:space-between;gap:30px;align-items:end}.section-head h2{max-width:15ch;margin:0;font:500 25px/1.02 var(--display);letter-spacing:-.055em}.section-head p{max-width:29ch;margin:0;color:var(--muted);font-size:13px;line-height:1.4}.case-grid{max-width:1240px;margin:auto;display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:14px}.case{position:relative;min-height:530px;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;padding:20px;transition:transform .38s cubic-bezier(.16,1,.3,1),box-shadow .38s}.case:hover{transform:translateY(-8px);box-shadow:0 28px 42px rgba(16,36,49,.17)}.case-meta{position:relative;z-index:3;display:flex;justify-content:space-between;gap:10px;font:500 9px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase}.case-fashion{background:#263545;color:#f3f2ed}.case-home{background:#e6efe0;color:#1e3b30}.case-roots{background:#27352b;color:#f3ecdf}.case-copy{position:relative;z-index:3;display:grid;grid-template-columns:1fr auto;gap:10px;align-items:end}.case-copy h3{margin:0;font:500 clamp(34px,4vw,53px)/.82 var(--display);letter-spacing:-.08em}.case-copy p{margin:7px 0 0;font-size:12px;opacity:.78}.case-arrow{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#fff;color:var(--ink);font-size:19px}.fashion-canvas,.home-canvas,.roots-canvas{position:absolute;inset:0}.fashion-figure{position:absolute;right:-5%;bottom:0;width:65%;height:82%;background:linear-gradient(145deg,#8494a9,#b23350 55%,#1e2531 56%);clip-path:polygon(48% 0,80% 3%,100% 100%,0 100%,16% 25%)}.fashion-figure:after{content:'';position:absolute;inset:33% 28% 0;background:#e7e6e0;clip-path:polygon(42% 0,82% 7%,100% 100%,0 100%)}.fashion-paper{position:absolute;z-index:2;left:8%;top:25%;width:54%;min-height:205px;padding:17px;background:#eceeea;color:#172230;box-shadow:16px 17px 0 rgba(0,0,0,.18);transform:rotate(-5deg);display:flex;flex-direction:column}.fashion-paper span{font:500 9px/1 var(--mono);letter-spacing:.11em}.fashion-paper b{margin-top:32px;font:500 34px/.84 var(--display);letter-spacing:-.07em}.fashion-paper i{margin-top:auto;font:700 10px/1 var(--body);font-style:normal}.fashion-curve{position:absolute;width:320px;height:320px;border:1px solid rgba(244,242,237,.5);border-radius:50%;right:-190px;top:25%}.home-sun{position:absolute;width:290px;height:290px;border-radius:50%;background:rgba(218,161,67,.42);right:-125px;top:13%}.home-ui{position:absolute;z-index:2;left:13%;top:28%;width:72%;padding:15px;background:#f7f8f3;box-shadow:13px 15px 0 rgba(34,61,48,.12);transform:rotate(3deg);display:flex;flex-direction:column;gap:11px}.home-ui strong{font-size:17px;letter-spacing:-.05em}.home-ui small{max-width:14ch;font-size:12px;line-height:1.1}.home-ui b{align-self:start;padding:7px 8px;background:#355d43;color:#eff4eb;font-size:8px}.shelf{position:absolute;left:0;right:0;bottom:0;height:35%;padding:0 16px;display:grid;grid-template-columns:1.1fr .76fr .94fr .6fr;gap:8px;align-items:end;border-bottom:5px solid #355d43}.shelf i{height:82%;background:#9dbd9f;border-radius:40px 40px 0 0}.shelf i:nth-child(2){height:54%;background:#ddaa52;border-radius:50% 50% 0 0}.shelf i:nth-child(3){height:70%;background:#6b8e72;border-radius:8px 8px 0 0}.shelf i:nth-child(4){height:44%;background:#c5d8b7;border-radius:14px 14px 0 0}.roots-copy{position:absolute;z-index:2;top:25%;left:9%;font:500 clamp(37px,4vw,58px)/.8 var(--display);letter-spacing:-.08em}.roots-copy i{color:#d8a86b}.roots-stamp{position:absolute;z-index:2;right:13%;top:27%;display:grid;place-items:center;width:90px;height:90px;border:1px solid #d8a86b;border-radius:50%;color:#d8a86b;font:500 9px/1.25 var(--mono);letter-spacing:.07em;text-align:center;transform:rotate(12deg)}.weave{position:absolute;left:0;right:0;bottom:0;height:38%;display:grid;grid-template-columns:repeat(6,1fr);gap:0;overflow:hidden}.weave b:nth-child(1),.weave b:nth-child(4){background:#a35c42}.weave b:nth-child(2),.weave b:nth-child(5){background:#ddaf70}.weave b:nth-child(3),.weave b:nth-child(6){background:#446052}.weave b{position:relative}.weave b:after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(39,53,43,.68) 0 8px,transparent 8px 20px)}.manifesto{padding:clamp(75px,12vw,150px) max(20px,calc((100vw - 1096px)/2));background:var(--navy);color:#edf5f5}.manifesto .light{color:#76e3f4}.manifesto h2{max-width:10ch;margin:0;font:500 clamp(48px,7vw,102px)/.83 var(--display);letter-spacing:-.08em}.manifesto h2 em{color:var(--cyan);font-style:italic}.manifesto>p:not(.eyebrow){max-width:39ch;margin:31px 0;color:#a9bac1;font-size:18px;line-height:1.5}.manifesto a{display:inline-flex;gap:12px;padding:15px 19px;border-radius:999px;background:linear-gradient(100deg,var(--cyan),var(--blue));color:var(--navy);font-weight:700;font-size:14px}footer{min-height:90px;padding:0 clamp(20px,4vw,72px);display:flex;align-items:center;justify-content:space-between;gap:20px;background:#0b1822;color:#a8bac1;font-size:12px}footer img{height:23px;width:auto}footer a{color:#eef6f7}@media(max-width:860px){.site-header{grid-template-columns:1fr auto}.header-label{display:none}.hero{grid-template-columns:1fr;min-height:auto;padding:83px 0 77px;gap:42px}.hero-note{align-self:auto}.case-grid{grid-template-columns:1fr}.case{min-height:470px}.section-head{align-items:start;flex-direction:column}.case-copy h3{font-size:48px}}@media(max-width:470px){.site-header{height:70px;padding:0 15px}.brand img{height:22px}.contact-pill{padding:10px 12px;font-size:12px}.hero{width:calc(100% - 32px);padding:64px 0}.hero-lead{font-size:17px}.cases{padding:0 16px 65px}.case{min-height:420px}.case-meta{font-size:8px}.roots-stamp{width:74px;height:74px;font-size:8px}.manifesto{padding:75px 20px}footer{padding:24px 20px;align-items:flex-start;flex-direction:column}}

/* motion-signature-portfolio: each case behaves like its own living artboard. */
::selection { background: var(--cyan); color: var(--navy); }
:focus-visible { outline: 3px solid var(--cyan); outline-offset: 4px; }
.contact-pill,.manifesto a,.case-arrow { transition: transform .28s cubic-bezier(.16,1,.3,1), box-shadow .28s, filter .28s; }
.contact-pill:hover,.manifesto a:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(36,211,238,.24); filter: saturate(1.08); }
.hero-link:hover { color: #267ed8; }
.hero-link:hover span { transform: translateX(5px); }
.hero-link span,.case-arrow { transition: transform .28s cubic-bezier(.16,1,.3,1); }
.case { --pointer-x:0; --pointer-y:0; transform: perspective(1200px) rotateX(calc(var(--pointer-y) * -1deg)) rotateY(calc(var(--pointer-x) * 1deg)); transform-style: preserve-3d; }
.case:hover { transform: perspective(1200px) translateY(-8px) rotateX(calc(var(--pointer-y) * -1.5deg)) rotateY(calc(var(--pointer-x) * 1.5deg)); }
.case:hover .case-arrow { transform: translate(3px,-3px) rotate(-7deg); }
.fashion-canvas,.home-canvas,.roots-canvas { transition: transform .7s cubic-bezier(.16,1,.3,1); }
.case:hover .fashion-canvas,.case:hover .home-canvas,.case:hover .roots-canvas { transform: scale(1.025); }
.fashion-paper { transition: transform .65s cubic-bezier(.16,1,.3,1), box-shadow .65s; }
.case-fashion:hover .fashion-paper { transform: translate(-5px,-9px) rotate(-7deg); box-shadow: 22px 25px 0 rgba(0,0,0,.16); }
.fashion-figure { transition: transform .8s cubic-bezier(.16,1,.3,1); transform-origin: bottom; }
.case-fashion:hover .fashion-figure { transform: scale(1.035) skewX(-1.5deg); }
.home-ui { transition: transform .65s cubic-bezier(.34,1.56,.64,1),box-shadow .65s; }
.case-home:hover .home-ui { transform: translateY(-10px) rotate(1deg); box-shadow: 17px 20px 0 rgba(34,61,48,.13); }
.shelf i { transition: height .55s cubic-bezier(.34,1.56,.64,1),transform .55s; }
.case-home:hover .shelf i:nth-child(1) { height:91%; }
.case-home:hover .shelf i:nth-child(2) { height:65%; transition-delay:.04s; }
.case-home:hover .shelf i:nth-child(3) { height:78%; transition-delay:.08s; }
.case-home:hover .shelf i:nth-child(4) { height:55%; transition-delay:.12s; }
.roots-stamp { transition: transform .7s cubic-bezier(.16,1,.3,1); }
.case-roots:hover .roots-stamp { transform: rotate(-5deg) scale(1.08); }
.weave b:after { transition: transform .75s cubic-bezier(.16,1,.3,1); }
.case-roots:hover .weave b:nth-child(odd):after { transform: translateY(-14px); }
.case-roots:hover .weave b:nth-child(even):after { transform: translateY(14px); }
.motion-ready .motion-reveal { opacity:0; transform:translateY(28px); filter:blur(7px); transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1),filter .8s; transition-delay:calc(var(--reveal-order,0) * 85ms); }
.motion-ready .motion-reveal.is-visible { opacity:1; transform:translateY(0); filter:blur(0); }
.orbit-a { animation:portfolio-orbit 18s linear infinite; }
.orbit-b { animation:portfolio-pulse 7s ease-in-out infinite; }
@keyframes portfolio-orbit { to { transform:rotate(360deg); } }
@keyframes portfolio-pulse { 50% { transform:scale(1.12); opacity:.7; } }
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto}.motion-ready .motion-reveal,.motion-ready .motion-reveal.is-visible,.case,.case:hover,.fashion-canvas,.home-canvas,.roots-canvas,.orbit-a,.orbit-b,.fashion-paper,.fashion-figure,.home-ui,.shelf i,.roots-stamp,.weave b:after{animation:none!important;transition:none!important;transform:none!important;filter:none!important;opacity:1!important} }
