/* Brand tokens. Intentional brand-to-brand scene changes from the approved brief.
   DESIGN_VARIANCE 8 / MOTION_INTENSITY 6 / VISUAL_DENSITY 3.
   Native CSS aesthetic, inspired by composition at Metalab, Linear and Flighty.
   Layers: page 0, header 10, mobile navigation 11, native dialog top layer.
   Radius rules: pill controls; 20px artwork; device corners follow phone geometry. */
:root{--navy:#001639;--ivory:#FFFEF0;--purple:#7851A9;--ink-soft:#506078;--ease:cubic-bezier(.16,1,.3,1);--grae-forest:#1E2A25;--grae-ivory:#F2EFEA;--grae-orange:#E4572E;--grae-gray:#6B6B6B;--page-width:1440px;--gutter:clamp(24px,5vw,88px)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:var(--ivory);color:var(--navy);font-family:Arial,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}
button{border:0}button:active,.button:active{transform:scale(.97)}img{display:block}p,h1,h2,h3{margin:0}button:focus-visible,a:focus-visible{outline:3px solid var(--purple);outline-offset:6px}::selection{background:var(--purple);color:var(--ivory)}[hidden]{display:none!important}
.container{max-width:var(--page-width);margin-inline:auto;padding-inline:var(--gutter)}
.skip-link{position:fixed;top:10px;left:10px;transform:translateY(-150%);z-index:20;padding:14px;background:var(--navy);color:var(--ivory)}.skip-link:focus{transform:translateY(0)}
.logo{display:block;position:relative;overflow:hidden;width:190px;isolation:isolate}.logo img{position:absolute;max-width:none;height:auto}
.logo-trade{aspect-ratio:1306/212}.logo-trade img{width:132.772%;left:-19.296%;top:-95.755%}
.logo-studio{aspect-ratio:1380/212}.logo-studio img{width:125.652%;left:-15.435%;top:-95.755%}
.logo-grae{aspect-ratio:962/323}.logo-grae img{width:113.3056%;left:-6.6528%;top:-19.8142%}
.logo-rami{aspect-ratio:615/212}.logo-rami img{width:281.952%;left:-95.935%;top:-95.755%}
.site-header{height:76px;position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:32px;padding-inline:var(--gutter);background:rgba(255,254,240,.96);border-bottom:1px solid rgba(0,22,57,.08)}
.brand .logo{width:178px;flex-shrink:0}.desktop-nav{display:flex;align-items:center;gap:26px;margin-left:auto;white-space:nowrap}.desktop-nav a{font-size:13px;letter-spacing:.015em;position:relative;height:44px;display:flex;align-items:center;justify-content:center;padding:0;font-weight:700}.desktop-nav a:after{content:"";position:absolute;height:2px;background:var(--purple);left:0;right:0;bottom:5px;transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}.desktop-nav a:hover:after,.desktop-nav a.active:after{transform:scaleX(1)}
.header-actions{display:flex;align-items:center;gap:18px}.motion-toggle{width:38px;height:38px;border:1px solid rgba(0,22,57,.16);background:none;border-radius:50%;display:grid;place-items:center}.motion-bars{display:flex;align-items:center;gap:3px;height:14px}.motion-bars i{width:2px;height:6px;background:var(--navy)}.motion-bars i:nth-child(2){height:14px}.motion-bars i:nth-child(3){height:10px}.motion-toggle[aria-pressed="true"] .motion-bars i{height:2px}.menu-toggle{display:none}.mobile-nav{display:none}
.language-switch{display:flex;gap:2px;align-items:center;flex-shrink:0}.language-switch a{display:grid;place-items:center;min-width:28px;min-height:40px;font-size:12px;font-weight:600;letter-spacing:.04em;color:var(--ink-soft);position:relative}.language-switch a[aria-current="page"]{color:var(--navy)}.language-switch a[aria-current="page"]:after{content:"";position:absolute;left:6px;right:6px;bottom:8px;height:2px;background:var(--purple)}.language-switch a:hover{color:var(--purple)}
.route-filing{font-size:14px;line-height:1.7;color:var(--grae-forest)}
.hero{min-height:min(770px,calc(100svh - 76px));padding-block:70px 64px;display:grid;grid-template-columns:1.65fr 1fr;gap:44px;align-items:center}.hero-copy{position:relative;z-index:1}.eyebrow{font-size:13px;text-transform:uppercase;letter-spacing:.14em;margin-bottom:30px;font-weight:600}.hero h1{font-size:clamp(56px,6.55vw,105px);line-height:1.02;letter-spacing:-.064em;font-weight:600;white-space:nowrap}.hero h1 span{color:var(--purple)}.hero-description{font-size:17px;line-height:1.65;margin-top:32px;letter-spacing:-.03em}.text-link{display:inline-flex;align-items:center;gap:38px;font-size:13px;font-weight:600;white-space:nowrap}.hero .text-link{margin-top:33px}.arrow{font-size:23px;transition:transform .35s var(--ease)}.text-link:hover .arrow{transform:translate(4px,-4px)}.hero .text-link:hover .arrow{transform:translate(4px,4px)}
.hero-art{aspect-ratio:.9;max-height:470px;position:relative;overflow:hidden;background:var(--navy);border-radius:20px;align-self:center;transform:rotate(-3deg);transition:transform .8s var(--ease)}.hero-art:hover{transform:rotate(0deg)}.art-disc{position:absolute;width:82%;aspect-ratio:1;left:35%;top:-5%;border-radius:50%;background:var(--purple)}.hero-symbol{width:88%;position:absolute;bottom:14%;left:6%;transform:rotate(3deg)}.art-line{position:absolute;height:1px;width:145%;background:rgba(255,254,240,.3);top:40%;left:-22%;transform:rotate(-37deg)}
.about-section{border-top:1px solid rgba(0,22,57,.15)}.about-intro{padding-block:82px 60px}.about-intro .eyebrow{margin-bottom:22px;color:var(--ink-soft)}.about-intro h2,.contact-body h2{font-size:clamp(48px,5.6vw,80px);font-weight:500;letter-spacing:-.06em;line-height:1.1}.about-lead{max-width:910px;margin-top:30px;font-size:clamp(18px,1.7vw,23px);line-height:1.75;letter-spacing:-.025em;text-wrap:pretty}
.brand-intro{padding-block:0 96px;display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:start}.company-parent{border-top:1px solid rgba(0,22,57,.15);padding-top:30px}.company-parent .logo{width:260px;max-width:100%}.company-role{margin-top:16px;font-size:14px;color:var(--ink-soft)}.company-statement{margin-top:38px;font-size:clamp(29px,3.2vw,44px);line-height:1.35;letter-spacing:-.045em}.brand-directory{display:grid;border-top:1px solid rgba(0,22,57,.15);padding-top:30px}.brand-connector{display:none}.brand-connector path{fill:none;stroke:currentColor;stroke-width:1;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.directory-item{display:flex;justify-content:space-between;align-items:start;gap:20px;padding:0 0 28px}.directory-item+ .directory-item{padding-top:28px;border-top:1px solid rgba(0,22,57,.15)}.directory-item .logo{width:222px;max-width:100%}.directory-item p{margin-top:13px;font-size:14px;color:var(--ink-soft)}.directory-item .directory-description{font-size:14px;line-height:1.75;letter-spacing:-.015em;color:var(--navy);margin-top:18px}.directory-arrow{font-size:30px;transition:transform .4s var(--ease)}.directory-item:hover .directory-arrow{transform:translate(5px,-5px)}.directory-item .grae-mini{width:130px}
.studio-section{background:#040e1e;color:var(--ivory);border-radius:24px 24px 0 0;position:relative;overflow:hidden;padding-bottom:24px}.studio-intro{padding-top:65px;position:relative;min-height:700px;isolation:isolate}.studio-brand{display:inline-flex;align-items:center;position:relative;z-index:1}.studio-brand .logo{width:232px}.studio-headline{position:relative;z-index:1;margin-top:100px}.studio-headline h2{font-size:clamp(56px,6.65vw,105px);line-height:1.02;letter-spacing:-.06em;font-weight:500}.studio-headline h2 span{color:#abb4c6}.studio-headline p{margin-top:28px;font-size:16px;color:#d3d7df;letter-spacing:-.02em}.studio-product-link{margin-top:28px;min-height:44px;gap:20px;color:var(--ivory)}.studio-product-link .arrow{color:#c1a8e0}.studio-product-link:hover{color:#d5c1ed}.studio-product-link:hover .arrow{transform:translateY(4px)}.studio-product-link:focus-visible{outline-color:#c1a8e0}.studio-sculpture{position:absolute;inset:0 -15% 0 20%;z-index:-1;pointer-events:none}.studio-sculpture img{height:100%;width:100%;object-fit:cover;opacity:.68;mix-blend-mode:screen}.studio-sculpture:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#040e1e 0%,transparent 62%),linear-gradient(0deg,#040e1e,transparent 30%)}
.backten-showcase{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:50px;min-height:790px;padding-bottom:60px}.backten-copy{padding-block:50px}.product-status{font-size:14px;color:#c1a8e0;margin-bottom:20px}.backten-copy h3{font-size:clamp(65px,7vw,106px);font-weight:500;letter-spacing:-.06em}.accent-period{color:var(--purple)}.product-description{font-size:17px;line-height:1.75;color:#c6ccd8;margin:25px 0 32px;letter-spacing:-.025em}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:30px;padding:17px 25px;border-radius:999px;font-size:13px;font-weight:600;white-space:nowrap;transition:transform .3s var(--ease),background .3s var(--ease)}.button-light{background:var(--ivory);color:var(--navy)}.button-light:hover{background:#e6dff0;transform:translateY(-3px)}.button-dark{background:var(--navy);color:var(--ivory)}.button-dark:hover{background:var(--purple);transform:translateY(-3px)}.button span{font-size:20px}.release-note{margin-top:18px;font-size:13px;color:#9aa6ba}
.device-stage{position:relative;perspective:1200px;display:flex;align-items:center;flex-direction:column;padding-top:35px}.device-light{position:absolute;width:380px;height:450px;top:40px;background:radial-gradient(ellipse,rgba(120,81,169,.24),transparent 65%);pointer-events:none}.phone{width:264px;height:540px;padding:8px;border-radius:48px;background:linear-gradient(125deg,#79818f,#171e2a 35%,#596175 74%,#171e2a);box-shadow:0 32px 80px rgba(0,10,35,.5),inset 0 0 0 1px #7c8190;transform:rotateY(-19deg) rotateZ(9deg);transition:transform .8s var(--ease);position:relative}.phone:before{content:"";height:60px;width:3px;background:#727887;position:absolute;left:-2px;top:130px;border-radius:4px}.phone-screen{height:100%;background:#121024;border-radius:41px;position:relative;overflow:hidden;border:1px solid #16151f}.phone-island{position:absolute;top:12px;width:79px;height:23px;background:#05070d;left:50%;transform:translateX(-50%);border-radius:30px;z-index:1}.phone-concept{display:block;font-size:10px;letter-spacing:.15em;color:#cfbee6;text-align:center;padding-top:57px}.phone-art{height:270px;position:relative;display:grid;place-items:center;isolation:isolate;overflow:hidden}.phone-art b{font-size:176px;font-weight:500;line-height:1;letter-spacing:-.12em;position:relative;left:-8px;color:var(--ivory);z-index:1}.phone-orbit{position:absolute;width:410px;height:140px;background:var(--purple);border-radius:100%;transform:rotate(-43deg)}.phone-title{padding:18px 24px}.phone-title strong{display:block;font-size:30px;letter-spacing:-.055em;font-weight:500}.phone-title>span{font-size:13px;color:#bcaacf;display:block;margin-top:10px}.phone-home{position:absolute;bottom:9px;left:50%;width:84px;height:4px;background:#bfc1ca;border-radius:8px;transform:translateX(-50%)}.device-stage.front .phone{transform:rotateY(0) rotateZ(0)}.device-controls{display:flex;gap:5px;background:#162035;border:1px solid #30384a;border-radius:50px;padding:5px;margin-top:42px;position:relative}.angle-control{padding:9px 17px;border-radius:50px;background:transparent;color:#b9c2d2;font-size:13px}.angle-control.active{background:var(--ivory);color:var(--navy)}.mockup-caption{margin-top:16px;font-size:13px;color:#aeb8ca;text-align:center;line-height:1.5}.studio-bottom{padding-block:28px 35px;display:flex;justify-content:space-between;gap:20px;font-size:14px;color:#aeb8ca;border-top:1px solid #273045}.studio-bottom a{display:flex;gap:28px}.studio-bottom a:hover{color:var(--ivory)}
/* Studio's upcoming apps use abstract type compositions, clearly separate from app screens. */
.studio-portfolio{--portfolio-gap:28px;padding-block:30px 70px}.portfolio-header{display:grid;grid-template-columns:1.35fr 1fr;align-items:end;gap:48px;margin-bottom:44px}.portfolio-header .product-status{margin-bottom:18px}.portfolio-header h3{font-size:clamp(30px,3.1vw,45px);font-weight:500;line-height:1.15;letter-spacing:-.045em}.portfolio-intro{max-width:410px;font-size:15px;line-height:1.8;color:#c6ccd8}.portfolio-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--portfolio-gap)}.portfolio-project{min-width:0;display:flex;flex-direction:column;}.project-art{aspect-ratio:1.08;position:relative;isolation:isolate;overflow:hidden;border-radius:18px}.project-art-meta{position:absolute;z-index:2;top:18px;left:20px;right:20px;display:flex;justify-content:space-between;gap:12px;font-size:12px;line-height:1.4;letter-spacing:.08em;color:var(--ivory)}.project-art-backten{background:radial-gradient(ellipse at 18% 16%,rgba(120,81,169,.38),transparent 60%),#001639}.concept-ten{position:absolute;inset:13% 5% 4%;display:grid;place-items:center}.concept-ten b{font-size:clamp(110px,13vw,200px);line-height:1;font-weight:500;letter-spacing:-.11em;color:var(--ivory);position:relative;z-index:1;transform:translateX(-.04em)}.concept-ten i{position:absolute;width:116%;height:37%;border:clamp(10px,1.6vw,24px) solid var(--purple);border-radius:50%;transform:rotate(-35deg);z-index:0}.project-art-naran{background:var(--ivory)}.project-art-naran .project-art-meta{color:var(--navy)}.concept-compare{position:absolute;inset:19% 7% 8%}.concept-sheet{position:absolute;top:11%;width:55%;height:77%;display:grid;place-items:center;border-radius:2px}.concept-sheet-a{left:1%;background:var(--ivory);border:1px solid rgba(0,22,57,.28);color:var(--navy);transform:rotate(-10deg)}.concept-sheet-b{right:1%;background:var(--purple);color:var(--ivory);transform:rotate(8deg)}.concept-sheet b{font-family:Georgia,"Times New Roman",serif;font-size:clamp(54px,5.2vw,86px);font-weight:400;line-height:1;letter-spacing:-.08em;transform:translate(-.03em,-8%)}.concept-sheet i{position:absolute;bottom:17%;height:1px;width:38%;background:currentColor;opacity:.65}.project-art-moments{background:radial-gradient(ellipse at 80% 85%,rgba(120,81,169,.32),transparent 68%),#001639}.concept-letters{position:absolute;inset:15% 5% 5%;font-family:Georgia,"Times New Roman",serif}.concept-letters b{position:absolute;font-size:clamp(86px,10vw,148px);font-weight:400;line-height:1;color:var(--ivory)}.concept-letters b:nth-child(1){left:8%;top:8%;transform:rotate(-12deg)}.concept-letters b:nth-child(2){right:7%;top:19%;color:#c1a8e0;transform:rotate(10deg)}.concept-letters b:nth-child(3){left:40%;bottom:3%;color:var(--purple);transform:rotate(-7deg)}.project-copy{display:flex;flex-direction:column;flex:1;padding-top:24px}.project-heading{display:flex;align-items:baseline;justify-content:space-between;gap:10px}.project-heading h4{margin:0;min-width:0;font-size:clamp(24px,2.35vw,34px);font-weight:500;line-height:1.2;letter-spacing:-.045em}.project-platform{flex-shrink:0;font-size:12px;line-height:1.4;color:#aeb8ca}.project-description{margin:18px 0 24px;min-height:5.4em;font-size:15px;line-height:1.8;color:#c6ccd8;letter-spacing:-.015em}.project-bottom{margin-top:auto;min-height:98px;display:flex;flex-direction:column;align-items:flex-start;gap:14px}.project-bottom .button{max-width:100%;gap:16px;padding-inline:20px}.project-status{font-size:13px;line-height:1.6;color:#c1a8e0}.project-pending{font-size:12px;line-height:1.7;color:#aeb8ca}.portfolio-note{margin-top:45px;padding-top:24px;border-top:1px solid #273045;font-size:13px;line-height:1.7;color:#aeb8ca}
@media(min-width:768px) and (max-width:1023px){.portfolio-header{gap:28px}.portfolio-header h3{font-size:32px}.portfolio-intro{font-size:14px}.studio-portfolio{--portfolio-gap:24px}.project-art-meta{left:14px;right:14px;top:14px;font-size:11px;letter-spacing:.04em}.project-heading h4{font-size:24px}.project-description{font-size:14px;min-height:7.2em}.project-bottom .button{font-size:12px;gap:10px;padding-inline:15px}}
@media(max-width:767px){.studio-portfolio{padding-block:30px 60px}.portfolio-header{grid-template-columns:1fr;gap:22px;margin-bottom:32px}.portfolio-header h3{font-size:32px}.portfolio-intro{font-size:14px;max-width:420px}.portfolio-grid{grid-template-columns:1fr;gap:48px}.project-art{aspect-ratio:1.4;border-radius:16px}.project-art-meta{top:16px;left:18px;right:18px;font-size:12px;letter-spacing:.05em}.concept-ten{inset:15% 12% 4%}.concept-ten b{font-size:clamp(110px,30vw,178px)}.concept-ten i{width:108%;height:43%;border-width:15px}.concept-compare{inset:15% 17% 7%}.concept-sheet b{font-size:clamp(55px,14vw,80px)}.concept-letters{inset:16% 19% 7%}.concept-letters b{font-size:clamp(86px,22vw,125px)}.concept-letters b:nth-child(1){top:3%}.concept-letters b:nth-child(2){top:11%}.concept-letters b:nth-child(3){bottom:-2%}.project-copy{padding-top:22px}.project-heading h4{font-size:30px}.project-description{min-height:0;margin:16px 0 23px;font-size:15px;line-height:1.75}.project-bottom{min-height:0;gap:12px}.portfolio-note{margin-top:38px;padding-top:22px;font-size:12px}}
/* GRAE uses its own warm brand palette; the rounded scene overlaps only Studio's added empty padding. */
.grae-section{background:var(--grae-ivory);color:var(--grae-forest);position:relative;z-index:1;overflow:hidden;border-radius:24px 24px 0 0;margin-top:-24px}.grae-body{padding-block:58px 72px}.grae-top>p{font-size:13px;letter-spacing:.15em;text-transform:uppercase;color:var(--grae-gray)}.grae-layout{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:center;gap:clamp(48px,7vw,100px);margin-top:44px}.grae-wordmark{margin:0}.grae-wordmark .logo{width:min(100%,480px)}.grae-lead{margin-top:32px;font-size:40px;line-height:1.3;letter-spacing:-.045em}.grae-signature{display:flex;align-items:center;gap:12px;width:135px;margin-top:28px}.grae-signature>span{height:1px;background:var(--grae-orange);flex:1}.grae-signature>i{width:8px;height:8px;border-radius:50%;background:var(--grae-orange)}.grae-promise{font-size:clamp(24px,2.4vw,32px);line-height:1.5;letter-spacing:-.035em}.grae-summary{margin-top:22px;font-size:14px;line-height:1.8;max-width:420px}.grae-details{margin-top:28px;padding-left:14px;border-left:2px solid var(--grae-orange)}.grae-status{font-size:14px;line-height:1.6}.grae-details .grae-filing{margin-top:7px;font-size:13px;line-height:1.7;color:var(--grae-gray)}.grae-copy .text-link{margin-top:30px}.grae-copy .arrow{color:var(--grae-orange)}.grae-section a:focus-visible{outline-color:var(--grae-orange)}

.contact-section{background:var(--navy);color:var(--ivory)}.contact-body{padding-block:88px 65px}.contact-body .eyebrow{color:#b0bacc;margin-bottom:24px}.contact-description{font-size:16px;line-height:1.75;max-width:650px;margin-top:28px;color:#d3d7df}.contact-email{display:inline-flex;align-items:center;gap:34px;max-width:100%;font-size:clamp(25px,4.8vw,68px);font-weight:500;letter-spacing:-.045em;line-height:1.25;margin-top:50px;padding-bottom:14px;border-bottom:1px solid #65718a}.contact-email>.arrow{font-size:clamp(25px,3vw,42px);transition:transform .3s var(--ease);color:#bc9cdd}.contact-email:hover{color:#d5c1ed}.contact-email:hover>.arrow{transform:translate(5px,-5px)}.contact-actions{display:flex;align-items:center;gap:26px;flex-wrap:wrap;margin-top:20px;font-size:13px;color:#b0bacc}.contact-actions button{display:inline-flex;align-items:center;gap:14px;padding:8px 0;background:transparent;color:var(--ivory);border-bottom:1px solid #65718a;font-size:14px}.contact-actions button:hover{color:#d5c1ed}.contact-actions button:disabled{opacity:.6;cursor:wait}.contact-actions button>span{font-size:17px}.copy-status{min-height:20px;margin-top:15px;font-size:14px;line-height:1.6;color:#d5c1ed}.contact-section a:focus-visible,.contact-section button:focus-visible{outline-color:#bc9cdd}
.site-footer{background:var(--navy);color:var(--ivory);border-top:1px solid rgba(255,254,240,.15)}.footer-top{padding-block:60px;display:flex;justify-content:space-between;align-items:start;gap:40px}.footer-top .logo{width:260px}.footer-top p{font-size:25px;letter-spacing:-.035em;line-height:1.2}.footer-bottom{padding-block:24px 28px;border-top:1px solid rgba(255,254,240,.15);display:flex;justify-content:space-between;gap:30px;font-size:12px;color:#b0bacc}.footer-bottom>div{display:flex;gap:26px;align-items:center}.footer-bottom a:hover,.footer-bottom button:hover{color:var(--ivory)}.footer-bottom button{padding:0;background:transparent;color:inherit;font-size:inherit}
dialog{border:0;border-radius:20px;padding:35px;max-width:510px;width:calc(100% - 40px);background:var(--ivory);color:var(--navy);box-shadow:0 30px 120px rgba(0,22,57,.3)}dialog::backdrop{background:rgba(0,14,36,.75);backdrop-filter:blur(6px)}.dialog-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:35px}.dialog-head .logo{width:100px}.dialog-head button{background:transparent;font-size:30px;padding:0 5px}dialog h2{font-size:27px;letter-spacing:-.03em;margin-bottom:20px}dialog p,dialog li{font-size:15px;line-height:1.8}dialog ul{padding-left:18px;margin:20px 0}.dialog-note{color:var(--ink-soft);margin-bottom:25px}
.route-shell{min-height:calc(100svh - 76px);padding-block:80px 100px}.route-shell>a:first-child{font-size:15px;display:inline-flex;gap:15px;align-items:center;margin-bottom:60px}.route-shell .route-logo{width:280px;margin-bottom:60px}.route-shell h1{font-size:clamp(56px,7vw,100px);line-height:1.05;letter-spacing:-.055em;max-width:950px;font-weight:500}.route-shell .route-description{font-size:18px;line-height:1.8;max-width:610px;margin:30px 0}.route-status{display:inline-block;margin-bottom:25px;color:var(--purple);font-size:15px}.route-links{display:flex;gap:16px;flex-wrap:wrap;margin-top:35px}.route-notice{max-width:650px;border-top:1px solid rgba(0,22,57,.2);margin-top:55px;padding-top:24px;font-size:15px;line-height:1.9;color:var(--ink-soft)}.route-dark{background:#040e1e;color:var(--ivory)}.route-dark .route-notice{color:#bbc4d4;border-color:#344056}.route-dark .route-status{color:#c6ace7}.route-grae{background:var(--grae-ivory);color:var(--grae-forest)}.route-grae h1 .logo{width:min(100%,480px)}.route-grae .route-status{color:var(--grae-gray);display:block}.grae-route-tagline{font-size:13px;text-transform:uppercase;letter-spacing:.15em;margin-top:25px}.route-grae .button-dark{background:var(--grae-forest);color:var(--grae-ivory)}.route-grae .button-dark:hover{background:#34463a}.route-grae .route-notice{color:var(--grae-gray);border-color:#c6c7bc}.route-grae a:focus-visible{outline-color:var(--grae-orange)}
.js-motion .reveal{opacity:0;transform:translateY(30px);transition:opacity .85s var(--ease),transform 1s var(--ease)}.js-motion .reveal.is-visible{opacity:1;transform:translateY(0)}
@media(prefers-reduced-motion:no-preference){.js-motion .hero-enter{animation:hero-in 1s var(--ease) both}.js-motion .hero-enter:nth-child(2){animation-delay:.12s}.js-motion .hero-enter:nth-child(3){animation-delay:.22s}.js-motion .hero-enter:nth-child(4){animation-delay:.32s}.js-motion .hero-art{animation-delay:.15s;animation-name:art-in}.js-motion .art-disc{animation:disc-drift 10s ease-in-out infinite alternate}.js-motion .studio-sculpture.is-visible img{animation:sculpture-drift 12s ease-in-out infinite alternate}.js-motion .phone-orbit{animation:orbit-drift 7s ease-in-out infinite alternate}}
@keyframes hero-in{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@keyframes art-in{from{opacity:0;transform:translateY(35px) rotate(0)}to{opacity:1;transform:translateY(0) rotate(-3deg)}}@keyframes disc-drift{to{transform:translate(-18px,22px)}}@keyframes sculpture-drift{to{transform:scale(1.04) translateX(-15px)}}@keyframes orbit-drift{to{transform:rotate(-30deg) translateY(8px)}}
.motion-off *,.motion-off *:before,.motion-off *:after{animation:none!important;transition:none!important}.motion-off .reveal{opacity:1;transform:none}.motion-off{scroll-behavior:auto}
@media(min-width:1600px){.hero{min-height:770px}.hero h1{font-size:108px}}
@media(max-width:1023px){.site-header{gap:20px}.desktop-nav{gap:24px}.hero{gap:26px;min-height:620px;padding-block:65px}.hero h1{font-size:6.55vw}.hero-art{min-height:320px}.brand-intro{gap:45px;padding-block:60px 75px}.studio-intro{min-height:650px}.studio-headline{margin-top:100px}.studio-sculpture{inset:0 -40% 0 4%}.backten-showcase{min-height:740px;gap:25px}.phone{width:250px;height:510px}.phone-art{height:245px}.grae-layout{gap:45px}.grae-body{padding-bottom:65px}.grae-lead{font-size:34px}}
@media(max-width:767px){:root{--gutter:24px}html{scroll-padding-top:78px}.site-header{height:68px;gap:10px}.brand .logo{width:clamp(118px,calc(100vw - 215px),155px)}.desktop-nav{display:none}.header-actions{gap:8px}.header-actions>.motion-toggle{display:none}.menu-toggle{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:44px;height:44px;flex-shrink:0;background:none;padding:0}.menu-toggle span{height:1.5px;width:24px;background:var(--navy);transition:transform .3s var(--ease)}.menu-open .menu-toggle span:first-child{transform:translateY(3.25px) rotate(45deg)}.menu-open .menu-toggle span:last-child{transform:translateY(-3.25px) rotate(-45deg)}.mobile-nav{display:flex;position:absolute;top:68px;left:0;right:0;background:var(--ivory);padding:35px 24px 40px;flex-direction:column;gap:0;visibility:hidden;opacity:0;transform:translateY(-8px);transition:opacity .3s var(--ease),transform .3s var(--ease),visibility .3s;z-index:11;box-shadow:0 25px 30px rgba(0,22,57,.1)}.mobile-nav a{font-size:24px;padding:18px 0;display:flex;justify-content:space-between;border-bottom:1px solid rgba(0,22,57,.15);font-weight:700}.mobile-nav p{font-size:14px;color:var(--ink-soft);margin-top:30px}.mobile-preferences{display:flex;align-items:center;padding-top:20px}.motion-toggle-mobile{display:inline-flex;align-items:center;justify-content:flex-start;gap:12px;width:auto;min-width:120px;min-height:44px;height:auto;border:0;border-radius:0;background:transparent;padding:8px 0;font-size:14px;color:var(--navy)}.motion-toggle-mobile .motion-bars i{background:currentColor}.motion-toggle-mobile:hover{color:var(--purple)}.menu-open .mobile-nav{visibility:visible;opacity:1;transform:translateY(0)}
 .hero{min-height:0;grid-template-columns:1fr;gap:48px;padding-block:45px 52px}.eyebrow{font-size:11px;margin-bottom:24px}.hero h1{font-size:clamp(38px,10.65vw,76px);letter-spacing:-.066em;line-height:1.04}.hero-description{font-size:15px;margin-top:24px;line-height:1.7}.hero .text-link{margin-top:25px}.hero-art{width:100%;aspect-ratio:1.22;min-height:0;max-height:430px;transform:rotate(-2deg);border-radius:16px}.hero-symbol{width:65%;left:9%;bottom:12%}.art-disc{width:66%;left:47%;top:-18%}.art-line{top:53%}.brand-intro{grid-template-columns:1fr;gap:40px;padding-block:45px 56px}.company-statement{font-size:29px}.directory-item .logo{width:208px}.directory-item p{font-size:13px}.directory-item .grae-mini{width:126px}.directory-arrow{font-size:27px}
 .studio-section{border-radius:18px 18px 0 0;padding-bottom:18px}.studio-intro{padding-top:45px;min-height:580px}.studio-brand .logo{width:203px}.studio-headline{margin-top:73px}.studio-headline h2{font-size:clamp(39px,10.2vw,75px);line-height:1.04}.studio-headline p{font-size:13px;margin-top:22px}.studio-sculpture{inset:180px -48% -40px -26%}.studio-sculpture img{opacity:.62}.studio-sculpture:after{background:linear-gradient(180deg,#040e1e 0%,transparent 35%),linear-gradient(0deg,#040e1e,transparent 30%)}.backten-showcase{grid-template-columns:1fr;gap:12px;min-height:0;padding-bottom:55px}.backten-copy{padding-block:28px}.product-status{margin-bottom:13px;font-size:13px}.backten-copy h3{font-size:68px}.product-description{font-size:15px;margin-block:20px 27px}.button{font-size:12px;padding:15px 23px}.release-note{font-size:12px}.device-stage{padding-top:28px}.device-light{width:300px}.phone{width:248px;height:510px}.phone-art{height:245px}.device-controls{margin-top:40px}.mockup-caption{font-size:12px}.studio-bottom{font-size:12px;padding-block:24px 28px}
 .grae-section{border-radius:18px 18px 0 0;margin-top:-18px}.grae-body{padding-block:42px 52px}.grae-top>p{font-size:11px;letter-spacing:.12em}.grae-layout{grid-template-columns:1fr;gap:36px;margin-top:32px}.grae-wordmark .logo{width:min(88%,300px)}.grae-lead{font-size:32px;line-height:1.3;margin-top:26px}.grae-signature{width:105px;gap:10px;margin-top:24px}.grae-signature>i{width:6px;height:6px}.grae-promise{font-size:24px;line-height:1.5}.grae-summary{font-size:13px;margin-top:18px}.grae-details{margin-top:24px}.grae-copy .text-link{font-size:12px;margin-top:26px}.grae-route-tagline{font-size:11px;letter-spacing:.12em;margin-top:22px}

 .footer-top{padding-block:45px;flex-direction:column;gap:30px}.footer-top .logo{width:215px}.footer-top p{font-size:23px}.footer-bottom{padding-block:23px 28px;display:grid;grid-template-columns:1fr auto;font-size:12px;gap:24px}.footer-bottom>div{grid-column:1/-1;gap:28px;font-size:inherit}.route-shell{padding-block:45px 70px}.route-shell>a:first-child{margin-bottom:45px}.route-shell .route-logo{width:230px;margin-bottom:45px}.route-shell h1{font-size:50px}.route-shell .route-description{font-size:15px;margin-top:24px}.route-notice{margin-top:40px}.route-grae h1 .logo{width:min(88%,300px)}dialog{padding:25px}dialog h2{font-size:24px}
}
@media(max-width:359px){:root{--gutter:20px}.brand .logo{width:140px}.header-actions{gap:12px}.hero h1{font-size:10.6vw}.phone{width:230px;height:475px}.phone-art{height:215px}.phone-art b{font-size:165px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.js-motion .reveal{opacity:1;transform:none}}
@media(max-width:767px){.header-actions{gap:8px}.language-switch a{min-width:44px;min-height:44px;font-size:12px}.language-switch{gap:0}html[lang="en"] .mockup-caption{max-width:300px}html[lang="en"] .company-statement{font-size:27px}}
@media(max-width:359px){.brand .logo{width:118px}.site-header{gap:8px}.header-actions{gap:6px}.language-switch{gap:0}.language-switch a{min-width:44px;min-height:44px}.menu-toggle{width:44px;height:44px}html[lang="en"] .company-statement{font-size:24px}}
.company-section{overflow:clip}.about-lead,.contact-description{word-break:keep-all}
@media(min-width:768px) and (max-width:1023px){.site-header{gap:18px}.brand .logo{width:155px}.desktop-nav{gap:17px}.desktop-nav a{font-size:12px;font-weight:700}.header-actions{gap:10px}.about-intro{padding-block:65px 45px}.brand-intro{padding-block:0 75px}.contact-body{padding-block:70px 55px}}
@media(max-width:767px){.about-intro{padding-block:48px 35px}.about-intro .eyebrow{margin-bottom:20px}.about-intro h2,.contact-body h2{font-size:45px}.about-lead{font-size:17px;line-height:1.8;margin-top:24px}.brand-intro{padding-block:0 55px;gap:35px}.company-parent{padding-top:25px}.company-parent .logo{width:225px}.company-role{font-size:13px}.company-statement{margin-top:25px;font-size:28px}.brand-directory{position:relative;border-top:0;border-left:0;margin-left:12px;padding:0 0 0 22px}.brand-connector{display:block;position:absolute;left:0;top:-20px;width:22px;overflow:visible;pointer-events:none;opacity:.55;color:var(--purple)}.brand-directory .directory-item{position:relative;gap:20px}.brand-directory .directory-item>div{min-width:0;flex:1}.brand-directory .directory-item+.directory-item{border-top:1px solid rgba(0,22,57,.09);padding-top:24px}.brand-directory .directory-item .logo{width:190px}.brand-directory .directory-item .grae-mini{width:126px}.brand-directory .directory-arrow{flex-shrink:0}.directory-item .directory-description{font-size:13px;margin-top:15px}.contact-body{padding-block:50px 30px}.contact-body .eyebrow{font-size:11px;margin-bottom:20px}.contact-description{font-size:14px;margin-top:22px}.contact-email{font-size:clamp(23px,6.5vw,44px);gap:16px;margin-top:35px;padding-bottom:12px}.contact-email>.arrow{font-size:25px}.contact-actions{gap:20px;margin-top:13px;font-size:12px}.copy-status{font-size:13px}.footer-bottom>div{gap:23px;flex-wrap:wrap}}

/* Brand navigation uses original marks, with compact context beside each mobile logo. */
.nav-brand-content{min-width:0}.nav-brand-description{font-size:12px;line-height:1.4;letter-spacing:0;font-weight:400;color:var(--ink-soft)}
.desktop-nav .brand-menu-link{padding:0}.desktop-nav .nav-brand-content{display:flex;align-items:center}.desktop-nav .logo-studio{width:116px;transform:translateY(-2px)}.desktop-nav .logo-grae{width:56px;transform:translateY(1.5px)}
@media(min-width:768px) and (max-width:1023px){.desktop-nav .logo-studio{width:108px}.desktop-nav .logo-grae{width:52px}}
@media(max-width:767px){.mobile-nav{max-height:calc(100dvh - 68px);overflow-y:auto;overscroll-behavior:contain}.mobile-nav .brand-menu-link{align-items:center;gap:16px;min-height:74px}.mobile-nav .nav-brand-content{display:grid;grid-template-columns:208px minmax(0,1fr);align-items:center;column-gap:20px;flex:1}.mobile-nav .logo-studio{width:208px}.mobile-nav .logo-grae{width:100px}.mobile-nav .nav-brand-description{font-size:14px;line-height:1.5;word-break:keep-all}.nav-brand-arrow{flex-shrink:0}}
@media(max-width:420px){.mobile-nav .nav-brand-content{grid-template-columns:minmax(0,1fr);row-gap:9px}.mobile-nav .logo-studio{width:198px;max-width:100%}.mobile-nav .logo-grae{width:96px;max-width:100%}}

/* The portfolio introduction starts on the same column as card 03. */
@media(min-width:1024px){.portfolio-header{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--portfolio-gap)}.portfolio-header>div{grid-column:1/span 2}.portfolio-intro{grid-column:3;min-width:0;width:auto;max-width:none;justify-self:stretch}.grae-copy{width:100%;max-width:360px;justify-self:end}}