@font-face{font-family:Manrope;src:url('/fonts/manrope-regular.ttf') format('truetype');font-weight:400;font-display:swap}
:root{color-scheme:dark;--navy:#020d20;--navy-2:#071b38;--ink:#eef4ff;--white:#eef4ff;--muted:#b3c3d7;--muted-dark:#b3c3d7;--line:#263b57;--blue:#a9c9ff;--blue-strong:#a9c9ff;--pale:#071b38;--max:1440px;--gutter:48px;--sans:Manrope,'Helvetica Neue',sans-serif}
body{background:#020d20;color:var(--ink);font-family:var(--sans)}::selection{background:#a9c9ff;color:#fff}h1,h2,h3,p{margin-top:0}a,button{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid #a9c9ff;outline-offset:5px}.site-header{min-height:92px;background:rgba(2,13,32,.92);border:0;backdrop-filter:blur(16px)}.site-header__inner{min-height:92px;grid-template-columns:1fr auto 1fr}.brand{font-family:var(--sans);font-size:40px;letter-spacing:-.095em;font-weight:600}.site-nav{gap:40px;font-size:12px;color:var(--ink)}.site-nav a{position:relative}.site-nav a:after{content:'';position:absolute;left:0;bottom:-5px;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .25s}.site-nav a:hover:after{transform:scaleX(1)}.site-nav a:hover{color:#a9c9ff}.button{background:var(--ink);color:#fff;border-color:var(--ink);font-weight:400;min-height:50px;border-radius:99px;padding:0 24px}.button:hover{background:#a9c9ff;border-color:#a9c9ff;color:#fff;box-shadow:none}.header-actions .button{min-height:43px;font-size:12px}.header-actions .button:after{content:'↗';font-size:17px}.text-link{color:inherit;font-size:13px;font-weight:400;display:inline-flex;gap:20px;align-items:center}.text-link:hover{color:#a9c9ff}.mobile-menu summary{border-color:#526681;border-radius:50%}.mobile-menu summary i{background:var(--ink)}.mobile-menu nav{background:#0a1c35;border:1px solid var(--line);color:var(--ink);box-shadow:0 16px 30px #152a3f20}.site-footer{background:#020d20;border-color:var(--line);padding:34px 0}.site-footer__inner{gap:30px}.site-footer p,.site-footer small,.site-footer nav{color:var(--muted)}.site-footer a:hover{color:#a9c9ff}.section-index,.section-top>span,.hero-eyebrow,.scroll-note,.image-caption,.plan-number{font-size:10px;letter-spacing:.09em;line-height:1.5;font-weight:400}.section-index{margin:0}.p-hero{padding-top:32px;padding-bottom:38px;min-height:calc(100svh - 92px);display:flex;flex-direction:column}.hero-eyebrow{display:flex;justify-content:space-between;align-items:center}.hero-eyebrow>span:first-child{display:flex;align-items:center;gap:9px}.status-dot{width:6px;height:6px;background:#a9c9ff;border-radius:100%;display:inline-block}.hero-composition{position:relative;flex:1;min-height:480px;display:flex;align-items:center;padding:36px 0}.hero-composition h1{font-size:clamp(76px,9.7vw,148px);font-weight:400;letter-spacing:-.075em;line-height:.98;position:relative;z-index:2;margin:0;pointer-events:none}.hero-composition h1>span{display:block}.hero-composition h1 .hero-big{padding-left:20%;color:#a9c9ff}.hero-art{position:absolute;width:51%;height:112%;right:-4%;top:-4%;isolation:isolate;pointer-events:none}.hero-art canvas{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .7s}.hero-art.is-ready canvas{opacity:1}.art-halo{position:absolute;inset:12% 0;border-radius:50%;background:radial-gradient(ellipse,#edf3fa 5%,#bdd0e560 35%,transparent 68%);filter:blur(25px)}.art-fallback{position:absolute;inset:0;display:grid;place-items:center;font-size:clamp(200px,38vw,600px);color:#6887b0;line-height:1;transform:rotate(-20deg);text-shadow:3px 6px 1px #f3f8ff,-6px -2px 0 #334f73;transition:opacity .5s}.hero-art.is-ready .art-fallback{opacity:0}.motion-toggle{position:absolute;right:0;bottom:16px;z-index:3;background:transparent;border:0;border-bottom:1px solid #536883;font-size:10px;letter-spacing:.03em;padding:12px 0;cursor:pointer;display:flex;gap:16px;align-items:center}.hero-bottom{display:grid;grid-template-columns:1fr 1fr auto;gap:32px;align-items:end;padding-top:24px;border-top:1px solid var(--line)}.hero-bottom p{font-size:13px;line-height:1.65;margin:0}.pill-link{display:inline-flex;width:max-content;align-items:center;gap:28px;border:1px solid #536883;border-radius:100px;padding:8px 8px 8px 24px;font-size:12px;transition:background .2s,color .2s,border .2s}.pill-link>span{display:grid;place-items:center;border-radius:50%;width:39px;height:39px;background:var(--ink);color:white;font-size:20px;transition:transform .25s}.pill-link:hover{background:var(--ink);color:white;border-color:var(--ink)}.pill-link:hover>span{transform:rotate(45deg);background:#a9c9ff}.scroll-note{display:flex;gap:30px;align-items:center;font-size:9px;padding-bottom:12px}.scroll-note span{font-size:22px}.studio-intro{padding-top:130px;padding-bottom:130px;display:grid;grid-template-columns:1fr 2fr;gap:30px;scroll-margin-top:110px}.studio-intro>.section-index{padding-top:14px}.studio-intro h2,.work-heading h2,.approach-grid h2,.extras-section h2{font-size:clamp(36px,4.5vw,65px);line-height:1.12;font-weight:400;letter-spacing:-.055em;margin-bottom:0}.studio-intro h2 span,.work-heading h2 span,.approach-grid h2 span{color:#879dbb}.intro-detail{display:grid;grid-template-columns:1fr 1.6fr;gap:50px;margin-top:48px;align-items:center}.studio-symbol{font-size:96px;line-height:1;color:#a9c9ff}.intro-detail p{margin:0;max-width:390px;font-size:14px;line-height:1.8;color:var(--muted)}.work-section{padding:64px 0 60px;background:#06162b;color:#eef2f3;scroll-margin-top:90px}.section-top{display:flex;align-items:center;justify-content:space-between;gap:24px}.work-section .section-top{color:#c0cbd1}.work-heading{display:flex;justify-content:space-between;align-items:end;gap:32px;margin:58px 0 48px}.work-heading h2 span{color:#879dbb}.work-heading>.text-link{padding-bottom:8px}.work-feature{display:block;min-width:0}.work-image{position:relative;aspect-ratio:1.96;overflow:hidden;border-radius:4px;background:#345143;isolation:isolate}.work-image>img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .9s cubic-bezier(.2,.8,.2,1);position:absolute;inset:0}.work-image:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#0921175c,transparent 35%,#071a177a);z-index:0}.work-feature:hover .work-image>img{transform:scale(1.045)}.concept-top{position:absolute;top:32px;left:36px;right:36px;display:flex;justify-content:space-between;z-index:1;align-items:center;color:#fff}.concept-top>span:first-child{font-family:Georgia,serif;font-size:24px;letter-spacing:.06em;line-height:1}.concept-top small{font:8px var(--sans);letter-spacing:.16em;display:block;margin-top:9px}.concept-top>span+span{font-size:9px;letter-spacing:.1em}.concept-title{position:absolute;z-index:1;left:36px;bottom:65px;font:clamp(34px,5vw,74px)/1.05 Georgia,serif;letter-spacing:-.04em;color:#fff;text-shadow:0 2px 30px #10291f40}.round-arrow{position:absolute;right:32px;bottom:30px;z-index:1;border:1px solid #ffffff85;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;color:white;font-size:29px;background:#ffffff12;backdrop-filter:blur(10px);transition:background .3s,transform .3s}.work-feature:hover .round-arrow{background:#fff;color:#15262e;transform:rotate(45deg)}.image-caption{position:absolute;left:36px;bottom:29px;z-index:1;font-size:8px;color:#fff}.work-meta{display:flex;gap:22px;align-items:center;padding:20px 0 0}.work-meta h3{font-size:16px;font-weight:400;letter-spacing:-.02em;margin:0;flex:1}.work-meta>span{font-size:10px;color:#c0cbd1}.work-pair{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:56px}.work-pair .work-image{aspect-ratio:1.04}.work-pair .concept-title{font-size:clamp(30px,4vw,56px)}.farm-image img{object-position:60%}.candle-image .concept-top>span:first-child{font-size:40px;letter-spacing:-.04em}.work-disclaimer{font-size:11px;color:#b5c2c9;margin:50px 0 0}.plans-section{padding-top:100px;padding-bottom:90px;scroll-margin-top:92px}.plans-section .work-heading{margin:52px 0}.plans-section .work-heading h2 span{color:#879dbb}.work-heading>p{font-size:14px;line-height:1.8;margin:0;color:var(--muted)}.plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.plan{padding:34px 28px;display:flex;flex-direction:column}.plan+.plan{border-left:1px solid var(--line)}.plan-featured{background:#0c2344}.plan-number{color:var(--muted)}.plan h3{font-size:28px;line-height:1.2;font-weight:400;letter-spacing:-.04em;margin:32px 0 20px;min-height:68px}.plan .plan-amount{font-size:54px;letter-spacing:-.055em;color:var(--ink);margin:0 0 18px;line-height:1.2}.plan>p:not(.plan-amount){font-size:12px;line-height:1.8;max-width:300px;color:var(--muted);min-height:66px}.plan ul{list-style:none;padding:20px 0;margin:0 0 20px;font-size:11px;line-height:2.3;flex:1}.plan li:before{content:'↗';margin-right:10px;color:#a9c9ff}.plan-link{border-top:1px solid #354e70;padding:20px 0 0;font-size:12px;display:flex;justify-content:space-between;gap:15px}.plan-link span{font-size:20px}.plan-link:hover{color:#a9c9ff}.plan-demo{font-size:10px;text-decoration:underline;text-underline-offset:4px;margin-top:16px;color:var(--muted);width:max-content}.plan-note{display:flex;gap:30px;justify-content:space-between;margin-top:22px}.plan-note p{font-size:10px;color:var(--muted);margin:0;line-height:1.8}.approach-section{padding:95px 0;background:#071b38;scroll-margin-top:90px}.approach-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px}.approach-grid h2{font-size:clamp(36px,4vw,58px);margin:54px 0 0}.approach-steps article{display:flex;gap:34px;padding:28px 0;border-bottom:1px solid var(--line)}.approach-steps article:first-child{padding-top:0}.approach-steps article>span{font-size:10px;color:#879dbb;padding-top:8px}.approach-steps h3{font-size:22px;letter-spacing:-.04em;font-weight:400;margin-bottom:14px}.approach-steps p{font-size:13px;line-height:1.8;max-width:390px;color:var(--muted);margin:0}.extras-section{padding-top:100px;padding-bottom:100px;display:grid;grid-template-columns:1fr 2fr;gap:32px}.extras-section>.section-index{padding-top:12px}.service-links{margin-top:48px}.service-links>a{display:flex;align-items:center;gap:20px;padding:24px 0;border-top:1px solid var(--line)}.service-links>a>span:first-child{font-size:24px;letter-spacing:-.035em;flex:1}.service-links small{font-size:11px;color:var(--muted)}.service-links>a>span:last-child{font-size:22px;margin-left:24px}.service-links>a:hover{color:#a9c9ff}.built-apps{border-top:1px solid var(--line);color:var(--ink);margin-top:10px}.built-apps summary{font-size:12px;padding:20px 0;cursor:pointer}.built-apps>div{padding:12px 0;display:flex;gap:18px;flex-wrap:wrap}.built-apps a{font-size:12px;text-decoration:underline;text-underline-offset:4px;color:var(--muted)}.closing-section{background:#a9c9ff;color:#f0f4ff;padding:65px 0 55px}.closing-link{display:block;position:relative;font-size:clamp(55px,9vw,136px);font-weight:400;letter-spacing:-.065em;line-height:1.02;margin:50px 0 55px;width:100%}.closing-link>span{position:absolute;right:0;bottom:0;font-size:1.3em;line-height:1;transition:transform .3s}.closing-link:hover>span{transform:translate(8px,-8px)}.closing-bottom{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #ffffff50;padding-top:28px}.closing-bottom p{font-size:12px;line-height:1.8;margin:0}.closing-bottom .pill-link{border-color:#ffffff70}.closing-bottom .pill-link>span{background:#fff;color:#a9c9ff}.closing-bottom .pill-link:hover{background:#fff;color:#a9c9ff}.section-heading{max-width:900px;padding:80px 0 60px}.section-heading h1{font-size:clamp(56px,7.5vw,110px);line-height:1.04;letter-spacing:-.065em;font-weight:400}.section-heading .eyebrow,.eyebrow{color:#b3c3d7;font-size:10px;letter-spacing:.1em}.section-heading .eyebrow{margin:0 0 25px}.catalog-card{background:transparent;border:0;border-radius:0}.catalog-card__image{border-radius:4px;height:340px}.catalog-card__body{padding:25px 0}.catalog-card__body h2{font-size:29px;letter-spacing:-.04em;line-height:1.2;margin-top:12px}.catalog-card__body small{color:var(--muted);font-size:9px}.catalog-card__body p{font-size:12px}.catalog-card__body .button{font-size:11px;padding:0 20px;min-height:46px}.scope-note{background:#071b38;color:var(--ink);border:1px solid var(--line);padding:40px;margin-bottom:80px}.scope-note p{color:var(--muted);font-size:14px}.contact-main{padding-top:80px;padding-bottom:100px;gap:100px}.contact-intro h1{font-size:clamp(60px,7vw,108px);line-height:1.03;letter-spacing:-.065em;font-weight:400}.contact-form-panel{background:#091b32;border:1px solid #263b57;border-radius:4px;padding:36px}.contact-form-panel h2{font-size:26px;letter-spacing:-.04em}.form-field input,.form-field textarea,.form-field select{background:#041326;color:var(--ink);border:1px solid #425a7a;border-radius:3px;font-family:var(--sans);font-size:14px}.form-field input::placeholder,.form-field textarea::placeholder{color:#93a8c4}.form-field label{font-size:12px}.form-field textarea{min-height:145px}.form-status{color:#b9d8ff}.form-status--error{color:#ffbdbd}.project-form .button{width:100%;justify-content:space-between}.contact-note{font-size:14px!important}.page-hero h1{font-weight:400;letter-spacing:-.06em}.skip-link{background:#a9c9ff;color:white}
@media(min-width:1600px){.hero-composition{min-height:580px}.hero-art{right:0;width:54%}}
@media(max-width:1000px){:root{--gutter:32px}.hero-composition{min-height:400px}.hero-bottom{grid-template-columns:1fr auto}.scroll-note{display:none}.hero-art{right:-5%;width:55%}.studio-intro,.extras-section{grid-template-columns:1fr 2.5fr;gap:35px}.intro-detail{gap:30px}.plan{padding:28px 20px}.plan h3{font-size:23px}.approach-grid{gap:40px}.contact-main{gap:50px}.work-meta>span:nth-child(2):not(:last-child){display:none}.service-links small{max-width:140px}.catalog-card__image{height:260px}.site-footer__inner{flex-wrap:wrap}}
@media(max-width:720px){:root{--gutter:24px}.site-header,.site-header__inner{min-height:78px}.site-header__inner{grid-template-columns:1fr auto;gap:15px}.brand{font-size:34px}.site-nav{display:none}.mobile-menu{display:block}.header-actions .button{min-height:40px;padding:0 15px;font-size:10px}.header-actions{gap:10px}.p-hero{padding-top:22px;min-height:calc(100svh - 78px);padding-bottom:30px}.hero-eyebrow>span:last-child{display:none}.hero-eyebrow{font-size:8px}.hero-composition{min-height:430px;padding:36px 0 95px;align-items:flex-start}.hero-composition h1{font-size:clamp(46px,11.2vw,80px);line-height:1.07;letter-spacing:-.065em;white-space:nowrap}.hero-composition h1 .hero-big{padding-left:13%}.hero-art{width:75%;height:82%;right:-13%;top:24%;z-index:0}.hero-bottom{grid-template-columns:1fr;gap:22px;align-items:start;padding-top:22px}.hero-bottom p{font-size:12px}.hero-bottom .pill-link{font-size:11px;padding-left:19px}.hero-bottom .pill-link>span{width:34px;height:34px}.motion-toggle{bottom:8px;font-size:9px}.studio-intro{padding-top:76px;padding-bottom:76px;grid-template-columns:1fr;gap:32px}.studio-intro h2,.work-heading h2,.extras-section h2{font-size:37px}.intro-detail{grid-template-columns:65px 1fr;gap:25px;margin-top:30px}.studio-symbol{font-size:65px}.intro-detail p{font-size:12px;line-height:1.8}.section-top>span{display:none}.work-section{padding:40px 0}.work-heading{display:block;margin:34px 0 30px}.work-heading>.text-link{margin-top:25px}.work-image{aspect-ratio:1.03}.concept-top{top:25px;left:24px;right:24px}.concept-top>span+span{display:none}.concept-title{font-size:44px;left:24px;bottom:67px}.image-caption{left:24px;font-size:7px;bottom:26px}.round-arrow{width:42px;height:42px;right:20px;bottom:20px;font-size:23px}.work-meta h3{font-size:13px}.work-meta{gap:12px;padding-top:16px}.work-meta>span{font-size:9px}.work-pair{grid-template-columns:1fr;gap:32px;margin-top:32px}.work-pair .concept-title{font-size:44px}.work-disclaimer{font-size:10px;margin-top:35px;max-width:290px}.plans-section{padding-top:64px;padding-bottom:64px}.plans-section .work-heading{margin:35px 0}.work-heading>p{margin-top:24px;font-size:12px}.plan-grid{grid-template-columns:1fr}.plan{padding:30px 22px}.plan+.plan{border-left:0;border-top:1px solid var(--line)}.plan h3{font-size:30px;min-height:0;margin:25px 0 20px}.plan>p:not(.plan-amount){min-height:0;max-width:100%}.plan ul{padding-top:6px;padding-bottom:6px;margin-bottom:16px}.plan-note{display:block}.plan-note p+p{margin-top:8px}.approach-section{padding:65px 0}.approach-grid{grid-template-columns:1fr;gap:44px}.approach-grid h2{font-size:40px;margin-top:30px}.approach-steps article{gap:26px;padding:26px 0}.approach-steps h3{font-size:21px}.approach-steps p{font-size:12px}.extras-section{padding-top:65px;padding-bottom:65px;grid-template-columns:1fr;gap:30px}.service-links{margin-top:30px}.service-links>a{gap:10px;flex-wrap:wrap;padding:20px 0}.service-links>a>span:first-child{font-size:22px}.service-links small{display:none}.closing-section{padding:45px 0 38px}.closing-link{font-size:clamp(42px,10.2vw,70px);margin:38px 0 42px;line-height:1.1}.closing-link>span{font-size:1em;top:-5px;right:0;bottom:auto}.closing-bottom{display:block}.closing-bottom .pill-link{margin-top:24px;font-size:11px}.site-footer__inner{display:flex;align-items:start;flex-wrap:wrap;gap:25px}.site-footer__inner .brand{display:none}.site-footer p{width:100%;margin:0;font-size:11px}.site-footer nav{font-size:11px;gap:22px}.site-footer small{font-size:10px;margin-left:auto}.section-heading{padding:48px 0 40px}.section-heading h1{font-size:55px;line-height:1.03}.section-heading>p{font-size:14px}.catalog-grid{grid-template-columns:1fr;gap:36px;padding-bottom:48px}.catalog-card{min-height:0}.catalog-card__image{height:auto;aspect-ratio:1.1}.catalog-card__body{padding:22px 0 0}.catalog-card__body p{font-size:13px}.scope-note{padding:26px;margin-bottom:50px}.scope-note h2{font-size:28px;line-height:1.2}.scope-note p{font-size:12px}.contact-main{grid-template-columns:1fr;padding-top:48px;gap:34px;padding-bottom:55px}.contact-intro h1{font-size:62px}.contact-intro>p:not(.eyebrow){font-size:14px;line-height:1.8}.contact-intro .contact-note{margin-bottom:16px;padding:20px 0 0}.contact-form-panel{padding:25px 20px}.page-main{padding-top:48px}.page-hero h1{font-size:44px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.work-feature:hover .work-image>img{transform:none}}
/* Keep decorative geometry within its mobile canvas and remove legacy button bevels. */
.header-actions .button{box-shadow:none;background-image:none}
@media(max-width:720px){.hero-art{width:100%;height:69%;right:-8%;top:30%}}

/* AIS brand palette: midnight navy, soft blue, and cool white. */
::selection{background:#a9c9ff;color:#020d20}
.button,.button:hover{color:#020d20;background:#a9c9ff;border-color:#a9c9ff}
.button:hover{background:#c6dcff;border-color:#c6dcff}
.site-nav a:hover,.text-link:hover,.plan-link:hover,.service-links>a:hover{color:#a9c9ff}
.pill-link>span{background:#a9c9ff;color:#020d20}
.pill-link:hover{background:#a9c9ff;color:#020d20;border-color:#a9c9ff}
.pill-link:hover>span{background:#020d20;color:#a9c9ff}
.art-halo{background:radial-gradient(ellipse,#173a6260 5%,#0b294440 40%,transparent 70%)}
.art-fallback{color:#7fa4d1;text-shadow:3px 6px 1px #d2e4ff,-6px -2px 0 #23476f}
.closing-section{background:#a9c9ff;color:#020d20}
.closing-bottom{border-color:#42618b50}
.closing-bottom .pill-link{border-color:#42618b80}
.closing-bottom .pill-link>span{background:#020d20;color:#a9c9ff}
.closing-bottom .pill-link:hover{background:#020d20;color:#a9c9ff}
.closing-bottom .pill-link:hover>span{background:#a9c9ff;color:#020d20}
.skip-link{color:#020d20}
.hero-art{overflow:clip;right:-2%}
@media(max-width:720px){.hero-art{right:0}}
.hero-art{overflow:hidden}
@media(max-width:720px){.hero-composition h1{font-size:clamp(36px,11.2vw,80px)}}
/* The new work section replaces the old preview's oversized light layer. */
#demos.work-section{perspective:none;touch-action:auto}
#demos.work-section:before{content:none}

/* Surface and interaction finish — retain the AIS navy / ice-blue palette. */
:root {
  --ease-out: cubic-bezier(.22, 1, .36, 1);
  --surface-shadow: 0 24px 60px -24px #000b, 0 5px 16px -8px #0008;
  --button-shadow: inset 0 1px 0 #ffffffb3, inset 0 -2px 0 #5a85bd70,
    0 5px 10px #0003, 0 10px 30px -10px #8dbaff45;
}
.site-header {
  transition: background .4s, box-shadow .4s;
}
.site-header.is-scrolled {
  background: rgba(2,13,32,.83);
  box-shadow: 0 1px 0 #a9c9ff18, 0 12px 35px -20px #000b;
}
.button, .header-actions .button, .pill-link, .plan-link {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  transition: transform .35s var(--ease-out), box-shadow .35s, background .3s,
    border-color .3s, color .3s;
}
.button, .header-actions .button {
  background: linear-gradient(165deg, #c0d9ff 0%, #a9c9ff 52%, #97bcf5 100%);
  border: 1px solid #cce0ff9c;
  box-shadow: var(--button-shadow);
}
.button::before, .pill-link::before, .plan-link::before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: -50% -30%;
  pointer-events: none;
  background: linear-gradient(110deg, transparent 35%, #fff6 48%, transparent 62%);
  transform: translateX(-100%);
}
.button:focus-visible, .pill-link:focus-visible, .plan-link:focus-visible {
  outline: 2px solid #d9e8ff;
  outline-offset: 5px;
  box-shadow: var(--button-shadow), 0 0 0 8px #a9c9ff15;
}
.button:active, .header-actions .button:active, .pill-link:active, .plan-link:active {
  transform: translateY(1px) scale(.985);
  box-shadow: inset 0 2px 5px #020d2026, 0 2px 6px #0003;
  transition-duration: .12s;
}
.button:disabled { transform: none; box-shadow: none; }
.pill-link {
  background: linear-gradient(150deg, #a9c9ff0c, #a9c9ff03);
  border-color: #a9c9ff4d;
  box-shadow: inset 0 1px 0 #d9e8ff12, 0 8px 22px -12px #000c;
}
.pill-link>span {
  box-shadow: inset 0 1px 0 #fff9, 0 3px 9px #0003;
  transition: transform .4s var(--ease-out), background .3s, color .3s;
}
.pill-link:hover>span { transform: translate(2px,-2px); }
.header-actions .button::after, .text-link>span, .plan-link>span,
.service-links>a>span:last-child {
  transition: transform .4s var(--ease-out);
}
.text-link { text-underline-offset: 6px; }
.motion-toggle {
  padding: 9px 13px;
  border: 1px solid #a9c9ff30;
  border-radius: 99px;
  background: #071b3870;
  backdrop-filter: blur(12px);
  transition: border-color .3s, background .3s;
}
.motion-toggle:hover, .motion-toggle:focus-visible { border-color:#a9c9ff90; background:#0c2344; }
.mobile-menu summary { transition: background .25s,border-color .25s; }
.mobile-menu[open] summary { background:#a9c9ff18; border-color:#a9c9ff80; }
.mobile-menu nav { border-radius: 16px; box-shadow: var(--surface-shadow), inset 0 1px 0 #ffffff12; }
.work-image, .catalog-card__image {
  border-radius: 16px;
  box-shadow: var(--surface-shadow), 0 0 0 1px #d4e5ff12;
  transition: box-shadow .5s, transform .6s var(--ease-out);
}
.work-image::before {
  content:'';
  position:absolute;
  inset:0;
  z-index:2;
  border:1px solid #ffffff26;
  border-radius:inherit;
  pointer-events:none;
  background:linear-gradient(150deg,#ffffff09,transparent 40%);
}
.round-arrow {
  box-shadow: inset 0 1px 0 #fff5, 0 6px 20px #0003;
  transition: background .35s, color .35s, transform .45s var(--ease-out), box-shadow .35s;
}
.work-feature:hover .round-arrow { transform: translate(2px,-2px); }
.work-meta h3 { transition: color .3s; }
.plan-grid { gap: 16px; border: 0; }
.plan, .plan+.plan {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border:1px solid #a9c9ff26;
  border-radius:18px;
  background:linear-gradient(155deg,#0c203a 0%,#06152b 65%);
  box-shadow:inset 0 1px 0 #ffffff0a, 0 15px 35px -25px #000c;
  transition:transform .45s var(--ease-out), border-color .4s, box-shadow .4s;
}
.plan::before {
  content:'';
  position:absolute;
  z-index:-1;
  inset:0;
  pointer-events:none;
  background:radial-gradient(450px circle at var(--light-x,50%) var(--light-y,0%),#a9c9ff12,transparent 65%);
  opacity:0;
  transition:opacity .4s;
}
.plan-featured, .plan+.plan-featured {
  background:linear-gradient(155deg,#1a385c 0%,#0c2344 50%,#081a35 100%);
  border-color:#a9c9ff70;
  box-shadow:inset 0 1px 0 #dceaff26, 0 0 35px -15px #a9c9ff20, var(--surface-shadow);
}
.plan-number { color:#b6c9e3; }
.plan-link {
  min-height:48px;
  padding:12px 17px;
  align-items:center;
  border:1px solid #a9c9ff4d;
  border-radius:99px;
  background:#a9c9ff09;
  box-shadow:inset 0 1px 0 #ffffff0d;
}
.plan-featured .plan-link {
  color:#020d20;
  background:linear-gradient(165deg,#c0d9ff,#97bcf5);
  border-color:#cce0ff9c;
  box-shadow:var(--button-shadow);
}
.plan-demo { align-self:center; padding:6px; min-height:32px; margin-top:10px; }
.plan:focus-within { border-color:#a9c9ff90; }
.plan:focus-within::before { opacity:1; }
.service-links>a {
  position:relative;
  transition:background .35s, padding .4s var(--ease-out), border-color .3s;
}
.contact-form-panel, .scope-note {
  border-radius:20px;
  background:linear-gradient(150deg,#10243e,#07172c 70%);
  box-shadow:inset 0 1px 0 #dbeaff14,var(--surface-shadow);
}
.form-field input,.form-field textarea,.form-field select {
  border-radius:9px;
  border-color:#a9c9ff36;
  box-shadow:inset 0 2px 5px #0003;
  transition:background .25s,border-color .25s,box-shadow .25s;
}
.form-field input:focus,.form-field textarea:focus,.form-field select:focus {
  background:#081d38;
  border-color:#a9c9ffb3;
  box-shadow:0 0 0 4px #a9c9ff0e,inset 0 1px 3px #0002;
}
.closing-section {
  background:radial-gradient(ellipse at 90% 0%,#d0e2ff80,transparent 55%),linear-gradient(135deg,#b7d2ff,#9dbff5);
  box-shadow:inset 0 1px 0 #e4eeff99;
}
.closing-bottom .pill-link { background:#020d2005; box-shadow:inset 0 1px 0 #fff3,0 8px 22px -12px #020d2040; }
.closing-bottom .pill-link>span { box-shadow:inset 0 1px 0 #ffffff29,0 3px 8px #020d2033; }
@keyframes button-sheen { to { transform:translateX(100%); } }
@media(hover:hover) and (pointer:fine) {
  .button:hover,.header-actions .button:hover {
    background:linear-gradient(165deg,#d6e7ff,#b7d3ff 60%,#a3c4f8);
    box-shadow:inset 0 1px 0 #fff, inset 0 -2px 0 #5a85bd50,
      0 8px 18px #0004,0 12px 35px -10px #a9c9ff6b;
    transform:translateY(-3px);
  }
  .button:hover::before,.pill-link:hover::before,.plan-link:hover::before { animation:button-sheen .85s var(--ease-out); }
  .button:hover::after,.text-link:hover>span,.plan-link:hover>span { transform:translate(3px,-3px); }
  .pill-link:hover { transform:translateY(-3px); box-shadow:0 8px 20px #0004,0 15px 35px -15px #a9c9ff40; }
  .work-feature:hover .work-image,.catalog-card:hover .catalog-card__image {
    transform:translateY(-5px);
    box-shadow:0 35px 70px -25px #000d,0 0 0 1px #a9c9ff5c;
  }
  .work-feature:hover .work-meta h3 { color:#bcd6ff; }
  .plan:hover { transform:translateY(-6px); border-color:#a9c9ff80; box-shadow:inset 0 1px 0 #ffffff20,var(--surface-shadow); }
  .plan:hover::before { opacity:1; }
  .plan-link:hover { color:#020d20; background:#bed7ff; border-color:#bed7ff; }
  .service-links>a:hover { background:#a9c9ff05; padding-left:14px; padding-right:14px; border-color:#a9c9ff60; }
  .service-links>a:hover>span:last-child { transform:translate(3px,-3px); }
  .button:active,.header-actions .button:active,.pill-link:active,.plan-link:active { transform:translateY(1px) scale(.985); }
}
@media(max-width:1000px) and (min-width:721px) {
  .plan { padding:28px 17px; }
  .plan-link { font-size:10px; padding:12px; gap:8px; }
}
@media(max-width:720px) {
  .plan-grid { gap:18px; }
  .work-image,.catalog-card__image { border-radius:12px; }
  .contact-form-panel,.scope-note { border-radius:16px; }
}
@media(prefers-reduced-motion:reduce) {
  .button:hover,.header-actions .button:hover,.pill-link:hover,.plan:hover,
  .work-feature:hover .work-image,.catalog-card:hover .catalog-card__image,
  .button:active,.pill-link:active,.plan-link:active { transform:none; }
}

/* Editorial refinement: clearer type, tangible website previews, calmer rhythm. */
.p-hero { position:relative; }
.hero-composition { min-height:490px; padding:65px 0 92px; }
.hero-composition h1 { font-size:clamp(70px,8.5vw,126px); line-height:1.02; letter-spacing:-.067em; }
.hero-composition h1 .hero-signature {
  color:#b8d2fa;
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400;
  font-style:italic;
  letter-spacing:-.065em;
  line-height:1.15;
}
.hero-art { width:48%; height:98%; right:-1%; top:-3%; }
.hero-art.is-ready .art-fallback { visibility:hidden; }
.hero-work-peek {
  position:absolute;
  right:0;
  bottom:23px;
  display:flex;
  align-items:center;
  gap:16px;
  z-index:3;
  padding:8px 18px 8px 8px;
  background:linear-gradient(145deg,#132b46bf,#06172abf);
  border:1px solid #a9c9ff30;
  border-radius:14px;
  backdrop-filter:blur(20px);
  box-shadow:inset 0 1px 0 #ffffff0f,0 14px 30px -15px #000b;
  transition:transform .4s var(--ease-out),border-color .3s,box-shadow .3s;
}
.hero-work-peek img { width:74px; height:57px; object-fit:cover; border-radius:8px; }
.hero-work-peek small { display:block; font-size:8px; letter-spacing:.08em; color:#a7bdd8; margin-bottom:6px; }
.hero-work-peek strong { font-size:13px; font-weight:400; }
.hero-work-peek>span:last-child { font-size:22px; padding-left:10px; }
.hero-work-peek:hover { transform:translateY(-3px); border-color:#a9c9ff80; box-shadow:0 18px 35px -15px #000e; }
.motion-toggle { top:15px; bottom:auto; font-size:10px; }
.hero-bottom { grid-template-columns:1.2fr 1fr auto; align-items:center; gap:42px; padding-top:27px; }
.hero-bottom p { font-size:15px; line-height:1.7; max-width:350px; }
.hero-bottom .pill-link { font-size:14px; }
.hero-eyebrow,.section-index { font-size:11px; letter-spacing:.1em; }
.site-nav { font-size:13px; }
.header-actions .button { font-size:13px; min-height:45px; }
.studio-intro { padding-top:100px; padding-bottom:100px; }
.studio-intro h2 { font-size:clamp(35px,4.2vw,60px); }
.intro-detail { margin-top:34px; }
.intro-detail p { font-size:15px; }
.work-section { background:linear-gradient(180deg,#06162b,#07182c 75%,#020d20); }
.work-heading { margin-top:44px; }
.work-image { border-radius:16px; }
.showcase-chrome {
  position:absolute;
  z-index:4;
  top:0;left:0;right:0;
  height:35px;
  padding:0 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  color:#aebfd3;
  font-size:9px;
  letter-spacing:.07em;
  background:linear-gradient(180deg,#172a3e,#0d1c2d);
  border-bottom:1px solid #ffffff14;
}
.showcase-dots { font-size:7px; letter-spacing:3px; color:#647d98; }
.work-image>img { top:35px; height:calc(100% - 35px); }
.work-image:after { top:35px; }
.concept-top { top:68px; }
.work-meta { padding:22px 2px 0; }
.work-meta h3 { font-size:20px; }
.work-meta>span { font-size:11px; }
.work-type { border:1px solid #a9c9ff30; padding:7px 12px; border-radius:99px; letter-spacing:.05em; font-size:9px!important; }
.work-disclaimer { font-size:12px; line-height:1.7; }
.work-pair { gap:32px; }
.plan-heading-line { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.plan-badge { font-size:9px; padding:5px 8px; border:1px solid #a9c9ff35; border-radius:99px; color:#bfd6f5; white-space:nowrap; }
.plan { padding:30px 26px; }
.plan-number { font-size:11px; }
.plan h3 { min-height:76px; margin-top:28px; font-size:29px; }
.plan .plan-amount { font-size:58px; }
.plan>p:not(.plan-amount) { font-size:14px; line-height:1.75; min-height:100px; }
.plan ul { font-size:12px; line-height:2; padding-top:12px; }
.plan li { margin-bottom:7px; }
.plan-link { font-size:13px; }
.plan-demo { font-size:12px; }
.plan-note p { font-size:12px; }
.approach-grid { gap:65px; }
.approach-steps p { font-size:15px; }
.approach-steps h3 { font-size:25px; }
.service-links small { font-size:13px; }
.extras-section { padding-top:90px; padding-bottom:75px; }
.faq-section { display:grid; grid-template-columns:1fr 1.4fr; gap:90px; padding:65px 0 100px; border-top:1px solid var(--line); }
.faq-intro h2 { font-size:clamp(38px,4.2vw,60px); letter-spacing:-.055em; line-height:1.1; font-weight:400; margin:30px 0; }
.faq-list details { border-bottom:1px solid var(--line); }
.faq-list details:first-child { border-top:1px solid var(--line); }
.faq-list summary { list-style:none; cursor:pointer; padding:26px 0; display:flex; align-items:center; justify-content:space-between; gap:24px; font-size:17px; line-height:1.5; transition:color .25s; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary>span { width:28px; height:28px; flex-shrink:0; display:grid; place-items:center; border:1px solid #a9c9ff40; border-radius:50%; font-size:22px; font-weight:400; color:#a9c9ff; transition:transform .3s,background .3s; }
.faq-list summary:hover { color:#a9c9ff; }
.faq-list details[open] summary>span { transform:rotate(45deg); background:#a9c9ff15; }
.faq-answer p { font-size:14px; line-height:1.8; color:var(--muted); padding:0 44px 25px 0; margin:0; }
.faq-list details[open] .faq-answer { animation:answer-in .3s var(--ease-out); }
@keyframes answer-in { from { opacity:0; transform:translateY(-5px); } to { opacity:1; transform:translateY(0); } }
.closing-bottom p { font-size:15px; }
.closing-bottom .pill-link { font-size:14px; }
.site-footer p { font-size:13px; }
.catalog-card__body p { font-size:14px; line-height:1.8; }
.catalog-card__body .button { font-size:13px; }
@media(min-width:1600px) { .hero-composition { min-height:550px; } }
@media(max-width:1100px) and (min-width:721px) {
  .hero-bottom { grid-template-columns:1.1fr 1fr; }
  .scroll-note { display:none; }
  .plan { padding:27px 20px; }
  .plan h3 { font-size:25px; }
  .plan-heading-line { align-items:flex-start; }
  .plan-badge { display:none; }
  .plan>p:not(.plan-amount) { min-height:125px; font-size:13px; }
  .plan-link { font-size:11px; padding:12px; }
  .faq-section { gap:50px; }
}
@media(max-width:720px) {
  .header-actions .button { font-size:11px; min-height:42px; }
  .hero-eyebrow,.section-index { font-size:10px; }
  .hero-composition { min-height:460px; padding:50px 0 0; }
  .hero-composition h1 { font-size:clamp(43px,11.5vw,76px); line-height:1.05; white-space:normal; }
  .hero-composition h1 .hero-signature { font-size:1.06em; }
  .hero-art { width:100%; height:66%; right:0; top:27%; }
  .motion-toggle { top:11px; font-size:9px; padding:7px 10px; }
  .hero-work-peek { left:0; right:0; bottom:12px; gap:12px; padding:7px 12px 7px 7px; }
  .hero-work-peek img { width:62px; height:45px; }
  .hero-work-peek strong { font-size:12px; }
  .hero-work-peek small { font-size:7px; }
  .hero-work-peek>span:last-child { margin-left:auto; }
  .hero-bottom { grid-template-columns:1fr; gap:22px; padding-top:22px; }
  .hero-bottom p { font-size:14px; max-width:320px; }
  .hero-bottom .pill-link { font-size:13px; }
  .studio-intro { padding-top:68px; padding-bottom:68px; }
  .studio-intro h2 { font-size:35px; }
  .intro-detail { grid-template-columns:1fr; gap:22px; }
  .studio-symbol { font-size:44px; }
  .intro-detail p { font-size:14px; }
  .showcase-chrome { padding:0 12px; font-size:7px; height:30px; }
  .showcase-dots { font-size:5px; letter-spacing:2px; }
  .work-image>img { top:30px; height:calc(100% - 30px); }
  .work-image:after { top:30px; }
  .concept-top { top:54px; }
  .work-meta h3 { font-size:16px; }
  .work-meta>span { font-size:10px; }
  .work-disclaimer { font-size:11px; }
  .plan { padding:27px 22px; }
  .plan h3 { font-size:29px; min-height:0; }
  .plan>p:not(.plan-amount) { min-height:0; font-size:14px; }
  .plan ul { font-size:12px; }
  .plan-link { font-size:12px; }
  .plan-note p { font-size:11px; }
  .plan-badge { font-size:8px; }
  .approach-grid { gap:40px; }
  .approach-steps h3 { font-size:23px; }
  .approach-steps p { font-size:14px; }
  .extras-section { padding-top:65px; padding-bottom:65px; }
  .faq-section { grid-template-columns:1fr; gap:24px; padding-top:50px; padding-bottom:65px; }
  .faq-intro h2 br { display:none; }
  .faq-intro h2 { font-size:40px; margin:25px 0 20px; }
  .faq-list summary { font-size:15px; padding:22px 0; gap:15px; }
  .faq-answer p { padding-right:12px; font-size:14px; }
  .closing-bottom p,.closing-bottom .pill-link { font-size:13px; }
  .site-footer p { font-size:11px; }
}
@media(prefers-reduced-motion:reduce) { .hero-work-peek:hover { transform:none; } }
.faq-section { scroll-margin-top:92px; }
@media(min-width:721px) and (max-width:1000px) {
  .plan-grid { grid-template-columns:1fr; max-width:580px; margin:0 auto; }
  .plan { padding:34px; }
  .plan h3 { font-size:32px; min-height:0; }
  .plan>p:not(.plan-amount) { max-width:none; min-height:0; font-size:15px; }
  .plan ul { font-size:14px; }
  .plan-link { font-size:14px; }
  .plan-badge { display:inline-block; }
}

/* Interactive demo surface: the current editorial system, with the reference
   prototype's useful package switching brought forward into the page. */
.showcase-section {
  position:relative;
  overflow:hidden;
  padding:104px 0 112px;
  background:linear-gradient(180deg,#06162b 0%,#071b38 78%,#020d20 100%);
  scroll-margin-top:92px;
}
.showcase-section:before {
  content:'';
  position:absolute;
  width:620px;
  height:620px;
  right:-260px;
  top:180px;
  border-radius:50%;
  background:radial-gradient(circle,#a9c9ff16,transparent 68%);
  pointer-events:none;
}
.showcase-heading {
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(250px,.7fr);
  align-items:end;
  gap:48px;
  margin:44px 0 48px;
}
.showcase-heading h2 {
  margin:0;
  font-size:clamp(42px,5vw,70px);
  line-height:1.06;
  letter-spacing:-.06em;
  font-weight:400;
}
.showcase-heading h2 span { color:#a9c9ff; }
.showcase-heading p {
  max-width:350px;
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.8;
}
.showcase-layout {
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) 252px;
  gap:24px;
  align-items:end;
  padding:0 170px;
}
.showcase-followup { display:flex; align-items:center; justify-content:space-between; gap:24px; margin:28px 170px 0; padding-top:20px; border-top:1px solid #a9c9ff24; }
.showcase-followup__link { color:#a9c9ff; font-size:12px; }
.showcase-followup__note { margin:0; color:#91a9c7; font-size:10px; line-height:1.6; text-align:right; }
.showcase-browser {
  position:relative;
  z-index:2;
  min-width:0;
  overflow:hidden;
  border:1px solid #a9c9ff42;
  border-radius:20px;
  background:#08182f;
  box-shadow:0 34px 80px -34px #000e,inset 0 1px 0 #ffffff17;
  transition:opacity .18s ease,transform .45s var(--ease-out),filter .18s ease;
}
.showcase-browser.is-morphing { opacity:.36; transform:translateY(5px) scale(.995); filter:saturate(.7); }
.showcase-browser__chrome {
  display:grid;
  grid-template-columns:76px 1fr 76px;
  align-items:center;
  gap:12px;
  height:42px;
  padding:0 16px;
  border-bottom:1px solid #a9c9ff28;
  color:#9fb4d0;
  font-size:9px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.showcase-browser__dots { display:flex; gap:6px; }
.showcase-browser__dots i { width:8px; height:8px; border:1px solid #7891b1; border-radius:50%; }
.showcase-browser__address { overflow:hidden; text-align:center; text-overflow:ellipsis; white-space:nowrap; }
.showcase-browser__mark { justify-self:end; color:#a9c9ff; font-size:18px; }
.showcase-site { overflow:hidden; background:#0b1b2b; }
.showcase-site__nav {
  display:flex;
  align-items:center;
  gap:26px;
  min-height:66px;
  padding:0 28px;
  color:#dbe7f5;
  background:#091728;
  border-bottom:1px solid #ffffff12;
}
.showcase-site__brand { margin-right:auto; color:#f5f7fa; font:600 20px/1 Georgia,serif; letter-spacing:.02em; }
.showcase-site__brand small { display:block; margin-top:7px; color:#9db1c8; font:8px/1 var(--sans); letter-spacing:.14em; text-transform:uppercase; }
.showcase-site__nav nav { display:flex; gap:24px; }
.showcase-site__nav nav a { color:#aabbd0; font-size:10px; transition:color .25s ease; }
.showcase-site__nav nav a:hover,.showcase-site__nav nav a:focus-visible { color:#fff; }
.showcase-site__cta { display:inline-flex; align-items:center; justify-content:center; min-height:31px; padding:0 14px; border:1px solid #dbe7f5b3; border-radius:99px; color:#10223a; background:#eef4ff; font-size:10px; font-weight:700; transition:transform .3s var(--ease-out),background .25s ease; }
.showcase-site__cta:hover { transform:translateY(-2px); background:#a9c9ff; }
.showcase-site__hero { position:relative; aspect-ratio:1.72; min-height:340px; overflow:hidden; }
.showcase-site__hero img { display:block; width:100%; height:100%; object-fit:cover; object-position:center 56%; filter:saturate(.88); transition:opacity .3s ease,transform .8s var(--ease-out); }
.showcase-site__overlay { position:absolute; inset:0; background:linear-gradient(90deg,#071a25d9 0%,#071a2566 49%,#071a2510 100%); }
.showcase-site__copy { position:absolute; z-index:1; left:42px; bottom:40px; max-width:430px; }
.showcase-site__copy>span { color:#c6dcff; font-size:9px; letter-spacing:.16em; }
.showcase-site__copy h3 { margin:14px 0 14px; color:#fff; font:400 clamp(34px,4.4vw,64px)/.98 Georgia,serif; letter-spacing:-.045em; }
.showcase-site__copy p { max-width:300px; margin:0; color:#e0e9f2; font-size:12px; line-height:1.6; }
.showcase-site__copy .button { min-height:36px; margin-top:20px; padding:0 15px; font-size:10px; }
.showcase-site__copy .button span { margin-left:9px; font-size:16px; }
.showcase-site__features { display:grid; grid-template-columns:repeat(3,1fr); background:#f2f5f7; color:#142239; }
.showcase-site__features>div { min-width:0; padding:18px 17px 20px; border-left:1px solid #1422391c; }
.showcase-site__features>div:first-child { border-left:0; }
.showcase-feature-icon { display:block; width:28px; height:28px; margin-bottom:12px; color:#285b9f; font-size:19px; }
.showcase-site__features strong { display:block; font-size:12px; }
.showcase-site__features p { margin:5px 0 0; color:#596b82; font-size:10px; line-height:1.5; }
.showcase-rail { position:relative; z-index:2; padding:26px 20px 22px; border:1px solid #a9c9ff36; border-radius:18px; background:#06152bcc; box-shadow:inset 0 1px 0 #ffffff0e,0 24px 45px -28px #000d; }
.showcase-rail__label { margin:0 0 18px; color:#a9c9ff; font-size:9px; letter-spacing:.13em; }
.showcase-switcher { display:grid; gap:6px; }
.showcase-switcher button { display:grid; gap:5px; width:100%; padding:12px 11px; border:1px solid transparent; border-radius:10px; color:#aebed2; background:transparent; text-align:left; cursor:pointer; transition:background .25s ease,border-color .25s ease,color .25s ease,transform .25s var(--ease-out); }
.showcase-switcher button:hover { transform:translateX(3px); color:#eef4ff; background:#a9c9ff0c; border-color:#a9c9ff32; }
.showcase-switcher button.is-selected { color:#06152b; background:#a9c9ff; border-color:#d4e5ff; box-shadow:0 8px 22px -14px #a9c9ff; }
.showcase-switcher button strong { font-size:12px; font-weight:500; }
.showcase-switcher button strong span { font-weight:400; }
.showcase-switcher button small { font-size:9px; line-height:1.35; opacity:.72; }
.showcase-switcher button.is-selected small { opacity:.7; }
.showcase-rail__note { margin-top:28px; padding-top:20px; border-top:1px solid #a9c9ff28; }
.showcase-rail__note>span { color:#91a9c7; font-size:9px; letter-spacing:.1em; }
.showcase-rail__note p { min-height:78px; margin:12px 0 16px; color:#d3dfed; font-size:12px; line-height:1.7; }
.showcase-rail__note .text-link { color:#a9c9ff; font-size:11px; gap:10px; }
.showcase-phone { position:absolute; z-index:3; display:block; width:138px; height:258px; overflow:hidden; padding:7px; border:1px solid #a9c9ff5c; border-radius:25px; background:#0a1c34; color:#fff; box-shadow:0 28px 50px -25px #000f, inset 0 1px 0 #fff2; cursor:pointer; transition:transform .5s var(--ease-out),border-color .3s ease; }
.showcase-phone:hover,.showcase-phone:focus-visible { border-color:#c6dcff; }
.showcase-phone--left { left:-3px; top:122px; transform:rotate(-7deg); }
.showcase-phone--right { right:-4px; bottom:38px; transform:rotate(7deg); }
.showcase-phone--left:hover,.showcase-phone--left:focus-visible { transform:rotate(-4deg) translateY(-5px); }
.showcase-phone--right:hover,.showcase-phone--right:focus-visible { transform:rotate(4deg) translateY(-5px); }
.showcase-phone img { display:block; width:100%; height:100%; object-fit:cover; border-radius:19px; filter:saturate(.82); }
.showcase-phone__island { position:absolute; z-index:2; top:13px; left:50%; width:48px; height:13px; border-radius:99px; background:#020d20; transform:translateX(-50%); }
.showcase-phone__shade { position:absolute; inset:7px; border-radius:19px; background:linear-gradient(180deg,#020d2040 5%,transparent 46%,#020d20d9 100%); pointer-events:none; }
.showcase-phone__copy { position:absolute; z-index:2; left:18px; right:14px; bottom:20px; display:grid; gap:6px; text-align:left; }
.showcase-phone__copy small { color:#c6dcff; font-size:7px; letter-spacing:.1em; }
.showcase-phone__copy strong { font:400 20px/1 Georgia,serif; }
.showcase-phone__copy em { color:#eef4ffcc; font-size:8px; font-style:normal; }
.package-configurator { display:grid; grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr); gap:48px; margin-top:78px; padding-top:52px; border-top:1px solid var(--line); }
.configurator-copy { padding-top:7px; }
.configurator-copy h3 { max-width:360px; margin:28px 0 18px; font-size:clamp(35px,4vw,56px); font-weight:400; line-height:1.05; letter-spacing:-.06em; }
.configurator-copy>p:last-child { max-width:340px; margin:0; color:var(--muted); font-size:13px; line-height:1.8; }
.configurator-panel { padding:26px; border:1px solid #a9c9ff3b; border-radius:18px; background:linear-gradient(145deg,#102844,#07172c 72%); box-shadow:inset 0 1px 0 #dbeaff12,0 25px 55px -35px #000f; }
.configurator-panel__top { display:flex; align-items:baseline; justify-content:space-between; gap:18px; padding-bottom:19px; border-bottom:1px solid #a9c9ff2d; }
.configurator-panel__top span,.configurator-total>span { color:#91a9c7; font-size:9px; letter-spacing:.12em; }
.configurator-panel__top strong { color:#eef4ff; font-size:18px; font-weight:400; }
.configurator-addons { display:grid; gap:8px; margin:0; padding:0; border:0; }
.configurator-addons legend { margin-bottom:8px; color:#91a9c7; font-size:9px; letter-spacing:.12em; text-transform:uppercase; }
.configurator-addons label { display:flex; align-items:center; gap:12px; min-height:52px; padding:10px 12px; border:1px solid transparent; border-radius:10px; background:#07172c70; cursor:pointer; transition:background .25s ease,border-color .25s ease; }
.configurator-addons label:hover { border-color:#a9c9ff45; background:#a9c9ff08; }
.configurator-addons input { appearance:none; flex:0 0 18px; width:18px; height:18px; margin:0; border:1px solid #91a9c7; border-radius:5px; background:#020d20; cursor:pointer; }
.configurator-addons input:checked { border-color:#a9c9ff; background:#a9c9ff; box-shadow:inset 0 0 0 4px #0b203a; }
.configurator-addons label>span { display:grid; gap:3px; }
.configurator-addons strong { color:#e9f1fb; font-size:12px; font-weight:400; }
.configurator-addons strong em { color:#a9c9ff; font-style:normal; }
.configurator-addons small { color:#8fa4bc; font-size:10px; }
.configurator-total { display:grid; grid-template-columns:1fr auto; align-items:end; gap:4px 16px; margin:22px 0 18px; padding-top:18px; border-top:1px solid #a9c9ff2d; }
.configurator-total strong { color:#a9c9ff; font-size:32px; font-weight:400; letter-spacing:-.04em; }
.configurator-total small { grid-column:1 / -1; color:#91a9c7; font-size:10px; }
.configurator-panel>.button { width:100%; justify-content:space-between; min-height:46px; font-size:12px; }
@media(hover:hover) and (pointer:fine) {
  .showcase-site__hero:hover img { transform:scale(1.02); }
}
@media(max-width:1439px) and (min-width:721px) {
  .showcase-layout { padding:0; }
  .showcase-phone { display:none; }
  .showcase-heading { grid-template-columns:1fr .8fr; }
}
@media(max-width:720px) {
  .showcase-section { padding:72px 0 76px; }
  .showcase-heading { display:block; margin:32px 0 34px; }
  .showcase-heading h2 { font-size:39px; }
  .showcase-heading p { margin-top:22px; font-size:12px; }
  .showcase-layout { display:block; padding:0; }
  .showcase-followup { display:block; margin:24px 0 0; padding-top:18px; }
  .showcase-followup__note { margin-top:10px; text-align:left; }
  .showcase-browser { border-radius:14px; }
  .showcase-browser__chrome { grid-template-columns:50px 1fr 28px; height:34px; padding:0 11px; font-size:7px; }
  .showcase-browser__dots i { width:6px; height:6px; }
  .showcase-site__nav { min-height:53px; padding:0 15px; gap:12px; }
  .showcase-site__brand { font-size:15px; }
  .showcase-site__brand small { margin-top:5px; font-size:6px; }
  .showcase-site__nav nav { display:none; }
  .showcase-site__cta { min-height:27px; padding:0 10px; font-size:8px; }
  .showcase-site__hero { aspect-ratio:1.04; min-height:300px; }
  .showcase-site__copy { left:22px; right:18px; bottom:25px; }
  .showcase-site__copy>span { font-size:7px; }
  .showcase-site__copy h3 { margin:10px 0 10px; font-size:40px; }
  .showcase-site__copy p { max-width:260px; font-size:10px; }
  .showcase-site__copy .button { min-height:32px; margin-top:16px; font-size:9px; }
  .showcase-site__features>div { padding:13px 10px 14px; }
  .showcase-feature-icon { width:20px; height:20px; margin-bottom:7px; font-size:15px; }
  .showcase-site__features strong { font-size:10px; }
  .showcase-site__features p { display:none; }
  .showcase-rail { margin-top:16px; padding:20px 16px 18px; border-radius:14px; }
  .showcase-switcher { grid-template-columns:repeat(3,1fr); gap:5px; }
  .showcase-switcher button { padding:10px 8px; }
  .showcase-switcher button strong { font-size:10px; }
  .showcase-switcher button small { font-size:8px; }
  .showcase-rail__note { margin-top:18px; padding-top:16px; }
  .showcase-rail__note p { min-height:0; margin:9px 0 12px; font-size:11px; }
  .showcase-phone { display:none; }
  .package-configurator { grid-template-columns:1fr; gap:28px; margin-top:58px; padding-top:38px; }
  .configurator-copy h3 { margin:21px 0 14px; font-size:38px; }
  .configurator-copy>p:last-child { font-size:12px; }
  .configurator-panel { padding:18px; border-radius:14px; }
  .configurator-panel__top { display:grid; gap:8px; }
  .configurator-panel__top strong { font-size:16px; }
}
@media(prefers-reduced-motion:reduce) {
  .showcase-browser.is-morphing { opacity:1; transform:none; filter:none; }
  .showcase-phone--left,.showcase-phone--right,.showcase-phone--left:hover,.showcase-phone--right:hover { transform:none; }
}

/* Let the first screen hand off to the website demos sooner; the sculpture
   remains part of the identity without owning the entire hero composition. */
.p-hero { min-height:clamp(610px,calc(82svh - 16px),760px); }
.hero-composition { min-height:380px; padding:42px 0 64px; }
.hero-art { width:39%; height:78%; right:0; top:8%; }
.hero-work-peek { bottom:12px; }
@media(max-width:1000px) and (min-width:721px) {
  .p-hero { min-height:clamp(560px,calc(78svh - 16px),680px); }
  .hero-composition { min-height:340px; padding:38px 0 58px; }
  .hero-art { width:43%; height:75%; top:10%; }
}
@media(max-width:720px) {
  .p-hero { min-height:calc(86svh - 66px); }
  .hero-composition { min-height:350px; padding:34px 0 72px; }
  .hero-art { width:88%; height:64%; right:0; top:27%; }
  .hero-work-peek { bottom:10px; gap:10px; padding:6px 12px 6px 6px; }
  .hero-work-peek img { width:58px; height:45px; }
}

/* Prototype button language: soft corners, stronger contrast, and one clear action hierarchy. */
.premium-home .header-actions .button,
.premium-home .hero-bottom .pill-link,
.premium-home .configurator-panel > .button {
  min-height:52px;
  padding:0 18px 0 22px;
  gap:14px;
  border:1px solid #e4efff;
  border-radius:10px;
  color:#06152b;
  background:linear-gradient(180deg,#c8ddff 0%,#a9c9ff 100%);
  box-shadow:inset 0 1px 0 #fff,inset 0 -2px 0 #7699ca66,0 12px 28px -16px #a9c9ff;
}
.premium-home .header-actions .button::after {
  content:none;
}
.premium-home .header-actions .button,
.premium-home .hero-bottom .pill-link,
.premium-home .configurator-panel > .button {
  justify-content:center;
}
.premium-home .closing-bottom .pill-link {
  min-height:50px;
  justify-content:center;
  padding:0 20px;
  gap:0;
  border-radius:10px;
}
.premium-home .plan-link {
  min-height:50px;
  padding:0 18px;
  align-items:center;
  border:1px solid #a9c9ff52;
  border-radius:10px;
  background:#a9c9ff08;
  color:#dce9fa;
  box-shadow:none;
}
.premium-home .plan-featured .plan-link {
  border-color:#e4efff;
  color:#06152b;
  background:linear-gradient(180deg,#c8ddff 0%,#a9c9ff 100%);
  box-shadow:inset 0 1px 0 #fff,inset 0 -2px 0 #7699ca66,0 12px 28px -16px #a9c9ff;
}
.premium-home .approach-steps article::before {
  content:'';
  flex:0 0 8px;
  width:8px;
  height:8px;
  margin-top:8px;
  border-radius:50%;
  background:#a9c9ff;
  box-shadow:0 0 0 5px #a9c9ff14;
}
.premium-home .approach-steps article > span { display:none; }
@media(hover:hover) and (pointer:fine) {
  .premium-home .header-actions .button:hover,
  .premium-home .hero-bottom .pill-link:hover,
  .premium-home .configurator-panel > .button:hover {
    color:#06152b;
    background:linear-gradient(180deg,#e0ecff 0%,#c0d9ff 100%);
    border-color:#fff;
    box-shadow:inset 0 1px 0 #fff,inset 0 -2px 0 #7699ca55,0 14px 30px -14px #a9c9ff;
    transform:translateY(-3px);
  }
  .premium-home .plan-link:hover {
    color:#eef4ff;
    background:#a9c9ff16;
    border-color:#a9c9ff;
    box-shadow:0 10px 22px -18px #a9c9ff;
    transform:translateY(-2px);
  }
  .premium-home .plan-featured .plan-link:hover {
    color:#06152b;
    background:linear-gradient(180deg,#e0ecff 0%,#c0d9ff 100%);
  }
}
@media(max-width:720px) {
  .premium-home .header-actions .button { min-height:42px; padding:0 13px 0 15px; border-radius:9px; }
  .premium-home .hero-bottom .pill-link,
  .premium-home .configurator-panel > .button { min-height:50px; border-radius:9px; }
  .premium-home .plan-link { min-height:52px; border-radius:9px; }
}
@media(prefers-reduced-motion:reduce) {
  .premium-home .header-actions .button:hover,
  .premium-home .hero-bottom .pill-link:hover,
  .premium-home .configurator-panel > .button:hover,
  .premium-home .plan-link:hover { transform:none; }
}

/* Minimal landing-page pass: fewer handoffs, one clear action per section. */
.premium-home .hero-bottom { grid-template-columns:1fr auto; }
.premium-home .showcase-section { padding:82px 0 84px; }
.premium-home .showcase-heading { margin:0 0 34px; }
.premium-home .showcase-heading h2 { max-width:520px; }
.premium-home .showcase-heading p { max-width:300px; }
.premium-home .showcase-layout { display:block; gap:0; padding:0; }
.premium-home .showcase-rail { padding:20px 18px; }
.premium-home .showcase-rail__note { margin-top:16px; padding-top:16px; }
.premium-home .showcase-disclaimer { margin:18px 0 0; color:#91a9c7; font-size:10px; line-height:1.6; }
.premium-home .plans-section { padding-top:84px; padding-bottom:72px; }
.premium-home .plans-section .work-heading { margin:0 0 36px; }
.premium-home .plans-section .work-heading > p { max-width:250px; }
.premium-home .configurator-copy h3 { max-width:260px; margin:12px 0 0; font-size:clamp(26px,2.8vw,34px); letter-spacing:-.045em; }
.premium-home .plan li:before { content:none; margin-right:0; }
.premium-home .plan-note { margin-top:18px; }
.premium-home .compact-question { margin-top:28px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.premium-home .compact-question summary { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:18px 0; cursor:pointer; list-style:none; font-size:13px; }
.premium-home .compact-question summary::-webkit-details-marker { display:none; }
.premium-home .compact-question summary > span { display:grid; place-items:center; flex:0 0 28px; width:28px; height:28px; border:1px solid #a9c9ff40; border-radius:50%; color:#a9c9ff; font-size:20px; transition:transform .3s,background .3s; }
.premium-home .compact-question[open] summary > span { transform:rotate(45deg); background:#a9c9ff15; }
.premium-home .compact-question .faq-answer p { max-width:520px; margin:0; padding:0 44px 20px 0; color:var(--muted); font-size:12px; line-height:1.7; }
.premium-home .approach-section { padding:84px 0; }
.premium-home .approach-grid h2 { margin-top:0; }
.premium-home .closing-section { padding:56px 0 48px; }
.premium-home .closing-link { margin:0; }
@media(max-width:720px) {
  .premium-home .showcase-section { padding:58px 0 60px; }
  .premium-home .showcase-heading { margin:0 0 26px; }
  .premium-home .showcase-heading p { max-width:280px; }
  .premium-home .showcase-layout { display:block; }
  .premium-home .showcase-rail { margin-top:14px; }
  .premium-home .showcase-disclaimer { margin-top:14px; }
  .premium-home .plans-section { padding-top:58px; padding-bottom:58px; }
  .premium-home .plans-section .work-heading { margin-bottom:26px; }
  .premium-home .plan ul { flex:initial; }
  .premium-home .package-configurator { margin-top:46px; padding-top:28px; gap:20px; }
  .premium-home .configurator-copy h3 { margin:10px 0 0; font-size:28px; }
  .premium-home .approach-section { padding:58px 0; }
  .premium-home .closing-section { padding:46px 0 36px; }
}

/* Final hierarchy pass: one demo action and one focused product proof. */
.premium-home .showcase-site__brand {
  display:block;
  pointer-events:none;
}
.premium-home .showcase-site__nav-links {
  display:flex;
  gap:24px;
  margin-left:auto;
  color:#aabbd0;
  font-size:10px;
}
.premium-home .showcase-site__nav-links span { display:block; }
.premium-home #showcase-live-link {
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  width:100%;
  padding:0 14px;
  border:1px solid #c6dcff;
  border-radius:10px;
  color:#06152b;
  background:linear-gradient(165deg,#c0d9ff,#97bcf5);
  box-shadow:var(--button-shadow);
  font-size:11px;
  text-decoration:none;
  transition:transform .35s var(--ease-out),background .3s,box-shadow .3s;
}
.premium-home #showcase-live-link:hover {
  color:#06152b;
  background:linear-gradient(165deg,#e0ecff,#b7d3ff 60%,#a3c4f8);
  box-shadow:0 10px 24px -12px #a9c9ff;
  transform:translateY(-2px);
}
.premium-home .showcase-rail__note { border-top:0; }
.premium-home .app-proof {
  padding:84px 0;
  background:#020d20;
}
.premium-home .app-proof__card {
  display:grid;
  grid-template-columns:minmax(250px,.72fr) minmax(0,1.28fr);
  gap:48px;
  align-items:center;
  padding:42px;
  border:1px solid #a9c9ff2b;
  border-radius:22px;
  background:linear-gradient(145deg,#0d2340,#06152b 68%);
  box-shadow:inset 0 1px 0 #ffffff0d,0 24px 55px -35px #000e;
}
.premium-home .app-proof__copy h2 {
  margin:14px 0 36px;
  color:#eef4ff;
  font-size:clamp(34px,4vw,56px);
  line-height:1.04;
  font-weight:400;
  letter-spacing:-.06em;
}
.premium-home .app-proof__product {
  display:flex;
  align-items:center;
  gap:16px;
  max-width:330px;
}
.premium-home .app-proof__product img,
.premium-home .app-proof__sidebar-logo img {
  display:block;
  border-radius:22%;
  box-shadow:0 10px 22px -14px #000c;
}
.premium-home .app-proof__product h3 {
  margin:0 0 5px;
  font-size:18px;
  font-weight:500;
  letter-spacing:-.03em;
}
.premium-home .app-proof__product p {
  margin:0;
  color:var(--muted);
  font-size:12px;
  line-height:1.65;
}
.premium-home .app-proof__link {
  display:inline-flex;
  align-items:center;
  min-height:46px;
  margin-top:34px;
  padding:0 17px;
  border:1px solid #a9c9ff59;
  border-radius:10px;
  color:#06152b;
  background:#a9c9ff;
  font-size:11px;
  text-decoration:none;
  transition:transform .35s var(--ease-out),background .3s,box-shadow .3s;
}
.premium-home .app-proof__link:hover {
  color:#06152b;
  background:#c6dcff;
  box-shadow:0 10px 25px -15px #a9c9ff;
  transform:translateY(-2px);
}
.premium-home .app-proof__screen {
  min-width:0;
  overflow:hidden;
  padding:10px;
  border:1px solid #a9c9ff3d;
  border-radius:18px;
  background:#081a31;
  box-shadow:0 25px 50px -30px #000e,inset 0 1px 0 #ffffff13;
}
.premium-home .app-proof__window-bar {
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:12px;
  min-height:34px;
  padding:0 8px;
  color:#afc3dc;
  font-size:9px;
  letter-spacing:.04em;
}
.premium-home .app-proof__window-dots { display:flex; gap:5px; }
.premium-home .app-proof__window-dots i {
  width:6px;
  height:6px;
  border:1px solid #7d97b9;
  border-radius:50%;
}
.premium-home .app-proof__window-status { justify-self:end; color:#7f9abd; font-size:8px; }
.premium-home .app-proof__workspace {
  display:grid;
  grid-template-columns:116px minmax(0,1fr);
  min-height:284px;
  overflow:hidden;
  border-radius:11px;
  color:#172840;
  background:#edf3fb;
}
.premium-home .app-proof__sidebar {
  display:grid;
  align-content:start;
  gap:5px;
  padding:15px 10px;
  background:#dbe7f6;
  color:#5c708d;
  font-size:9px;
}
.premium-home .app-proof__sidebar-logo { margin-bottom:15px; }
.premium-home .app-proof__sidebar-logo img { border-radius:6px; }
.premium-home .app-proof__sidebar span:not(.app-proof__sidebar-logo) {
  padding:8px 9px;
  border-radius:6px;
}
.premium-home .app-proof__sidebar .is-active { color:#14325a; background:#bcd3f1; }
.premium-home .app-proof__content { min-width:0; padding:24px; }
.premium-home .app-proof__content-head {
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:18px;
  padding-bottom:18px;
  border-bottom:1px solid #cbd8e8;
}
.premium-home .app-proof__content-head div { display:grid; gap:5px; }
.premium-home .app-proof__content-head small,
.premium-home .app-proof__clip-grid small {
  color:#6b82a0;
  font-size:8px;
  letter-spacing:.12em;
}
.premium-home .app-proof__content-head strong { font-size:20px; font-weight:500; letter-spacing:-.04em; }
.premium-home .app-proof__search {
  padding:8px 10px;
  border:1px solid #c6d4e5;
  border-radius:7px;
  color:#7890ad;
  font-size:9px;
}
.premium-home .app-proof__clip-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  padding-top:18px;
}
.premium-home .app-proof__clip-grid article {
  display:grid;
  align-content:start;
  gap:10px;
  min-height:124px;
  padding:14px;
  border:1px solid #d2deec;
  border-radius:8px;
  background:#f8fbff;
  box-shadow:0 8px 18px -15px #3b5675;
}
.premium-home .app-proof__clip-grid article:nth-child(2) { background:#e7f0fb; }
.premium-home .app-proof__clip-grid strong { font-size:11px; line-height:1.45; font-weight:500; }
.premium-home .app-proof__clip-grid p { margin:0; color:#7c90aa; font-size:8px; }
@media(max-width:720px) {
  .premium-home .hero-bottom { display:block; }
  .premium-home .hero-bottom .pill-link { margin-top:18px; }
  .premium-home .showcase-site__nav-links { display:none; }
  .premium-home #showcase-live-link { min-height:50px; }
  .premium-home .app-proof { padding:58px 0; }
  .premium-home .app-proof__card { display:block; padding:24px 18px 18px; border-radius:16px; }
  .premium-home .app-proof__copy h2 { margin:12px 0 28px; font-size:36px; }
  .premium-home .app-proof__link { width:100%; justify-content:center; margin-top:26px; }
  .premium-home .app-proof__screen { margin-top:30px; padding:7px; border-radius:14px; }
  .premium-home .app-proof__window-bar { min-height:29px; font-size:8px; }
  .premium-home .app-proof__workspace { grid-template-columns:78px minmax(0,1fr); min-height:300px; }
  .premium-home .app-proof__sidebar { gap:3px; padding:11px 7px; font-size:8px; }
  .premium-home .app-proof__sidebar span:not(.app-proof__sidebar-logo) { padding:7px 6px; }
  .premium-home .app-proof__content { padding:16px 12px; }
  .premium-home .app-proof__content-head { align-items:start; display:grid; gap:11px; padding-bottom:13px; }
  .premium-home .app-proof__content-head strong { font-size:17px; }
  .premium-home .app-proof__search { width:max-content; }
  .premium-home .app-proof__clip-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; padding-top:13px; }
  .premium-home .app-proof__clip-grid article { min-height:110px; padding:10px; gap:8px; }
  .premium-home .app-proof__clip-grid article:nth-child(3) { grid-column:1 / -1; min-height:68px; }
  .premium-home .app-proof__clip-grid strong { font-size:10px; }
}

/* Prototype-inspired homepage stage: a living backdrop, three visible demo
   choices, and one horizontal selector beneath the active preview. */
.premium-home {
  position:relative;
  isolation:isolate;
  background:#020d20;
}
.premium-home > .site-header,
.premium-home > main,
.premium-home > .site-footer {
  position:relative;
  z-index:1;
}
.premium-home .canvas-ambient-backdrop {
  position:fixed;
  z-index:0;
  inset:0;
  width:100vw;
  height:100vh;
  pointer-events:none;
  opacity:.92;
}
.premium-home .showcase-section {
  background:linear-gradient(180deg,rgba(6,22,43,.84) 0%,rgba(7,27,56,.8) 78%,rgba(2,13,32,.9) 100%);
}
.premium-home .showcase-layout {
  perspective:1500px;
}
.premium-home .showcase-rail {
  display:flex;
  align-items:center;
  gap:18px;
  min-width:0;
  margin-top:18px;
  padding:10px 12px 10px 14px;
  border-radius:999px;
  background:rgba(4,15,31,.84);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 22px 44px -30px #000f;
}
.premium-home .showcase-switcher {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  flex:1;
  gap:4px;
  min-width:0;
}
.premium-home .showcase-switcher button {
  min-width:0;
  padding:12px 14px;
  border-radius:999px;
}
.premium-home .showcase-switcher button strong {
  white-space:nowrap;
}
.premium-home .showcase-rail__note {
  flex:0 0 auto;
  min-width:166px;
  margin:0;
  padding:0 2px 0 4px;
  border:0;
}
.premium-home #showcase-live-link {
  width:auto;
  min-height:44px;
  white-space:nowrap;
}

@keyframes showcase-phone-float-left {
  0%,100% { transform:rotateY(12deg) rotateX(2deg) rotateZ(.4deg) translateY(0); }
  50% { transform:rotateY(12deg) rotateX(2deg) rotateZ(.4deg) translateY(-8px); }
}
@keyframes showcase-phone-float-right {
  0%,100% { transform:rotateY(-12deg) rotateX(2deg) rotateZ(-.4deg) translateY(0); }
  50% { transform:rotateY(-12deg) rotateX(2deg) rotateZ(-.4deg) translateY(-8px); }
}

@media(min-width:1101px) {
  .premium-home .showcase-layout {
    display:grid;
    grid-template-columns:minmax(210px,240px) minmax(0,1fr) minmax(210px,240px);
    gap:24px;
    align-items:center;
    width:min(100%,1240px);
    margin-inline:auto;
    padding:0;
  }
  .premium-home .showcase-site__hero {
    aspect-ratio:2.15;
    min-height:0;
  }
  .premium-home .showcase-site__copy {
    left:32px;
    bottom:28px;
    max-width:430px;
  }
  .premium-home .showcase-browser {
    grid-column:2;
    grid-row:1;
  }
  .premium-home .showcase-rail {
    grid-column:2;
    grid-row:2;
  }
  .premium-home .showcase-phone {
    display:block;
    position:relative;
    inset:auto;
    grid-row:1;
    align-self:center;
    justify-self:center;
    width:min(100%,230px);
    height:clamp(380px,35vw,480px);
    margin:0;
    transform-style:preserve-3d;
  }
  .premium-home .showcase-phone--left {
    grid-column:1;
    animation:showcase-phone-float-left 8s ease-in-out infinite;
  }
  .premium-home .showcase-phone--right {
    grid-column:3;
    animation:showcase-phone-float-right 8s 1.1s ease-in-out infinite;
  }
  .premium-home .showcase-phone:hover,
  .premium-home .showcase-phone:focus-visible {
    animation:none;
  }
  .premium-home .showcase-phone--left:hover,
  .premium-home .showcase-phone--left:focus-visible {
    transform:rotateY(4deg) rotateX(1deg) translateY(-6px);
  }
  .premium-home .showcase-phone--right:hover,
  .premium-home .showcase-phone--right:focus-visible {
    transform:rotateY(-4deg) rotateX(1deg) translateY(-6px);
  }
}
@media(max-width:1100px) and (min-width:721px) {
  .premium-home .showcase-layout {
    display:block;
    width:min(100%,920px);
    margin-inline:auto;
    padding:0 18px;
  }
  .premium-home .showcase-phone { display:none; }
}
@media(max-width:720px) {
  .premium-home .showcase-rail {
    display:block;
    padding:10px;
    border-radius:18px;
  }
  .premium-home .showcase-switcher { gap:5px; }
  .premium-home .showcase-switcher button { padding:11px 7px; }
  .premium-home .showcase-switcher button strong { font-size:12px; }
  .premium-home .showcase-switcher button small { font-size:9px; }
  .premium-home .showcase-rail__note {
    min-width:0;
    margin-top:10px;
    padding:10px 0 0;
    border-top:1px solid #a9c9ff28;
  }
  .premium-home #showcase-live-link { width:100%; }
}
@media(prefers-reduced-motion:reduce) {
  .premium-home .showcase-phone--left,
  .premium-home .showcase-phone--right { animation:none; }
}

/* A calm portfolio proof point: two real product screens, then a lighter
   catalogue for the rest of the shipped work. */
.premium-home .built-apps {
  padding:clamp(86px,10vw,132px) 0 clamp(92px,11vw,144px);
  background:#020d20;
}
.premium-home .built-apps > .site-shell {
  display:block;
  padding:0;
}
.premium-home .built-apps__intro {
  max-width:590px;
  margin:0 0 48px;
}
.premium-home .built-apps__intro h2 {
  margin:14px 0 18px;
  color:#eef4ff;
  font-size:clamp(42px,6vw,78px);
  line-height:.96;
  font-weight:400;
  letter-spacing:-.07em;
}
.premium-home .built-apps__intro > p:last-child {
  max-width:360px;
  margin:0;
  color:#9eb2cd;
  font-size:14px;
  line-height:1.6;
}
.premium-home .built-apps__group + .built-apps__group {
  margin-top:68px;
}
.premium-home .built-apps__group-head {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  margin-bottom:18px;
}
.premium-home .built-apps__group-label {
  margin:0 0 7px;
  color:#82a7d4;
  font-size:10px;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.premium-home .built-apps__group-note {
  margin:0;
  color:#7189a9;
  font-size:12px;
  line-height:1.5;
}
.premium-home .built-apps__features {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}
.premium-home .built-apps__feature {
  min-width:0;
}
.premium-home .built-apps__media {
  display:grid;
  place-items:center;
  height:clamp(286px,31vw,348px);
  overflow:hidden;
  padding:22px;
  border:1px solid #a9c9ff2b;
  border-radius:18px;
  background:#07182e;
  box-shadow:inset 0 1px 0 #ffffff0d,0 24px 54px -42px #000e;
}
.premium-home .built-apps__media img {
  display:block;
  width:auto;
  height:calc(clamp(286px,31vw,348px) - 44px);
  max-width:100%;
  object-fit:contain;
  border-radius:16px;
  box-shadow:0 20px 34px -24px #000e;
  transform:scale(1.18);
}
.premium-home .built-apps__feature-copy {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;
  padding:20px 2px 0;
}
.premium-home .built-apps__feature-main {
  min-width:0;
}
.premium-home .built-apps__feature-heading {
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:13px;
}
.premium-home .built-apps__feature-icon {
  display:block;
  flex:0 0 auto;
  width:48px;
  height:48px;
  border:1px solid #a9c9ff38;
  border-radius:13px;
  box-shadow:0 12px 24px -18px #000e;
}
.premium-home .built-apps__label {
  margin-bottom:5px;
  color:#82a7d4;
  font-size:9px;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.premium-home .built-apps__feature h3 {
  margin:0 0 8px;
  color:#eef4ff;
  font-size:24px;
  font-weight:500;
  letter-spacing:-.045em;
}
.premium-home .built-apps__feature p {
  max-width:370px;
  margin:0;
  color:#9eb2cd;
  font-size:12px;
  line-height:1.65;
}
.premium-home .built-apps__feature-copy > a {
  display:inline-flex;
  flex:0 0 auto;
  align-items:center;
  gap:7px;
  margin-top:21px;
  color:#bcd3f7;
  font-size:11px;
  text-decoration:none;
  white-space:nowrap;
  transition:color .25s ease,transform .25s var(--ease-out);
}
.premium-home .built-apps__feature-copy > a span,
.premium-home .built-apps__item-cta {
  color:#7fa5d4;
}
.premium-home .built-apps__feature-copy > a:hover {
  color:#eef4ff;
  transform:translateX(3px);
}
.premium-home .built-apps__catalogue {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:34px;
  border-top:1px solid #a9c9ff2b;
}
.premium-home .built-apps__catalogue--single {
  grid-template-columns:minmax(0,1fr);
  max-width:calc(50% - 17px);
}
.premium-home .built-apps__item {
  display:grid;
  grid-template-columns:56px minmax(0,1fr) auto;
  align-items:center;
  gap:16px;
  min-width:0;
  padding:22px 0;
  border-bottom:1px solid #a9c9ff2b;
  color:#eef4ff;
  text-decoration:none;
  transition:color .25s ease,transform .25s var(--ease-out);
}
.premium-home .built-apps__item:nth-child(even) {
  padding-left:34px;
  border-left:1px solid #a9c9ff2b;
}
.premium-home .built-apps__item img {
  display:block;
  width:56px;
  height:56px;
  border:1px solid #a9c9ff38;
  border-radius:15px;
  box-shadow:0 12px 24px -18px #000e;
}
.premium-home .built-apps__item-copy {
  display:grid;
  min-width:0;
  gap:6px;
}
.premium-home .built-apps__item-copy strong {
  overflow:hidden;
  color:#eef4ff;
  font-size:15px;
  font-weight:500;
  letter-spacing:-.02em;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.premium-home .built-apps__item-copy span {
  overflow:hidden;
  color:#8fa6c4;
  font-size:11px;
  line-height:1.45;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.premium-home .built-apps__item-cta {
  font-size:10px;
  white-space:nowrap;
  transition:color .25s ease;
}
.premium-home .built-apps__item:hover {
  color:#fff;
  transform:translateX(3px);
}
.premium-home .built-apps__item:hover .built-apps__item-cta { color:#c6dcff; }
.premium-home .built-apps__feature-copy > a:focus-visible,
.premium-home .built-apps__item:focus-visible {
  outline:2px solid #a9c9ff;
  outline-offset:5px;
  border-radius:4px;
}
@media(max-width:760px) {
  .premium-home .built-apps { padding:70px 0 88px; }
  .premium-home .built-apps__intro { margin-bottom:34px; }
  .premium-home .built-apps__intro h2 { font-size:clamp(42px,13vw,58px); }
  .premium-home .built-apps__group + .built-apps__group { margin-top:52px; }
  .premium-home .built-apps__group-head { display:block; margin-bottom:15px; }
  .premium-home .built-apps__features { grid-template-columns:1fr; gap:42px; }
  .premium-home .built-apps__media { height:310px; padding:18px; }
  .premium-home .built-apps__media img { height:274px; }
  .premium-home .built-apps__feature-copy { display:block; padding-top:16px; }
  .premium-home .built-apps__feature-copy > a { margin-top:17px; }
  .premium-home .built-apps__catalogue {
    display:block;
  }
  .premium-home .built-apps__catalogue--single {
    max-width:none;
  }
  .premium-home .built-apps__item,
  .premium-home .built-apps__item:nth-child(even) {
    grid-template-columns:48px minmax(0,1fr) auto;
    gap:12px;
    padding:17px 0;
    border-left:0;
  }
  .premium-home .built-apps__item img { width:48px; height:48px; border-radius:13px; }
  .premium-home .built-apps__item-copy strong { font-size:14px; }
  .premium-home .built-apps__item-copy span { font-size:10px; }
  .premium-home .built-apps__item-cta { font-size:9px; }
}
@media(max-width:420px) {
  .premium-home .built-apps__media { height:292px; }
  .premium-home .built-apps__media img { height:256px; }
  .premium-home .built-apps__item { grid-template-columns:44px minmax(0,1fr); }
  .premium-home .built-apps__item img { width:44px; height:44px; }
  .premium-home .built-apps__item-cta { display:none; }
}
