:root{--navy:#061a3f;--navy-2:#09285d;--blue:#126be5;--cyan:#58d6ff;--ice:#eff7ff;--ink:#101828;--muted:#596579;--line:#dbe6f1;--white:#fff;--green:#1bbf78;--shadow:0 24px 70px rgba(4,23,56,.18)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:#fff;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:16px;line-height:1.6}img{display:block;max-width:100%}a{color:inherit;text-decoration:none}button{font:inherit}.container{width:min(1160px,calc(100% - 40px));margin-inline:auto}.skip-link{position:fixed;left:16px;top:-80px;background:#fff;color:#000;padding:10px 14px;z-index:1000}.skip-link:focus{top:16px}.nav-wrap{position:absolute;inset:0 0 auto;z-index:20;border-bottom:1px solid rgba(255,255,255,.13)}.nav{height:84px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:11px;color:white}.brand-mark{display:grid;place-items:center;width:34px;height:34px;border:2px solid currentColor;border-radius:10px;font-weight:900;transform:rotate(-7deg)}.brand>span:last-child{display:grid;line-height:1.08}.brand strong{font-size:1.06rem}.brand small{font-size:.72rem;opacity:.75;letter-spacing:.03em}.nav-links{display:flex;align-items:center;gap:28px;color:#dbe9ff;font-size:.92rem}.nav-links>a:not(.button):hover{color:#fff}.menu-button{display:none;background:transparent;border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:10px;padding:8px 12px}.button{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;font-weight:750;letter-spacing:-.01em;transition:.2s ease}.button:hover{transform:translateY(-2px)}.button-small{padding:10px 18px;background:#fff;color:var(--navy)}.button-primary{padding:15px 24px;background:#fff;color:var(--navy);box-shadow:0 10px 30px rgba(0,0,0,.14)}.button-light{padding:15px 24px;background:#fff;color:var(--navy)}.hero{position:relative;min-height:790px;padding:165px 0 105px;color:#fff;overflow:hidden;background:radial-gradient(circle at 75% 30%,rgba(24,122,230,.45),transparent 32%),linear-gradient(135deg,#051633 0%,#072456 60%,#0c448e 100%)}.hero:after{content:"";position:absolute;inset:auto -10% -310px;background:#fff;height:380px;transform:rotate(-4deg)}.hero-grid{display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:58px;position:relative;z-index:2}.eyebrow{display:flex;align-items:center;gap:10px;text-transform:uppercase;letter-spacing:.13em;font-size:.76rem;font-weight:800;color:#9edcff}.eyebrow span{width:28px;height:2px;background:currentColor}.eyebrow.dark{color:var(--blue)}.hero h1,.section-heading h2,.change-copy h2,.final-cta h2{margin:18px 0 22px;font-size:clamp(2.8rem,5vw,5.4rem);line-height:.98;letter-spacing:-.055em}.hero h1 em{font-family:Georgia,serif;font-weight:400;color:#85dfff}.hero-lede{font-size:1.13rem;line-height:1.7;color:#ccddf3;max-width:620px}.hero-actions{display:flex;align-items:center;gap:24px;margin:34px 0}.text-link{font-weight:700;color:#dbe9ff}.proof-list{display:flex;flex-wrap:wrap;gap:10px 20px;margin:34px 0 0;padding:0;list-style:none;color:#bcd1eb;font-size:.84rem}.proof-list li:before{content:"✓";color:#67e7b1;margin-right:7px}.hero-visual{position:relative;min-width:0}.visual-glow{position:absolute;width:85%;aspect-ratio:1;inset:0 0 auto 12%;background:#1d8cff;filter:blur(70px);opacity:.24}.browser-frame{position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.24);border-radius:20px;background:#f8fbff;box-shadow:0 40px 110px rgba(0,8,27,.5);transform:rotate(1.4deg)}.browser-bar{height:42px;padding:0 16px;display:flex;align-items:center;gap:7px;color:#58708f;background:#fff;border-bottom:1px solid #e1e8f0;font-size:.72rem}.browser-bar i{width:8px;height:8px;border-radius:50%;background:#d9e1ea}.browser-bar span{margin-left:9px}.hero-crop{height:435px;overflow:hidden}.hero-crop img{height:100%;width:100%;object-fit:cover;object-position:69% center;transform:scale(1.15)}.floating-card{position:absolute;z-index:3;display:grid;background:rgba(255,255,255,.96);color:var(--ink);border-radius:14px;padding:13px 16px;box-shadow:0 16px 46px rgba(3,22,55,.28);min-width:160px}.floating-card small{font-size:.62rem;letter-spacing:.1em;color:#6f8096}.floating-card strong{font-size:1rem}.floating-card span{font-size:.72rem;color:var(--green)}.card-ready{right:-18px;top:-34px}.card-team{left:-36px;bottom:-35px}.problem-band{position:relative;z-index:3;padding:60px 0 85px;background:#fff}.problem-grid{display:grid;grid-template-columns:.6fr 1.4fr 1fr;gap:48px;align-items:start}.kicker{text-transform:uppercase;letter-spacing:.12em;color:var(--blue);font-size:.75rem;font-weight:800}.problem-grid h2{font-size:2rem;line-height:1.15;letter-spacing:-.035em;margin:0}.problem-grid>p:last-child{margin:0;color:var(--muted)}.section{padding:115px 0}.platform{background:linear-gradient(#f7fbff,#eef6ff)}.section-heading{max-width:820px;margin-bottom:54px}.section-heading.center{text-align:center;margin-inline:auto}.section-heading.center .eyebrow{justify-content:center}.section-heading h2{font-size:clamp(2.3rem,4.2vw,4rem);color:var(--navy);margin-bottom:18px}.section-heading>p:last-child{color:var(--muted);font-size:1.08rem}.feature-tabs{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-bottom:26px}.feature-tabs button{border:1px solid #cad9e7;background:rgba(255,255,255,.75);color:#476078;border-radius:999px;padding:10px 17px;cursor:pointer;font-weight:700;font-size:.88rem}.feature-tabs button[aria-selected="true"]{background:var(--navy);border-color:var(--navy);color:#fff}.tab-panel{display:grid;grid-template-columns:.82fr 1.18fr;gap:48px;align-items:center;background:#fff;border:1px solid #d8e6f2;border-radius:28px;padding:50px;box-shadow:0 25px 70px rgba(28,70,115,.1)}.panel-copy .number{color:var(--blue);font-size:.75rem;font-weight:800;letter-spacing:.14em}.panel-copy h3{margin:6px 0 18px;font-size:2rem;line-height:1.12;letter-spacing:-.035em;color:var(--navy)}.panel-copy>p{color:var(--muted)}.panel-copy ul{padding:0;list-style:none;margin:22px 0 0}.panel-copy li{margin:9px 0}.panel-copy li:before{content:"✓";display:inline-grid;place-items:center;width:22px;height:22px;margin-right:9px;border-radius:50%;color:#07794b;background:#dbfaec;font-weight:900}.panel-media{height:410px;overflow:hidden;border-radius:18px;border:1px solid #dfe8f2;background:#f5f9fd}.panel-media img{width:100%;height:100%;object-fit:cover;object-position:75% center;transform:scale(1.08)}.split-heading{display:grid;grid-template-columns:1.45fr .65fr;align-items:end;gap:60px;max-width:none}.workflow-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}.workflow-list li{display:grid;grid-template-columns:70px 1fr auto;gap:20px;align-items:center;padding:25px 8px;border-bottom:1px solid var(--line);transition:.2s}.workflow-list li:hover{padding-left:20px;background:#f6faff}.workflow-list li>span{font-weight:800;color:var(--blue);font-size:.76rem}.workflow-list strong{font-size:1.12rem;color:var(--navy)}.workflow-list p{margin:2px 0 0;color:var(--muted)}.workflow-list li:after{content:"→";font-size:1.4rem;color:#9aabbd}.change-section{overflow:hidden;color:#fff;background:linear-gradient(135deg,#071a3d,#0c4ca2)}.change-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:center}.change-visual{height:510px;overflow:hidden;border-radius:24px;border:1px solid rgba(255,255,255,.18);box-shadow:var(--shadow)}.change-visual img{height:100%;width:100%;object-fit:cover;object-position:75% center;transform:scale(1.12)}.change-copy h2{font-size:clamp(2.7rem,5vw,4.6rem)}.change-copy>p{color:#cbddf4}.sync-stack{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}.sync-stack span{padding:9px 13px;border:1px solid rgba(255,255,255,.25);border-radius:999px;background:rgba(255,255,255,.08);font-size:.83rem}.difference-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.difference-grid article{padding:34px;border:1px solid var(--line);border-radius:22px;background:#fff}.difference-grid .icon{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:var(--ice);color:var(--blue);font-size:1.35rem}.difference-grid h3{margin:24px 0 10px;color:var(--navy);font-size:1.3rem}.difference-grid p{color:var(--muted);margin:0}.final-cta{padding:110px 0;color:#fff;background:linear-gradient(125deg,#0c62d2,#063c8a);text-align:center}.cta-inner{display:grid;justify-items:center}.cta-inner .eyebrow{justify-content:center}.final-cta h2{font-size:clamp(3rem,6vw,5.5rem);margin-bottom:12px}.final-cta p{color:#d4e7ff;font-size:1.1rem}.final-cta .button{margin-top:20px}footer{padding:38px 0;background:#04132f;color:#b7c8df}.footer-grid{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;font-size:.85rem}.footer-grid>p{text-align:center}.footer-grid>a:last-child{text-align:right;color:#fff}.footer-brand{justify-self:start}
@media(width < 900px){.nav-links{position:absolute;left:20px;right:20px;top:74px;display:none;flex-direction:column;align-items:stretch;gap:0;padding:14px;border-radius:16px;background:#fff;color:var(--navy);box-shadow:var(--shadow)}.nav-links.open{display:flex}.nav-links a{padding:10px 12px}.menu-button{display:block}.hero{padding-top:140px}.hero-grid,.problem-grid,.tab-panel,.change-grid,.split-heading{grid-template-columns:1fr}.hero-grid{gap:85px}.problem-grid{gap:18px}.problem-band{padding-bottom:60px}.tab-panel{padding:28px}.change-grid{gap:40px}.difference-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr;text-align:center}.footer-brand{justify-self:center}.footer-grid>p,.footer-grid>a:last-child{text-align:center}.card-ready{right:8px}.card-team{left:8px}}
@media(width < 600px){.container{width:min(100% - 28px,1160px)}.nav{height:72px}.hero{min-height:auto;padding:125px 0 95px}.hero h1{font-size:2.8rem}.hero-actions{align-items:flex-start;flex-direction:column}.proof-list{display:grid}.hero-crop{height:315px}.floating-card{min-width:138px;padding:10px 12px}.section{padding:80px 0}.section-heading h2{font-size:2.45rem}.feature-tabs{justify-content:flex-start;flex-wrap:nowrap;overflow:auto;padding-bottom:8px}.feature-tabs button{white-space:nowrap}.tab-panel{padding:20px;border-radius:20px}.panel-media{height:290px}.panel-copy h3{font-size:1.7rem}.change-visual{height:350px}.workflow-list li{grid-template-columns:44px 1fr}.workflow-list li:after{display:none}.problem-grid h2{font-size:1.7rem}.final-cta{padding:80px 0}.final-cta h2{font-size:3rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button,.workflow-list li{transition:none}}

/* Version 2: human bridal context paired with a visible product interface. */
.hero-visual{padding-bottom:88px}
.photo-frame{position:relative;height:480px;overflow:hidden;border:1px solid rgba(255,255,255,.25);border-radius:28px;box-shadow:0 40px 110px rgba(0,8,27,.5);transform:rotate(1.2deg)}
.photo-frame>img{width:100%;height:100%;object-fit:cover;object-position:56% center}
.photo-shade{position:absolute;inset:0;background:linear-gradient(180deg,transparent 52%,rgba(2,14,35,.62) 100%)}
.photo-caption{position:absolute;left:28px;bottom:25px;display:grid}
.photo-caption span{color:#bfe7ff;font-size:.7rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.photo-caption strong{font-family:Georgia,serif;font-size:1.35rem;font-weight:400}
.product-peek{position:absolute;z-index:2;right:-18px;bottom:0;width:71%;overflow:hidden;border:1px solid #dbe7f3;border-radius:16px;background:#f8fbff;box-shadow:0 22px 60px rgba(0,8,27,.4);transform:rotate(-1.5deg)}
.product-peek .browser-bar{height:38px;padding:0 14px;font-size:.68rem}
.product-peek .browser-bar i{width:7px;height:7px}
.product-peek .hero-crop{height:190px}
.product-peek .hero-crop img{object-position:72% center;transform:scale(1.17)}
.card-ready{top:-32px}
.card-team{bottom:42px}

@media(width < 900px){.hero-grid{gap:72px}.hero-visual{max-width:700px;width:100%;margin-inline:auto}.card-team{bottom:42px}}
@media(width < 600px){.hero-visual{padding-bottom:72px}.photo-frame{height:390px;border-radius:20px}.photo-frame>img{object-position:58% center}.photo-caption{left:18px;bottom:18px}.product-peek{width:80%;right:0}.product-peek .hero-crop{height:155px}.card-ready{top:-24px}.card-team{bottom:34px}}

/* Version 3: immersive hero image with operational software overlays. */
.hero{min-height:850px;background:linear-gradient(90deg,rgba(3,15,38,.97) 0%,rgba(4,22,52,.91) 34%,rgba(4,24,55,.45) 62%,rgba(4,22,50,.2) 100%),linear-gradient(180deg,rgba(4,18,43,.18) 54%,rgba(4,18,43,.7) 100%),url("assets/bridal-beauty-hero.png") 56% center/cover no-repeat}
.hero-grid{grid-template-columns:.88fr 1.12fr;min-height:575px}
.hero-copy{position:relative;z-index:4;padding:22px 0}
.hero-lede{color:#e0eafa;text-shadow:0 1px 18px rgba(0,0,0,.35)}
.hero-visual{height:560px;padding:0;isolation:isolate}
.hero-visual:before{content:"";position:absolute;right:-8%;bottom:1%;width:88%;height:68%;border-radius:50%;background:rgba(22,107,229,.2);filter:blur(60px);z-index:-1}
.ops-label{position:absolute;top:64px;right:20px;display:flex;align-items:center;gap:8px;color:#eaf5ff;font-size:.68rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;text-shadow:0 2px 14px rgba(0,0,0,.6)}
.ops-label span{width:7px;height:7px;border-radius:50%;background:#4ce3a0;box-shadow:0 0 0 5px rgba(76,227,160,.18)}
.schedule-window{position:absolute;z-index:2;right:-20px;bottom:42px;width:78%;overflow:hidden;border:1px solid rgba(255,255,255,.52);border-radius:18px;background:#f8fbff;box-shadow:0 28px 80px rgba(0,8,27,.52);transform:perspective(1000px) rotateY(-2deg) rotateZ(-.7deg)}
.schedule-window .browser-bar{height:38px;padding:0 14px;font-size:.68rem}
.schedule-window .hero-crop{height:230px}
.schedule-window .hero-crop img{object-position:71% center;transform:scale(1.15)}
.hero-visual .floating-card{border:1px solid rgba(255,255,255,.65);background:rgba(255,255,255,.91);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.hero-visual .card-ready{right:-4px;top:95px}
.hero-visual .card-team{left:20px;bottom:112px}
.card-services{left:0;top:182px}
.sync-pill{position:absolute;z-index:4;right:56px;bottom:14px;display:flex;align-items:center;gap:10px;min-width:220px;padding:11px 14px;border:1px solid rgba(255,255,255,.58);border-radius:14px;background:rgba(7,28,64,.86);box-shadow:0 16px 44px rgba(0,8,27,.38);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.sync-pill>b{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#3bd28c;color:#062a1d}
.sync-pill>span{display:grid;line-height:1.22}.sync-pill strong{font-size:.78rem}.sync-pill small{font-size:.65rem;color:#bcd1e9}

@media(width < 900px){.hero{min-height:auto;background-position:62% center}.hero-grid{min-height:0}.hero-copy{max-width:680px}.hero-visual{height:520px;max-width:760px}.schedule-window{right:0;width:72%}.hero-visual .card-ready{right:8px}.hero-visual .card-team{left:30px}.card-services{left:4px}}
@media(width < 600px){.hero{padding-bottom:72px;background-position:61% center}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,15,38,.2) 0%,rgba(3,15,38,.22) 38%,rgba(3,15,38,.8) 100%)}.hero-grid{position:relative}.hero-visual{height:440px;padding:0}.ops-label{top:18px;right:8px}.schedule-window{right:0;bottom:44px;width:88%}.schedule-window .hero-crop{height:178px}.hero-visual .card-ready{top:64px;right:0}.hero-visual .card-team{left:0;bottom:88px}.card-services{display:none}.sync-pill{right:12px;bottom:8px;min-width:205px}.hero-copy{padding-top:0}}

/* Version 4: bridal editorial refinement without losing operational clarity. */
:root{--ivory:#fbf8f2;--ivory-deep:#f4eee4;--champagne:#c6a878;--forest:#173f3b}
.nav-wrap{top:18px;left:0;right:0;border:0}
.nav{height:66px;padding:0 18px;border:1px solid rgba(255,255,255,.2);border-radius:999px;background:rgba(4,17,42,.72);box-shadow:0 18px 50px rgba(0,8,27,.22);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.brand-mark{border-radius:9px}
.brand small{letter-spacing:.08em}
.nav-links{gap:25px}
.button-small{padding:9px 18px;border:1px solid rgba(198,168,120,.45);background:rgba(255,255,255,.96)}
.hero{padding-bottom:96px}
.hero:after{display:none}
.hero h1 em,.platform-intro h2 em{font-family:Baskerville,"Iowan Old Style","Palatino Linotype",Georgia,serif;font-weight:400}
.hero h1 em{color:#d9edff}
.eyebrow{font-size:.72rem;letter-spacing:.17em}
.eyebrow span,.kicker:before{background:var(--champagne)}
.hero-visual .floating-card{border-color:rgba(255,255,255,.52);border-radius:13px;box-shadow:0 18px 50px rgba(0,8,27,.3)}
.schedule-window{border-color:rgba(255,255,255,.48);border-radius:16px;box-shadow:0 24px 68px rgba(0,8,27,.43)}
.sync-pill{border-color:rgba(198,168,120,.38);border-radius:13px;box-shadow:0 14px 38px rgba(0,8,27,.3)}
.problem-band{padding:104px 0 92px;background:var(--ivory)}
.platform-intro{max-width:900px;margin:0 auto 78px;text-align:center}
.platform-intro .eyebrow{justify-content:center;color:#8a6f49}
.platform-intro h2{margin:15px 0 20px;color:#0b2c38;font-size:clamp(2.7rem,5vw,4.8rem);line-height:1.02;letter-spacing:-.045em}
.platform-intro h2 em{display:block;color:var(--forest);font-style:italic;letter-spacing:-.035em}
.platform-intro>p:last-child{max-width:650px;margin-inline:auto;color:#67706f;font-size:1.08rem}
.problem-grid{padding-top:42px;border-top:1px solid #ded3c2}
.kicker{display:flex;align-items:center;gap:10px;color:#8a6f49;letter-spacing:.16em}
.kicker:before{content:"";width:28px;height:1px}
.problem-grid h3{font-family:Baskerville,"Iowan Old Style","Palatino Linotype",Georgia,serif;font-size:2.15rem;font-weight:400;line-height:1.15;letter-spacing:-.025em;margin:0;color:#123b42}
.platform{background:linear-gradient(180deg,var(--ivory) 0%,#eef6ff 30%,#eef6ff 100%)}
.section-heading h2{letter-spacing:-.045em}
.section-heading h2 br+*{font-family:Baskerville,"Iowan Old Style","Palatino Linotype",Georgia,serif}
.feature-tabs button{border-color:#cfdcd9;background:rgba(255,255,255,.82)}
.tab-panel{border-color:#d8e4df;border-radius:24px;box-shadow:0 22px 60px rgba(24,58,65,.09)}
.panel-media{border-radius:15px}

@media(width < 900px){.nav-wrap{top:10px}.nav{height:64px;border-radius:22px}.nav-links{top:72px}.platform-intro{margin-bottom:58px}.problem-grid h3{font-size:1.95rem}}
@media(width < 600px){.nav{padding:0 13px}.hero{padding-top:112px;padding-bottom:70px}.problem-band{padding:78px 0 70px}.platform-intro{margin-bottom:48px}.platform-intro h2{font-size:2.7rem}.problem-grid{padding-top:34px}.problem-grid h3{font-size:1.8rem}}

/* Version 5: unified Beauty Teams design system. */
:root{
  --navy:#071b3e;--navy-soft:#0b2b54;--blue:#176bd9;--blue-light:#edf5fc;
  --ivory:#fbf8f2;--ivory-deep:#f3ede3;--champagne:#bf9e6d;--forest:#173f3b;
  --ink:#14212c;--muted:#637077;--line:#d9e2e4;--green:#1c9b68;
  --radius-card:20px;--radius-product:16px;
  --shadow-soft:0 18px 55px rgba(23,52,61,.09);
  --shadow-product:0 28px 75px rgba(4,24,49,.18)
}

body{font-family:Manrope,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:500;letter-spacing:-.012em;background:var(--ivory)}
h1,h2,h3,strong{font-weight:700}
.hero h1 em,.platform-intro h2 em,.problem-grid h3{font-family:"Instrument Serif",Baskerville,Georgia,serif;font-weight:400}
.hero h1{max-width:760px;letter-spacing:-.052em}
.hero h1 em{color:#f7eee0;font-style:italic}
.eyebrow{letter-spacing:.18em;font-weight:800}
.eyebrow span{height:1px}
.nav{max-width:1180px}
.brand strong{letter-spacing:-.025em}.brand small{font-weight:600}
.nav-links{font-weight:650}.nav-links>a:not(.button){position:relative}
.nav-links>a:not(.button):after{content:"";position:absolute;left:0;right:100%;bottom:-5px;height:1px;background:var(--champagne);transition:right .22s ease}
.nav-links>a:not(.button):hover:after{right:0}
.button{min-height:48px;padding:13px 22px;border:1px solid transparent;box-shadow:none;transition:transform .2s ease,box-shadow .2s ease,background .2s ease}
.button:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(5,27,62,.17)}
.button-small{min-height:42px;padding:9px 17px;font-size:.82rem}
.button-primary,.button-light{background:#fff;color:var(--navy);border-color:rgba(191,158,109,.5)}
.hero{min-height:850px;padding-top:168px;background:linear-gradient(90deg,rgba(3,15,38,.98) 0%,rgba(4,22,52,.91) 36%,rgba(4,24,55,.43) 63%,rgba(4,22,50,.19) 100%),linear-gradient(180deg,rgba(4,18,43,.1) 48%,rgba(4,18,43,.74) 100%),url("assets/bridal-beauty-hero.png") 56% center/cover no-repeat}
.hero-lede{max-width:590px;font-weight:500}
.proof-list{font-weight:600}.proof-list li:before{color:#e5c792}
.schedule-window,.panel-media,.change-visual{border-radius:var(--radius-product);box-shadow:var(--shadow-product)}
.schedule-window{transform:none}
.hero-visual .floating-card{border-radius:14px;box-shadow:0 18px 48px rgba(3,22,55,.25)}
.floating-card small{font-weight:800}.floating-card strong{color:var(--navy)}
.platform-intro h2{letter-spacing:-.04em}.platform-intro h2 em{color:var(--forest)}
.problem-band{background:var(--ivory)}
.problem-grid{grid-template-columns:.58fr 1.42fr 1fr}
.platform{background:linear-gradient(180deg,var(--ivory) 0%,var(--blue-light) 27%,#f4f8fb 100%)}
.section{padding:124px 0}
.section-heading{margin-bottom:58px}.section-heading h2{line-height:1.03}
.feature-tabs{gap:10px;margin-bottom:28px}.feature-tabs button{padding:11px 18px;font-weight:700;transition:all .2s ease}
.feature-tabs button:hover{border-color:#9db5c4;color:var(--navy)}
.feature-tabs button[aria-selected="true"]{background:var(--navy);box-shadow:0 9px 22px rgba(7,27,62,.16)}
.tab-panel{border-radius:var(--radius-card);border-color:#d6e1e4;box-shadow:var(--shadow-soft)}
.tab-panel.active{animation:panel-in .42s ease both}
.panel-media{box-shadow:0 16px 42px rgba(19,53,76,.12)}
.workflow{position:relative;overflow:hidden;background:#fff}
.workflow:before{content:"";position:absolute;left:calc(50% - 580px);top:245px;width:1px;height:460px;background:linear-gradient(var(--champagne),rgba(191,158,109,0));opacity:.45}
.workflow-list{margin-left:34px;border-color:#dce4e3}
.workflow-list li{position:relative;padding:28px 12px;border-color:#dce4e3}
.workflow-list li:before{content:"";position:absolute;left:-39px;width:9px;height:9px;border:2px solid var(--champagne);border-radius:50%;background:#fff}
.workflow-list li:hover{padding-left:22px;background:var(--ivory)}
.change-section{background:linear-gradient(132deg,#061933,#0b315a 65%,#124b70)}
.change-visual{border-color:rgba(255,255,255,.22)}
.sync-stack span{border-color:rgba(229,199,146,.35);background:rgba(255,255,255,.07)}
.difference{background:var(--ivory)}
.difference-grid{gap:22px}.difference-grid article{border-color:#e2dace;border-radius:var(--radius-card);box-shadow:0 12px 35px rgba(55,45,31,.045);transition:transform .22s ease,box-shadow .22s ease}
.difference-grid article:hover{transform:translateY(-4px);box-shadow:var(--shadow-soft)}
.difference-grid .icon{background:#edf3f1;color:var(--forest)}
.final-cta{background:linear-gradient(125deg,#0b315c,#0b4e8e);position:relative;overflow:hidden}
.final-cta:before{content:"";position:absolute;width:500px;height:500px;border:1px solid rgba(229,199,146,.18);border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%)}
.cta-inner{position:relative}.final-cta h2{font-family:"Instrument Serif",Baskerville,Georgia,serif;font-weight:400;letter-spacing:-.035em}
footer{background:#04132c}
.js .section,.js .problem-band,.js .final-cta{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
.js .section.is-visible,.js .problem-band.is-visible,.js .final-cta.is-visible{opacity:1;transform:none}
.hero-copy{animation:hero-in .75s ease .08s both}.schedule-window{animation:hero-in .8s ease .22s both}.hero-visual .floating-card,.sync-pill{animation:card-in .6s ease both}.card-ready{animation-delay:.38s!important}.card-team{animation-delay:.47s!important}.card-services{animation-delay:.55s!important}.sync-pill{animation-delay:.64s!important}
@keyframes hero-in{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@keyframes card-in{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes panel-in{from{opacity:.55;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(width < 900px){.section{padding:100px 0}.workflow:before{left:20px}.workflow-list{margin-left:20px}.workflow-list li:before{left:-25px}.nav-links>a:not(.button):after{display:none}}
@media(width < 600px){.hero{padding-top:118px}.section{padding:82px 0}.nav-links .button-small{margin-top:5px}.problem-grid{grid-template-columns:1fr}.tab-panel{padding:20px}.workflow:before{left:14px}.workflow-list{margin-left:14px}.workflow-list li:before{left:-19px}.hero-visual .card-team{display:none}.sync-pill{right:4px}.difference-grid{gap:14px}}
@media(prefers-reduced-motion:reduce){.hero-copy,.schedule-window,.hero-visual .floating-card,.sync-pill,.tab-panel.active{animation:none}.js .section,.js .problem-band,.js .final-cta{opacity:1;transform:none;transition:none}.button,.difference-grid article,.nav-links>a:not(.button):after{transition:none}}

/* Version 14 — signature platform showcase */
.platform .section-heading{max-width:850px;margin-bottom:64px}
.platform-showcase{display:grid;grid-template-columns:300px minmax(0,1fr);gap:22px;align-items:stretch}
.platform-showcase .feature-tabs{display:grid;align-content:start;gap:8px;margin:0;padding:10px;border:1px solid #d8e3e2;border-radius:22px;background:rgba(255,255,255,.64);box-shadow:0 18px 50px rgba(25,57,73,.055)}
.platform-showcase .feature-tabs button{width:100%;min-height:92px;display:grid;grid-template-columns:38px 1fr;align-items:start;gap:8px;padding:18px 16px;text-align:left;border:1px solid transparent;border-radius:15px;background:transparent;color:#52656d;box-shadow:none}
.platform-showcase .feature-tabs button:hover{border-color:#d2dfdf;background:rgba(255,255,255,.74);color:var(--navy)}
.platform-showcase .feature-tabs button[aria-selected="true"]{border-color:var(--navy);background:var(--navy);color:#fff;box-shadow:0 15px 34px rgba(7,27,62,.17)}
.tab-number{padding-top:2px;font-size:.7rem;font-weight:800;letter-spacing:.13em;color:#8ca0a5}
.feature-tabs button[aria-selected="true"] .tab-number{color:#e5c792}
.tab-label{display:grid;font-size:.94rem;line-height:1.25;font-weight:800}
.tab-label small{margin-top:7px;color:#7b8c91;font-size:.73rem;line-height:1.35;font-weight:550}
.feature-tabs button[aria-selected="true"] .tab-label small{color:#b9c9d8}
.platform-showcase .tab-panels{min-width:0}
.platform-showcase .tab-panel{min-height:394px;grid-template-columns:.78fr 1.22fr;gap:34px;padding:38px;border:1px solid #d6e2e2;border-radius:22px;background:rgba(255,255,255,.94);box-shadow:0 26px 70px rgba(18,50,69,.1);overflow:hidden}
.platform-showcase .panel-copy{align-self:center}
.panel-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:23px;color:#6e8188;font-size:.68rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase}
.panel-meta strong{padding:7px 10px;border:1px solid #d8e2dd;border-radius:999px;background:#f5f8f6;color:var(--forest);font-size:.66rem;white-space:nowrap}
.platform-showcase .panel-copy h3{margin:0 0 17px;font-family:"Instrument Serif",Baskerville,Georgia,serif;font-size:clamp(2rem,2.8vw,3rem);line-height:1.02;font-weight:400;letter-spacing:-.035em;color:var(--navy)}
.platform-showcase .panel-copy>p{margin:0;color:#65757a;line-height:1.7}
.panel-outcomes{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.panel-outcomes span{padding:7px 10px;border:1px solid #d8e4df;border-radius:999px;background:#f7faf8;color:#47645d;font-size:.72rem;font-weight:750}
.panel-outcomes span:before{content:"✓";margin-right:6px;color:#1a9d6d}
.platform-showcase .panel-media{position:relative;height:390px;display:grid;place-items:center;overflow:hidden;border:1px solid #d9e5e8;border-radius:17px;background:radial-gradient(circle at 78% 16%,rgba(54,147,237,.22),transparent 36%),linear-gradient(145deg,#eef7ff,#f7fbff 50%,#e9f2f5);box-shadow:0 18px 45px rgba(19,53,76,.13)}
.platform-showcase .panel-media:before{content:"";position:absolute;inset:18px;border:1px solid rgba(58,111,148,.11);border-radius:13px;pointer-events:none}
.platform-showcase .panel-media img{width:auto;height:91%;max-width:91%;object-fit:contain;border-radius:10px;box-shadow:0 15px 34px rgba(22,60,84,.13)}
.platform-showcase .quote-media img{width:92%;height:auto;max-height:91%}
.media-caption{position:absolute;left:22px;bottom:20px;display:grid;padding:10px 13px;border:1px solid rgba(255,255,255,.8);border-radius:11px;background:rgba(255,255,255,.92);box-shadow:0 12px 28px rgba(15,47,69,.14);backdrop-filter:blur(8px)}
.media-caption strong{font-size:.75rem;color:var(--navy)}
.media-caption span{font-size:.66rem;color:#708087}
@media(width < 900px){.platform-showcase{grid-template-columns:1fr}.platform-showcase .feature-tabs{display:flex;overflow-x:auto;padding:8px}.platform-showcase .feature-tabs button{min-width:220px;min-height:82px}.platform-showcase .tab-panel{grid-template-columns:1fr;gap:30px}.platform-showcase .panel-media{height:430px}}
@media(width < 600px){.platform .section-heading{margin-bottom:42px}.platform-showcase{gap:16px}.platform-showcase .feature-tabs button{min-width:205px;padding:15px 13px}.platform-showcase .tab-panel{padding:22px}.platform-showcase .panel-copy h3{font-size:2.15rem}.panel-meta{align-items:flex-start;flex-direction:column}.platform-showcase .panel-media{height:330px}.media-caption{left:14px;bottom:14px}.panel-outcomes{gap:6px}}

/* Version 6: official CleverOne identity. */
.brand{gap:10px;min-width:0}
.brand-logo{display:block;width:142px;height:auto;flex:none}
.brand>small{padding-left:10px;border-left:1px solid rgba(255,255,255,.28);font-size:.68rem;font-weight:700;line-height:1.2;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;color:rgba(255,255,255,.78)}
.footer-brand .brand-logo{width:136px}
.footer-brand>small{color:#b7c8df}
@media(width < 600px){.brand-logo{width:120px}.brand>small{font-size:.58rem;padding-left:8px}.footer-brand .brand-logo{width:128px}}

/* Version 7: Beauty Teams operational complexity story. */
.problem-story{display:grid;grid-template-columns:.76fr 1.24fr;gap:78px;align-items:center;padding-top:48px;border-top:1px solid #ded3c2}
.problem-copy{max-width:440px}
.problem-copy .kicker{margin:0 0 24px}
.problem-copy h3{margin:0;color:#123b42;font-family:"Instrument Serif",Baskerville,Georgia,serif;font-size:clamp(2.35rem,3.5vw,3.55rem);font-weight:400;line-height:1.02;letter-spacing:-.035em}
.problem-copy>p:not(.kicker){margin:24px 0 0;color:#65706f;font-size:1rem;line-height:1.72}
.problem-copy .editorial-note{padding-top:20px;border-top:1px solid #e4dacc;color:#274846!important}
.problem-copy .editorial-note em{display:block;margin-top:2px;color:var(--forest);font-family:"Instrument Serif",Baskerville,Georgia,serif;font-size:1.55rem;line-height:1.2}
.wedding-map{position:relative;min-height:510px;border:1px solid #ded6c9;border-radius:28px;background:radial-gradient(circle at 50% 47%,rgba(213,235,232,.72),transparent 31%),linear-gradient(145deg,rgba(255,255,255,.82),rgba(247,242,233,.9));box-shadow:0 24px 70px rgba(65,54,37,.08);overflow:hidden}
.wedding-map:before{content:"";position:absolute;inset:22px;border:1px solid rgba(191,158,109,.2);border-radius:20px;pointer-events:none}
.wedding-node{position:absolute;z-index:2;display:grid;width:205px;padding:16px 17px;border:1px solid rgba(27,72,72,.14);border-radius:15px;background:rgba(255,255,255,.9);box-shadow:0 13px 34px rgba(35,63,61,.09);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.wedding-node small,.change-flag small{color:#927449;font-size:.62rem;font-weight:800;letter-spacing:.15em}
.wedding-node strong{margin:3px 0 2px;color:#143d42;font-size:.91rem;line-height:1.3}
.wedding-node span{color:#77817f;font-size:.68rem;line-height:1.4}
.node-artists{left:38px;top:42px}.node-people{right:35px;top:58px}.node-services{left:35px;bottom:74px}.node-details{right:39px;bottom:58px}
.wedding-center{position:absolute;z-index:3;left:50%;top:48%;display:grid;place-items:center;width:190px;height:190px;padding:24px;border:1px solid rgba(191,158,109,.52);border-radius:50%;background:linear-gradient(145deg,#153f43,#0a2b3d);box-shadow:0 20px 55px rgba(8,42,48,.25),0 0 0 10px rgba(255,255,255,.7);color:#fff;text-align:center;transform:translate(-50%,-50%)}
.wedding-center span{color:#e1c18f;font-size:.61rem;font-weight:800;letter-spacing:.17em}
.wedding-center strong{font-family:"Instrument Serif",Baskerville,Georgia,serif;font-size:2rem;font-weight:400;line-height:.95}
.wedding-center small{max-width:118px;color:#c8d9d7;font-size:.65rem;line-height:1.35}
.thread{position:absolute;z-index:1;width:170px;height:1px;background:linear-gradient(90deg,rgba(191,158,109,.78),rgba(23,63,59,.3));transform-origin:left center}
.thread:after{content:"";position:absolute;right:-3px;top:-3px;width:7px;height:7px;border-radius:50%;background:var(--champagne);box-shadow:0 0 0 4px rgba(191,158,109,.14)}
.thread-a{left:202px;top:135px;transform:rotate(22deg)}.thread-b{right:181px;top:149px;transform:rotate(155deg)}.thread-c{left:204px;bottom:139px;transform:rotate(-24deg)}.thread-d{right:187px;bottom:129px;transform:rotate(203deg)}
.change-flag{position:absolute;z-index:4;left:50%;bottom:20px;display:flex;align-items:center;gap:10px;min-width:280px;padding:10px 15px;border:1px solid #d7c39f;border-radius:999px;background:#fffaf2;box-shadow:0 10px 28px rgba(82,61,28,.1);transform:translateX(-50%)}
.change-flag>span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#f2e6d1;color:#806237;font-weight:800}
.change-flag>div{display:grid;line-height:1.22}.change-flag strong{color:#34524f;font-size:.73rem}
@media(width < 1200px){.problem-story{grid-template-columns:1fr;gap:46px}.problem-copy{max-width:710px}.wedding-map{min-height:500px}}
@media(width < 600px){.problem-story{padding-top:34px;gap:34px}.problem-copy h3{font-size:2.35rem}.wedding-map{min-height:600px;border-radius:22px}.wedding-map:before{inset:14px}.wedding-node{width:calc(50% - 28px);padding:13px 12px}.node-artists{left:16px;top:24px}.node-people{right:16px;top:24px}.node-services{left:16px;bottom:92px}.node-details{right:16px;bottom:92px}.wedding-center{top:49%;width:170px;height:170px}.thread{display:none}.change-flag{bottom:24px;min-width:0;width:calc(100% - 32px);border-radius:16px}.wedding-node strong{font-size:.78rem}.wedding-node span{font-size:.62rem}}

/* Version 8: immersive full-viewport desktop hero. */
@media(width >= 900px){
  .hero{display:flex;align-items:center;min-height:100vh;min-height:100svh}
  .hero-grid{width:min(1160px,calc(100% - 40px))}
}
@media(width < 900px){.hero{display:block;min-height:auto}}

/* Version 9: desktop motion-hero test with static and reduced-motion fallbacks. */
.hero-video{display:none}
@media(width >= 900px){
  .hero-video{position:absolute;inset:0;z-index:0;display:block;width:100%;height:100%;object-fit:cover;object-position:56% center}
  .hero:before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(3,15,38,.98) 0%,rgba(4,22,52,.91) 36%,rgba(4,24,55,.43) 63%,rgba(4,22,50,.19) 100%),linear-gradient(180deg,rgba(4,18,43,.1) 48%,rgba(4,18,43,.74) 100%);pointer-events:none}
  .hero-grid{z-index:2}
}
@media(prefers-reduced-motion:reduce){.hero-video{display:none}}

/* Version 15: full-width sticky header with transparent hero state. */
.nav-wrap{
  position:fixed;
  inset:0 0 auto;
  top:0;
  z-index:100;
  border-bottom:1px solid transparent;
  background:transparent;
  transition:background-color .28s ease,border-color .28s ease,box-shadow .28s ease;
}
.nav{
  height:84px;
  max-width:1180px;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  transition:height .28s ease;
}
.header-logo-stack{position:relative;display:block;width:142px}
.header-logo-stack .brand-logo{transition:opacity .22s ease}
.header-logo-dark{position:absolute;inset:0 auto auto 0;opacity:0}
.nav-wrap.is-scrolled{
  border-bottom-color:rgba(7,27,62,.1);
  background:rgba(251,248,242,.96);
  box-shadow:0 10px 34px rgba(5,24,51,.09);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.nav-wrap.is-scrolled .nav{height:72px}
.nav-wrap.is-scrolled .header-logo-light{opacity:0}
.nav-wrap.is-scrolled .header-logo-dark{opacity:1}
.nav-wrap.is-scrolled .brand>small{color:#52616f;border-left-color:rgba(7,27,62,.18)}
.nav-wrap.is-scrolled .nav-links{color:var(--navy)}
.nav-wrap.is-scrolled .nav-links>a:not(.button):hover{color:var(--blue)}
.nav-wrap.is-scrolled .button-small{background:var(--navy);color:#fff}
.nav-wrap.is-scrolled .menu-button{border-color:rgba(7,27,62,.22);color:var(--navy)}
@media(width < 900px){
  .nav-wrap{top:0}
  .nav{height:74px;padding:0}
  .nav-wrap.is-scrolled .nav{height:68px}
  .nav-links{top:calc(100% + 8px)}
}
@media(width < 600px){
  .header-logo-stack{width:120px}
  .nav{padding:0}
}

@media(prefers-reduced-motion:reduce){
  .nav-wrap,.nav,.header-logo-stack .brand-logo{transition:none}
}

/* Version 16: cooler Fresha-inspired glass header refinement. */
.nav-wrap{
  border-bottom-color:rgba(255,255,255,.13);
  background:rgba(4,20,48,.32);
  box-shadow:0 8px 30px rgba(2,13,34,.08);
  backdrop-filter:blur(18px) saturate(135%);
  -webkit-backdrop-filter:blur(18px) saturate(135%);
  transition:background-color .28s ease,border-color .28s ease,box-shadow .28s ease,backdrop-filter .28s ease;
}
.nav-links{
  gap:30px;
  font-size:.94rem;
  font-weight:600;
  letter-spacing:-.01em;
}
.button-small{
  min-height:40px;
  padding:8px 18px;
  font-size:.88rem;
  font-weight:700;
}
.nav-wrap.is-scrolled{
  border-bottom-color:rgba(29,86,144,.14);
  background:rgba(239,247,255,.8);
  box-shadow:0 10px 34px rgba(5,35,72,.1);
  backdrop-filter:blur(22px) saturate(150%);
  -webkit-backdrop-filter:blur(22px) saturate(150%);
}
.nav-wrap.is-scrolled .button-small{
  border-color:rgba(7,27,62,.08);
  background:#0a2a59;
  color:#fff;
}
@media(width < 900px){
  .nav-links{gap:0;font-size:.95rem}
  .nav-wrap:not(.is-scrolled) .nav-links{background:rgba(239,247,255,.94);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
}

/* Version 17: seamless hero state and restrained cool glass on scroll. */
.nav-wrap:not(.is-scrolled){
  border-bottom-color:transparent;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.nav-wrap.is-scrolled{
  border-bottom-color:rgba(20,57,96,.09);
  background:rgba(248,251,255,.88);
  box-shadow:0 8px 26px rgba(8,35,68,.07);
  backdrop-filter:blur(20px) saturate(135%);
  -webkit-backdrop-filter:blur(20px) saturate(135%);
}

/* Version 18: purpose-built mobile hero instead of a stacked desktop composition. */
@media(width < 600px){
  .hero{
    min-height:0;
    padding:104px 0 58px;
    background-position:64% top;
  }
  .hero:before{
    background:linear-gradient(180deg,rgba(3,15,38,.91) 0%,rgba(3,17,41,.84) 43%,rgba(3,17,41,.93) 100%);
  }
  .hero-grid{
    gap:38px;
  }
  .hero-copy{
    max-width:none;
    padding:0;
  }
  .hero-copy .eyebrow{
    gap:8px;
    font-size:.66rem;
    letter-spacing:.15em;
  }
  .hero-copy .eyebrow span{width:22px}
  .hero h1{
    margin:15px 0 18px;
    font-size:clamp(2.48rem,11.4vw,3rem);
    line-height:1.01;
    letter-spacing:-.05em;
  }
  .hero h1 em{
    display:block;
    margin-top:7px;
    line-height:.98;
  }
  .hero-lede{
    margin:0;
    font-size:.98rem;
    line-height:1.58;
    color:#d7e4f4;
    text-shadow:none;
  }
  .hero-actions{
    display:grid;
    gap:16px;
    margin:27px 0 25px;
  }
  .hero-actions .button-primary{
    width:100%;
    min-height:50px;
  }
  .hero-actions .text-link{
    justify-self:center;
    font-size:.9rem;
  }
  .proof-list{
    gap:8px;
    margin-top:0;
    font-size:.76rem;
    line-height:1.4;
  }
  .hero-visual{
    height:auto;
    min-height:0;
    padding:0;
  }
  .hero-visual:before,
  .hero-visual .ops-label,
  .hero-visual .floating-card,
  .hero-visual .sync-pill{
    display:none;
  }
  .schedule-window{
    position:relative;
    inset:auto;
    width:100%;
    border-radius:14px;
    box-shadow:0 22px 54px rgba(0,8,27,.4);
  }
  .schedule-window .browser-bar{
    height:34px;
    padding:0 11px;
    font-size:.58rem;
  }
  .schedule-window .browser-bar span{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .schedule-window .hero-crop{height:205px}
  .schedule-window .hero-crop img{
    object-position:72% center;
    transform:scale(1.08);
  }
}

/* Version 28: keep iOS composited scrolling layers behind the fixed glass header. */
.nav-wrap{
  z-index:1000;
  isolation:isolate;
  transform:translate3d(0,0,0);
  -webkit-transform:translate3d(0,0,0);
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}
.nav-wrap.is-scrolled{
  background:rgba(248,251,255,.96);
}
html[data-site-version] .nav-wrap{
  z-index:100;
  isolation:auto;
  transform:none;
  -webkit-transform:none;
  backface-visibility:visible;
  -webkit-backface-visibility:visible;
}
html[data-site-version] .nav-wrap.is-scrolled{
  background:rgba(248,251,255,.88);
}

/* Version 19: a distinct, product-first mobile hero and animated menu control. */
.mobile-hero{display:none}
@media(width < 600px){
  .nav{height:70px;padding:0}
  .nav-wrap.is-scrolled .nav{height:64px}
  .brand>small{display:none}
  .header-logo-stack{width:124px}
  .menu-button{
    position:relative;
    display:grid;
    place-content:center;
    gap:4px;
    width:42px;
    height:42px;
    padding:0;
    border:1px solid rgba(255,255,255,.28);
    border-radius:50%;
  }
  .menu-button span{
    display:block;
    width:17px;
    height:1.5px;
    border-radius:999px;
    background:currentColor;
    transform-origin:center;
    transition:transform .22s ease,opacity .16s ease;
  }
  .menu-button[aria-expanded="true"] span:nth-child(1){transform:translateY(5.5px) rotate(45deg)}
  .menu-button[aria-expanded="true"] span:nth-child(2){opacity:0}
  .menu-button[aria-expanded="true"] span:nth-child(3){transform:translateY(-5.5px) rotate(-45deg)}
  .nav-links{
    left:14px;
    right:14px;
    top:calc(100% + 8px);
    padding:10px;
    border:1px solid rgba(20,57,96,.1);
    border-radius:18px;
    background:rgba(248,251,255,.96)!important;
    box-shadow:0 18px 50px rgba(4,24,49,.16);
    backdrop-filter:blur(20px);
    -webkit-backdrop-filter:blur(20px);
  }
  .nav-links a{padding:12px 13px}
  .nav-links .button-small{margin-top:7px}
  .hero{
    padding:0;
    min-height:0;
    background:radial-gradient(circle at 85% 17%,rgba(30,111,210,.32),transparent 33%),radial-gradient(circle at 8% 64%,rgba(53,195,214,.13),transparent 34%),linear-gradient(155deg,#061632 0%,#092c5a 62%,#0a3d72 100%);
  }
  .hero:before{display:none}
  .hero-grid{display:none}
  .mobile-hero{
    position:relative;
    z-index:2;
    display:block;
    padding-top:106px;
    padding-bottom:52px;
  }
  .mobile-hero-copy{text-align:center}
  .mobile-hero-copy .eyebrow{
    justify-content:center;
    margin:0;
    color:#9edcff;
    font-size:.65rem;
    letter-spacing:.15em;
  }
  .mobile-hero-copy h1{
    margin:17px auto 18px;
    max-width:370px;
    font-size:clamp(2.55rem,12vw,3.25rem);
    line-height:.98;
    letter-spacing:-.052em;
  }
  .mobile-hero-copy h1 em{
    display:block;
    margin-top:8px;
    color:#dcebfa;
    font-family:"Instrument Serif",Baskerville,Georgia,serif;
    font-weight:400;
    font-style:italic;
  }
  .mobile-hero-copy>p:last-of-type{
    max-width:355px;
    margin:0 auto;
    color:#cbdced;
    font-size:.96rem;
    line-height:1.58;
  }
  .mobile-hero-actions{
    display:grid;
    justify-items:center;
    gap:15px;
    margin:27px 0 38px;
  }
  .mobile-hero-actions .button{
    width:min(100%,330px);
    min-height:51px;
  }
  .mobile-hero-actions .text-link{font-size:.88rem}
  .mobile-product-stage{position:relative;padding-bottom:34px}
  .mobile-product-labels{
    display:flex;
    gap:7px;
    margin:0 0 10px;
    overflow:hidden;
  }
  .mobile-product-labels span{
    flex:0 0 auto;
    padding:7px 11px;
    border:1px solid rgba(255,255,255,.16);
    border-radius:999px;
    color:#aac2da;
    font-size:.65rem;
    font-weight:750;
  }
  .mobile-product-labels .active{border-color:rgba(255,255,255,.6);background:#fff;color:var(--navy)}
  .mobile-product-window{
    overflow:hidden;
    border:1px solid rgba(255,255,255,.35);
    border-radius:16px;
    background:#f8fbff;
    box-shadow:0 28px 70px rgba(0,8,27,.45);
  }
  .mobile-product-window .browser-bar{
    height:33px;
    padding:0 11px;
    font-size:.56rem;
  }
  .mobile-product-window .browser-bar span{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .mobile-product-window>img{
    width:100%;
    height:224px;
    object-fit:cover;
    object-position:71% center;
  }
  .mobile-product-status{
    position:absolute;
    left:50%;
    bottom:0;
    display:flex;
    align-items:center;
    gap:9px;
    width:calc(100% - 34px);
    padding:11px 13px;
    border:1px solid rgba(255,255,255,.55);
    border-radius:13px;
    background:rgba(248,251,255,.94);
    color:var(--navy);
    box-shadow:0 15px 36px rgba(0,8,27,.24);
    transform:translateX(-50%);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
  }
  .mobile-product-status b{
    display:grid;
    place-items:center;
    flex:0 0 27px;
    width:27px;
    height:27px;
    border-radius:50%;
    background:#dcf8ea;
    color:#12865b;
  }
  .mobile-product-status>span{display:grid;text-align:left;line-height:1.25}
  .mobile-product-status strong{font-size:.74rem}
  .mobile-product-status small{color:#687b8d;font-size:.62rem}
}
@media(prefers-reduced-motion:reduce){.menu-button span{transition:none}}

/* Version 27: shift the mobile photograph toward the artist; ?version=26 preserves the prior crop. */
.mobile-context-photo{display:none}
.site-version{
  position:fixed;
  right:12px;
  bottom:12px;
  z-index:120;
  padding:6px 10px;
  border:1px solid rgba(255,255,255,.5);
  border-radius:999px;
  background:rgba(7,27,62,.78);
  color:#fff;
  box-shadow:0 8px 24px rgba(5,24,51,.18);
  font-size:.65rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
@media(width < 600px){
  .hero{
    background:linear-gradient(180deg,#061632 0%,#061632 55%,#082b57 78%,#0a3d72 100%);
  }
  .mobile-hero{
    isolation:isolate;
  }
  .mobile-hero-copy{
    position:relative;
    z-index:2;
    padding-top:225px;
  }
  .mobile-hero-actions{
    margin-bottom:28px;
  }
  .mobile-context-photo{
    position:absolute;
    top:0;
    left:50%;
    z-index:0;
    display:block;
    width:100vw;
    height:510px;
    margin:0;
    overflow:hidden;
    border:0;
    border-radius:0;
    background:#0a2852;
    box-shadow:none;
    transform:translateX(-50%);
    pointer-events:none;
  }
  .mobile-context-photo:after{
    content:"";
    position:absolute;
    inset:0;
    background:
      linear-gradient(180deg,rgba(6,22,50,.18) 0%,rgba(6,22,50,.36) 34%,rgba(6,22,50,.78) 64%,#061632 100%),
      linear-gradient(90deg,rgba(6,22,50,.28),rgba(6,22,50,.04));
  }
  .mobile-context-photo img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:78% center;
    filter:brightness(.74) saturate(.86);
  }
  html[data-site-version="26"] .mobile-context-photo img{
    object-position:66% center;
  }
  .mobile-product-stage{z-index:2}
  .site-version{
    right:10px;
    bottom:10px;
    padding:5px 9px;
    font-size:.59rem;
  }
}

/* Version 30: neutral, stronger iOS-safe glass header with complete content masking. */
.nav-wrap{
  position:fixed;
  background:transparent;
  border-bottom-color:transparent;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.nav-wrap::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  opacity:0;
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(248,250,252,.93));
  border-bottom:1px solid rgba(17,36,61,.11);
  box-shadow:0 10px 30px rgba(8,27,51,.10),inset 0 1px 0 rgba(255,255,255,.82);
  backdrop-filter:blur(28px) saturate(155%) brightness(1.06);
  -webkit-backdrop-filter:blur(28px) saturate(155%) brightness(1.06);
  transition:opacity .28s ease;
}
.nav-wrap .nav{
  position:relative;
  z-index:1;
}
.nav-wrap.is-scrolled{
  background:transparent;
  border-bottom-color:transparent;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.nav-wrap.is-scrolled::before{opacity:1}

/* Version 31: artifact-free hamburger-to-close animation. */
@media(width < 900px){
  .menu-button{
    position:relative;
    display:block;
    width:42px;
    height:42px;
    padding:0;
  }
  .menu-button span{
    position:absolute;
    top:50%;
    left:50%;
    display:block;
    width:18px;
    height:2px;
    margin:-1px 0 0 -9px;
    border-radius:2px;
    background:currentColor;
    transform-origin:50% 50%;
    transition:transform .22s ease,opacity .12s ease;
    will-change:transform,opacity;
  }
  .menu-button span:nth-child(1){transform:translateY(-6px)}
  .menu-button span:nth-child(2){transform:scaleX(1)}
  .menu-button span:nth-child(3){transform:translateY(6px)}
  .menu-button[aria-expanded="true"] span:nth-child(1){transform:rotate(45deg)}
  .menu-button[aria-expanded="true"] span:nth-child(2){
    opacity:0;
    visibility:hidden;
    transform:scaleX(0);
  }
  .menu-button[aria-expanded="true"] span:nth-child(3){transform:rotate(-45deg)}
}

/* Version 32: swipeable mobile product preview experiment. */
@media(width < 600px){
  .mobile-product-labels{
    padding-right:14px;
    overflow-x:auto;
    scrollbar-width:none;
  }
  .mobile-product-labels::-webkit-scrollbar{display:none}
  .mobile-product-labels button{
    flex:0 0 auto;
    padding:7px 11px;
    border:1px solid rgba(255,255,255,.16);
    border-radius:999px;
    background:transparent;
    color:#aac2da;
    font-size:.65rem;
    font-weight:750;
    cursor:pointer;
    transition:background .2s ease,color .2s ease,border-color .2s ease;
  }
  .mobile-product-labels button.active{
    border-color:rgba(255,255,255,.6);
    background:#fff;
    color:var(--navy);
  }
  .mobile-product-track{
    display:flex;
    gap:11px;
    margin-right:-14px;
    padding-right:12%;
    overflow-x:auto;
    overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory;
    scroll-padding-left:0;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }
  .mobile-product-track::-webkit-scrollbar{display:none}
  .mobile-product-track .mobile-product-window{
    flex:0 0 88%;
    scroll-snap-align:start;
    scroll-snap-stop:always;
  }
  .mobile-product-track .mobile-product-window:nth-child(2) img{object-position:63% center}
  .mobile-product-track .mobile-product-window:nth-child(3) img{object-position:80% center}
}

/* Version 33: subtle motion background in the mobile hero photograph area. */
@media(width < 600px){
  .mobile-context-photo .mobile-context-fallback,
  .mobile-context-photo .mobile-context-video{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:78% center;
    filter:brightness(.74) saturate(.86);
  }
  .mobile-context-photo .mobile-context-fallback{z-index:0}
  .mobile-context-photo .mobile-context-video{z-index:1;display:block}
  .mobile-context-photo::after{z-index:2}
}
@media(width < 600px) and (prefers-reduced-motion:reduce){
  .mobile-context-photo .mobile-context-video{display:none}
}

/* Version 34: taller mobile product cards inspired by Mangomint's product showcase. */
@media(width < 600px){
  .mobile-product-track .mobile-product-window>img{
    height:320px;
  }
}

/* Version 46: desktop curtain-reveal footer with a vertical-specific brand payoff. */
@media(width >= 900px){
  body{background:#03142f}
  main,body>footer{
    position:relative;
    z-index:2;
  }
  body>footer{
    box-shadow:0 22px 58px rgba(0,8,27,.34);
  }
  .footer-reveal-spacer{
    position:relative;
    z-index:0;
    height:min(660px,78vh);
    min-height:540px;
    pointer-events:none;
  }
  .footer-reveal{
    position:fixed;
    inset:auto 0 0;
    z-index:1;
    display:grid;
    place-items:center;
    height:min(660px,78vh);
    min-height:540px;
    overflow:hidden;
    color:#fff;
    background:
      radial-gradient(circle at 18% 105%,rgba(32,132,255,.28),transparent 39%),
      radial-gradient(circle at 87% 4%,rgba(86,205,255,.12),transparent 33%),
      linear-gradient(145deg,#03142f 0%,#062554 58%,#07346b 100%);
  }
  .footer-reveal:before{
    content:"";
    position:absolute;
    inset:1px;
    border:1px solid rgba(255,255,255,.08);
    pointer-events:none;
  }
  .footer-reveal-inner{
    position:relative;
    display:grid;
    justify-items:center;
    gap:32px;
    padding:72px 0 48px;
    text-align:center;
  }
  .footer-reveal h2{
    display:grid;
    gap:3px;
    margin:0;
    line-height:.91;
    letter-spacing:-.06em;
  }
  .footer-reveal h2>span{
    font-size:clamp(3.3rem,6.9vw,7.4rem);
    font-weight:750;
  }
  .footer-reveal h2 strong{
    font-size:clamp(4.1rem,8.6vw,9.4rem);
    font-weight:750;
    color:transparent;
    background:linear-gradient(90deg,#4da7ff 0%,#a9d6ff 52%,#58afff 100%);
    -webkit-background-clip:text;
    background-clip:text;
  }
  .footer-reveal h2>span,
  .footer-reveal h2 strong{
    opacity:0;
    transform:translateY(34px);
    animation:footer-reveal-in .85s cubic-bezier(.22,.78,.25,1) forwards;
    animation-play-state:paused;
  }
  .footer-reveal h2 strong{animation-delay:.08s}
  .footer-reveal-button,
  .footer-reveal-brand{
    opacity:0;
    transform:translateY(20px);
    animation:footer-reveal-in .7s cubic-bezier(.22,.78,.25,1) .16s forwards;
    animation-play-state:paused;
  }
  .footer-reveal-brand{animation-delay:.24s}
  .footer-reveal.is-revealed h2>span,
  .footer-reveal.is-revealed h2 strong,
  .footer-reveal.is-revealed .footer-reveal-button,
  .footer-reveal.is-revealed .footer-reveal-brand{animation-play-state:running}
  .footer-reveal-button{
    min-height:56px;
    padding:15px 28px;
    border-color:rgba(255,255,255,.56);
    background:#fff;
    color:#061a3f;
    box-shadow:0 18px 46px rgba(0,6,24,.27);
  }
  .footer-reveal-brand{
    display:grid;
    justify-items:center;
    gap:7px;
    margin-top:2px;
    color:#c3d3e7;
    font-size:.72rem;
    letter-spacing:.1em;
  }
  .footer-reveal-brand img{width:158px}
}

@keyframes footer-reveal-in{
  to{opacity:1;transform:translateY(0)}
}

@media(width < 900px){
  .footer-reveal-spacer{display:none}
  .footer-reveal{
    position:relative;
    z-index:2;
    padding:82px 0 72px;
    overflow:hidden;
    color:#fff;
    text-align:center;
    background:linear-gradient(145deg,#03142f,#07346b);
  }
  .footer-reveal-inner{display:grid;justify-items:center;gap:25px}
  .footer-reveal h2{display:grid;gap:5px;margin:0;line-height:.95;letter-spacing:-.052em}
  .footer-reveal h2>span{font-size:clamp(2.25rem,9vw,4rem)}
  .footer-reveal h2 strong{
    font-size:clamp(3rem,13vw,5.3rem);
    color:#74b9ff;
  }
  .footer-reveal-button{background:#fff;color:#061a3f}
  .footer-reveal-brand{display:grid;justify-items:center;gap:6px;margin-top:7px;color:#c3d3e7;font-size:.68rem;letter-spacing:.09em}
  .footer-reveal-brand img{width:146px}
}

@media(prefers-reduced-motion:reduce){
  .footer-reveal h2>span,
  .footer-reveal h2 strong,
  .footer-reveal-button,
  .footer-reveal-brand{opacity:1;transform:none;animation:none}
}

/* Version 47: longer, more spacious reveal with animated brand color and starlight. */
@media(width >= 900px){
  .footer-reveal-spacer{
    height:145vh;
    min-height:980px;
  }
  .footer-reveal{
    height:100vh;
    min-height:680px;
  }
  .footer-reveal-inner{
    z-index:2;
    height:100%;
    align-content:start;
    gap:42px;
    padding-top:clamp(145px,19vh,210px);
    padding-bottom:clamp(105px,13vh,150px);
  }
  .footer-reveal h2{
    width:100%;
    gap:10px;
    line-height:.9;
  }
  .footer-reveal h2>span{
    white-space:nowrap;
    font-size:clamp(2.9rem,5.35vw,5.85rem);
    letter-spacing:-.055em;
  }
  .footer-reveal h2 strong{
    font-size:clamp(4.1rem,8.15vw,8.8rem);
    background:none;
    -webkit-background-clip:initial;
    background-clip:initial;
  }
  .footer-reveal h2 strong>span{
    display:inline-block;
    color:transparent;
    background:linear-gradient(100deg,#168cff 0%,#9bd5ff 24%,#4aa7ff 47%,#d3edff 68%,#168cff 100%);
    background-size:260% 100%;
    -webkit-background-clip:text;
    background-clip:text;
    animation:superpower-colors 5.5s linear infinite;
  }
  .footer-reveal-button{margin-top:10px}
  .footer-reveal-brand{margin-top:auto}
  .footer-stars{
    position:absolute;
    inset:0;
    z-index:1;
    overflow:hidden;
    pointer-events:none;
  }
  .footer-stars i{
    position:absolute;
    width:4px;
    height:4px;
    border-radius:50%;
    background:#fff;
    box-shadow:0 0 9px 2px rgba(117,198,255,.72);
    opacity:.18;
    animation:footer-star 3.2s ease-in-out infinite;
  }
  .footer-stars i:before,.footer-stars i:after{
    content:"";
    position:absolute;
    left:50%;
    top:50%;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.85),transparent);
    transform:translate(-50%,-50%);
  }
  .footer-stars i:before{width:22px;height:1px}
  .footer-stars i:after{width:1px;height:22px}
  .footer-stars i:nth-child(1){left:7%;top:24%;animation-delay:-.4s}
  .footer-stars i:nth-child(2){left:18%;top:67%;animation-delay:-1.8s;transform:scale(.7)}
  .footer-stars i:nth-child(3){left:31%;top:13%;animation-delay:-2.5s;transform:scale(.55)}
  .footer-stars i:nth-child(4){left:76%;top:18%;animation-delay:-1.1s;transform:scale(.8)}
  .footer-stars i:nth-child(5){left:91%;top:46%;animation-delay:-2.8s;transform:scale(.62)}
  .footer-stars i:nth-child(6){left:82%;top:78%;animation-delay:-.1s;transform:scale(.5)}
  .footer-stars i:nth-child(7){left:12%;top:88%;animation-delay:-2.1s;transform:scale(.42)}
  .footer-stars i:nth-child(8){left:63%;top:71%;animation-delay:-1.4s;transform:scale(.46)}
}

@keyframes superpower-colors{
  from{background-position:0% 50%}
  to{background-position:260% 50%}
}
@keyframes footer-star{
  0%,100%{opacity:.12;filter:blur(.25px)}
  48%{opacity:.92;filter:none}
  58%{opacity:.32}
}

@media(width < 900px){
  .footer-stars{display:none}
  .footer-reveal h2 strong>span{color:inherit}
}

@media(prefers-reduced-motion:reduce){
  .footer-reveal h2 strong>span{animation:none;background-position:48% 50%}
  .footer-stars i{animation:none;opacity:.35}
}

/* Version 48: balance the reveal and make the bridal magic unmistakable. */
@media(width >= 900px){
  .footer-reveal-inner{
    align-content:center;
    gap:0;
    padding-top:9vh;
    padding-bottom:10vh;
  }
  .footer-reveal h2{
    margin:0 0 54px;
    line-height:1;
    overflow:visible;
  }
  .footer-reveal h2 strong{
    line-height:1.04;
    overflow:visible;
  }
  .footer-reveal h2 strong>span{
    padding:0 .025em .115em;
    margin-bottom:-.115em;
    overflow:visible;
  }
  .footer-reveal-button{
    min-height:70px;
    padding:19px 40px;
    margin:0 0 66px;
    font-size:1.08rem;
    box-shadow:0 20px 58px rgba(0,6,24,.34),0 0 0 1px rgba(255,255,255,.25);
  }
  .footer-reveal-brand{margin:0}
  .footer-reveal-brand img{width:232px}
  .footer-reveal-brand small{font-size:.82rem}

  .footer-stars:before{
    content:"";
    position:absolute;
    inset:-12%;
    opacity:.52;
    background:
      radial-gradient(circle at 16% 35%,rgba(125,204,255,.3) 0 2px,transparent 10px),
      radial-gradient(circle at 27% 78%,rgba(255,255,255,.25) 0 1px,transparent 8px),
      radial-gradient(circle at 46% 18%,rgba(178,222,255,.28) 0 1.5px,transparent 9px),
      radial-gradient(circle at 68% 63%,rgba(255,255,255,.24) 0 1px,transparent 8px),
      radial-gradient(circle at 86% 29%,rgba(99,184,255,.34) 0 2px,transparent 11px),
      radial-gradient(circle at 76% 87%,rgba(210,236,255,.24) 0 1.5px,transparent 9px);
    animation:footer-magic-drift 13s ease-in-out infinite alternate;
  }
  .footer-stars i{
    width:6px;
    height:6px;
    opacity:.3;
    box-shadow:0 0 12px 3px rgba(117,198,255,.82),0 0 30px 6px rgba(36,135,255,.28);
    animation-duration:2.8s;
  }
  .footer-stars i:before{width:38px;height:1.5px}
  .footer-stars i:after{width:1.5px;height:38px}
  .footer-stars i:nth-child(1){left:6%;top:20%;transform:scale(1.05)}
  .footer-stars i:nth-child(2){left:16%;top:61%;transform:scale(.62)}
  .footer-stars i:nth-child(3){left:29%;top:12%;transform:scale(.45)}
  .footer-stars i:nth-child(4){left:76%;top:16%;transform:scale(.82)}
  .footer-stars i:nth-child(5){left:93%;top:43%;transform:scale(.7)}
  .footer-stars i:nth-child(6){left:84%;top:75%;transform:scale(.48)}
  .footer-stars i:nth-child(7){left:10%;top:84%;transform:scale(.52)}
  .footer-stars i:nth-child(8){left:63%;top:78%;transform:scale(.42)}
  .footer-stars i:nth-child(9){left:38%;top:69%;animation-delay:-2.3s;transform:scale(.35)}
  .footer-stars i:nth-child(10){left:55%;top:9%;animation-delay:-.8s;transform:scale(.55)}
  .footer-stars i:nth-child(11){left:89%;top:88%;animation-delay:-1.9s;transform:scale(.36)}
  .footer-stars i:nth-child(12){left:3%;top:48%;animation-delay:-1.2s;transform:scale(.4)}
}

@keyframes footer-magic-drift{
  from{transform:translate3d(-1.5%,-1%,0) scale(1);opacity:.38}
  to{transform:translate3d(1.5%,1%,0) scale(1.035);opacity:.7}
}

@media(prefers-reduced-motion:reduce){
  .footer-stars:before{animation:none}
}

/* Version 49: a finite 676px footer reveal built upward from the page bottom. */
@media(width >= 900px){
  .footer-reveal-spacer{
    height:676px;
    min-height:676px;
  }
  .footer-reveal{
    height:676px;
    min-height:676px;
  }
  .footer-reveal-inner{
    height:676px;
    align-content:start;
    gap:0;
    padding:90px 0 100px;
  }
  .footer-reveal h2{
    display:grid;
    align-content:center;
    height:186px;
    margin:0 0 60px;
  }
  .footer-reveal-button{
    height:80px;
    min-height:80px;
    padding:20px 46px;
    margin:0 0 80px;
    font-size:1.12rem;
  }
  .footer-reveal-brand{
    align-content:center;
    height:80px;
    margin:0;
    gap:5px;
  }
  .footer-reveal-brand img{
    width:auto;
    height:58px;
  }
  .footer-reveal-brand small{line-height:17px}

  .footer-shooting-stars{
    position:absolute;
    inset:0;
    z-index:1;
    overflow:hidden;
    pointer-events:none;
  }
  .footer-shooting-stars b{
    position:absolute;
    left:-14%;
    width:7px;
    height:7px;
    border-radius:50%;
    background:#e7f7ff;
    box-shadow:0 0 12px 4px rgba(120,207,255,.85),0 0 34px 8px rgba(28,134,255,.38);
    opacity:0;
    transform:rotate(-12deg);
    animation:footer-flyby 11s cubic-bezier(.2,.55,.35,1) infinite;
  }
  .footer-shooting-stars b:after{
    content:"";
    position:absolute;
    right:4px;
    top:3px;
    width:105px;
    height:1px;
    background:linear-gradient(90deg,transparent,rgba(129,207,255,.18),rgba(235,249,255,.82));
    transform-origin:right center;
  }
  .footer-shooting-stars b:nth-child(1){top:21%;animation-delay:-2s}
  .footer-shooting-stars b:nth-child(2){top:58%;animation-delay:-7.5s;animation-duration:14s;transform:scale(.68) rotate(-12deg)}
  .footer-shooting-stars b:nth-child(3){top:79%;animation-delay:-10.5s;animation-duration:16s;transform:scale(.48) rotate(-12deg)}
}

@keyframes footer-flyby{
  0%,58%{left:-14%;opacity:0}
  61%{opacity:.85}
  75%{opacity:.9}
  82%,100%{left:112%;opacity:0}
}

@media(width < 900px){.footer-shooting-stars{display:none}}
@media(prefers-reduced-motion:reduce){.footer-shooting-stars{display:none}}

/* Version 50: quieter type, expanded rhythm, and a single slow rising star. */
@media(width >= 900px){
  .footer-reveal-spacer{
    height:830px;
    min-height:830px;
  }
  .footer-reveal{
    height:830px;
    min-height:830px;
  }
  .footer-reveal-inner{
    height:830px;
    padding:150px 0 200px;
  }
  .footer-reveal h2{
    height:130px;
    margin-bottom:90px;
  }
  .footer-reveal h2>span{
    font-size:clamp(2.1rem,3.75vw,4.1rem);
  }
  .footer-reveal h2 strong{
    font-size:clamp(2.9rem,5.7vw,6.15rem);
    line-height:1;
  }
  .footer-reveal-button{
    margin-bottom:100px;
    font-size:1.3rem;
  }

  .footer-shooting-stars b{display:none}
  .footer-shooting-stars b:first-child{
    display:block;
    left:18%;
    top:auto;
    bottom:-24px;
    width:8px;
    height:8px;
    animation:footer-rising-star 24s cubic-bezier(.36,.12,.22,1) infinite;
  }
  .footer-shooting-stars b:first-child:after{
    width:82px;
    opacity:.62;
  }
}

@keyframes footer-rising-star{
  0%,25%{opacity:0;transform:translate3d(0,0,0) rotate(-50deg) scale(.72)}
  28%{opacity:.78}
  40%{opacity:.9;transform:translate3d(13vw,-105px,0) rotate(-42deg) scale(.82)}
  54%{opacity:.86;transform:translate3d(34vw,-290px,0) rotate(-30deg) scale(.92)}
  68%{opacity:.72;transform:translate3d(48vw,-535px,0) rotate(-12deg) scale(.82)}
  80%{opacity:.42;transform:translate3d(39vw,-760px,0) rotate(30deg) scale(.62)}
  86%,100%{opacity:0;transform:translate3d(31vw,-880px,0) rotate(65deg) scale(.42)}
}

/* Version 51: remove flybys and add a calmer 250px opening reveal. */
@media(width >= 900px){
  .footer-reveal-spacer{
    height:930px;
    min-height:930px;
  }
  .footer-reveal{
    height:930px;
    min-height:930px;
  }
  .footer-reveal-inner{
    height:930px;
    padding-top:250px;
    padding-bottom:200px;
  }
  .footer-shooting-stars{display:none!important}
}

/* Version 52: personalized CTA language with a restrained starlight pulse. */
@media(width >= 900px){
  .footer-reveal-button{
    animation:
      footer-reveal-in .7s cubic-bezier(.22,.78,.25,1) .16s forwards,
      footer-cta-glow 5.5s ease-in-out 1.1s infinite;
    animation-play-state:paused;
  }
  .footer-reveal.is-revealed .footer-reveal-button{
    animation-play-state:running;
  }
}
@keyframes footer-cta-glow{
  0%,100%{
    box-shadow:
      0 20px 58px rgba(0,6,24,.34),
      0 0 0 1px rgba(255,255,255,.25),
      0 0 0 rgba(103,190,255,0);
  }
  48%,58%{
    box-shadow:
      0 22px 62px rgba(0,6,24,.38),
      0 0 0 1px rgba(255,255,255,.46),
      0 0 34px 8px rgba(91,179,255,.24);
  }
}
@media(prefers-reduced-motion:reduce){
  .footer-reveal-button{animation:none}
}

/* Version 35: wider carousel rhythm with continuous active-card focus. */
@media(width < 600px){
  .mobile-product-track{
    gap:16px;
    align-items:center;
    padding-top:10px;
    padding-bottom:10px;
  }
  .mobile-product-track .mobile-product-window{
    opacity:var(--mobile-slide-opacity,.82);
    transform:scale(var(--mobile-slide-scale,.94));
    transform-origin:center;
    transition:transform .18s ease-out,opacity .18s ease-out;
    will-change:transform,opacity;
  }
  .mobile-product-track .mobile-product-window:first-child{
    opacity:var(--mobile-slide-opacity,1);
    transform:scale(var(--mobile-slide-scale,1));
  }
}
@media(width < 600px) and (prefers-reduced-motion:reduce){
  .mobile-product-track .mobile-product-window{transition:none}
}

/* Version 36: stronger mobile logo presence without changing header height. */
@media(width < 600px){
  .header-logo-stack{width:142px}
}

/* Version 37: centered, unclipped carousel geometry and a cleaner product stage. */
@media(width < 600px){
  .mobile-product-stage{padding-bottom:0}
  .mobile-product-track{
    margin-inline:-14px;
    padding:10px 38px 14px;
    scroll-padding-inline:38px;
  }
  .mobile-product-track .mobile-product-window{
    flex-basis:calc(100vw - 76px);
    scroll-snap-align:center;
  }
}

/* Version 38: align controls and refine the mobile hero ending. */
@media(width < 600px){
  .mobile-hero{padding-bottom:24px}
  .mobile-hero-actions{gap:24px}
  .mobile-product-labels{padding-left:24px}
  .mobile-product-track .mobile-product-window>img{height:350px}
  .hero{
    background:
      radial-gradient(circle at 85% 17%,rgba(30,111,210,.26),transparent 33%),
      radial-gradient(circle at 8% 64%,rgba(53,195,214,.1),transparent 34%),
      linear-gradient(180deg,#061632 0%,#061632 62%,#071f42 100%);
  }
}

/* Version 39: separate the product story and bridge it into the next section. */
@media(width < 600px){
  .mobile-hero-actions{margin-bottom:52px}
  .hero:after{
    display:block;
    inset:auto 0 0;
    z-index:1;
    height:94px;
    background:var(--ivory);
    transform:none;
  }
  .mobile-product-stage{position:relative;z-index:2}
}

/* Version 40: extend the product preview and tighten its handoff to the story. */
@media(width < 600px){
  .mobile-product-track .mobile-product-window>img{height:380px}
  .mobile-product-window{box-shadow:0 18px 42px rgba(0,8,27,.25)}
  .problem-band{padding-top:40px}
}

/* Version 41: use one uninterrupted ivory transition below the mobile hero. */
@media(width < 600px){
  .hero:after,.problem-band{background:#fbf8f2}
  .mobile-product-window{box-shadow:none}
}

/* Version 44: keep the active carousel label fully visible while cards move. */
@media(width < 600px){
  .mobile-product-labels{
    padding-inline:24px;
    scroll-padding-inline:24px;
  }
}

/* Version 53: visible button glow and a branded gradient hover sweep. */
@media(width >= 900px){
  .footer-reveal-button{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    box-shadow:
      0 22px 58px rgba(0,6,24,.38),
      0 0 0 1px rgba(255,255,255,.38),
      0 0 34px 8px rgba(77,174,255,.3);
  }
  .footer-reveal-button::before{
    content:"";
    position:absolute;
    inset:-2px;
    z-index:0;
    border-radius:inherit;
    background:linear-gradient(105deg,#168eea 0%,#386fe8 36%,#655de5 68%,#8c63e7 100%);
    transform:translateX(-105%);
    transition:transform .72s cubic-bezier(.22,.75,.2,1);
  }
  .footer-reveal-button span{
    position:relative;
    z-index:1;
    transition:color .3s ease;
  }
}
@media(width >= 900px) and (hover:hover) and (pointer:fine){
  .footer-reveal-button:hover::before,
  .footer-reveal-button:focus-visible::before{
    transform:translateX(0);
  }
  .footer-reveal-button:hover span,
  .footer-reveal-button:focus-visible span{
    color:#fff;
  }
}
@keyframes footer-cta-glow{
  0%,100%{
    box-shadow:
      0 22px 58px rgba(0,6,24,.38),
      0 0 0 1px rgba(255,255,255,.38),
      0 0 34px 8px rgba(77,174,255,.3);
  }
  48%,58%{
    box-shadow:
      0 24px 64px rgba(0,6,24,.42),
      0 0 0 1px rgba(255,255,255,.58),
      0 0 46px 12px rgba(91,183,255,.42);
  }
}
@media(prefers-reduced-motion:reduce){
  .footer-reveal-button::before{transition:none}
}

/* Version 54: darker CleverOne blues with a single reflected-light shimmer. */
@media(width >= 900px){
  .footer-reveal-button::before{
    background:linear-gradient(105deg,#04366f 0%,#075ba6 46%,#087fd1 76%,#07508f 100%);
  }
  .footer-reveal-button::after{
    content:"";
    position:absolute;
    top:-55%;
    bottom:-55%;
    left:-42%;
    z-index:1;
    width:30%;
    pointer-events:none;
    opacity:0;
    background:linear-gradient(90deg,transparent 0%,rgba(216,244,255,.12) 25%,rgba(255,255,255,.82) 50%,rgba(216,244,255,.16) 75%,transparent 100%);
    filter:blur(1px);
    transform:skewX(-18deg) translateX(0);
  }
  .footer-reveal-button span{z-index:2}
}
@media(width >= 900px) and (hover:hover) and (pointer:fine){
  .footer-reveal-button:hover::after,
  .footer-reveal-button:focus-visible::after{
    animation:footer-cta-shimmer .9s cubic-bezier(.2,.7,.25,1) .12s 1 both;
  }
}
@keyframes footer-cta-shimmer{
  0%{opacity:0;transform:skewX(-18deg) translateX(0)}
  16%{opacity:1}
  78%{opacity:.9}
  100%{opacity:0;transform:skewX(-18deg) translateX(520%)}
}
@media(prefers-reduced-motion:reduce){
  .footer-reveal-button::after{display:none}
}

/* Version 55: remove shimmer, speed up the fill, and add a header-style lift. */
@media(width >= 900px){
  .footer-reveal-button{
    translate:0 0;
    filter:drop-shadow(0 0 0 rgba(0,0,0,0));
    transition:translate .22s ease,filter .22s ease;
  }
  .footer-reveal-button::before{
    transition:transform .27s cubic-bezier(.22,.75,.2,1);
  }
  .footer-reveal-button::after{
    content:none;
    display:none;
    animation:none;
  }
}
@media(width >= 900px) and (hover:hover) and (pointer:fine){
  .footer-reveal-button:hover,
  .footer-reveal-button:focus-visible{
    translate:0 -3px;
    filter:drop-shadow(0 12px 18px rgba(0,10,34,.26));
  }
}
@media(prefers-reduced-motion:reduce){
  .footer-reveal-button{transition:none}
}

/* Version 56: keep the CTA white and let hover communicate only through lift. */
@media(width >= 900px){
  .footer-reveal-button::before,
  .footer-reveal-button::after{
    content:none;
    display:none;
  }
  .footer-reveal-button span{
    color:#061a3f;
    transition:none;
  }
}
@media(width >= 900px) and (hover:hover) and (pointer:fine){
  .footer-reveal-button:hover span,
  .footer-reveal-button:focus-visible span{
    color:#061a3f;
  }
}

/* Version 57: 100px desktop CTA spacing and a true mobile curtain reveal. */
@media(width >= 900px){
  .footer-reveal h2{margin-bottom:100px}
}
@media(width < 900px){
  body{background:#03142f}
  main,body>footer{
    position:relative;
    z-index:2;
  }
  body>footer{box-shadow:0 20px 48px rgba(0,8,27,.32)}
  .footer-reveal-spacer{
    display:block;
    position:relative;
    z-index:0;
    height:620px;
    min-height:620px;
    pointer-events:none;
  }
  .footer-reveal{
    position:fixed;
    inset:auto 0 0;
    z-index:1;
    display:grid;
    place-items:center;
    width:100%;
    height:620px;
    min-height:620px;
    padding:0;
    background:
      radial-gradient(circle at 12% 88%,rgba(31,130,255,.25),transparent 38%),
      radial-gradient(circle at 88% 8%,rgba(96,207,255,.13),transparent 34%),
      linear-gradient(145deg,#03142f 0%,#062554 60%,#07346b 100%);
  }
  .footer-reveal-inner{
    width:100%;
    height:620px;
    align-content:start;
    gap:0;
    padding:92px 22px 62px;
  }
  .footer-reveal h2{
    margin:0 0 60px;
    overflow:visible;
  }
  .footer-reveal h2>span{
    font-size:clamp(2.15rem,9vw,3.45rem);
    font-weight:750;
  }
  .footer-reveal h2 strong{
    font-size:clamp(3rem,13vw,4.85rem);
    line-height:1.02;
  }
  .footer-reveal-button{
    min-height:64px;
    padding:17px 28px;
    margin:0 0 68px;
    font-size:1rem;
    box-shadow:0 18px 48px rgba(0,6,24,.32),0 0 28px 5px rgba(77,174,255,.2);
  }
  .footer-reveal-brand{
    margin:0;
    gap:6px;
  }
  .footer-reveal-brand img{width:176px}
  .footer-reveal h2>span,
  .footer-reveal h2 strong,
  .footer-reveal-button,
  .footer-reveal-brand{
    opacity:0;
    transform:translateY(20px);
    transition:opacity .65s ease,transform .65s cubic-bezier(.22,.78,.25,1);
  }
  .footer-reveal h2 strong{transition-delay:.06s}
  .footer-reveal-button{transition-delay:.12s}
  .footer-reveal-brand{transition-delay:.18s}
  .footer-reveal.is-revealed h2>span,
  .footer-reveal.is-revealed h2 strong,
  .footer-reveal.is-revealed .footer-reveal-button,
  .footer-reveal.is-revealed .footer-reveal-brand{
    opacity:1;
    transform:translateY(0);
  }
}
@media(width < 900px) and (prefers-reduced-motion:reduce){
  .footer-reveal h2>span,
  .footer-reveal h2 strong,
  .footer-reveal-button,
  .footer-reveal-brand{
    opacity:1;
    transform:none;
    transition:none;
  }
}

/* Version 58: echo the hero's editorial type in the Superpowers payoff. */
.footer-reveal h2 strong{
  font-family:"Instrument Serif",Baskerville,Georgia,serif;
  font-weight:400;
  font-style:italic;
  letter-spacing:-.025em;
  line-height:1.06;
}
.footer-reveal h2 strong>span{
  display:inline-block;
  padding:0 .06em .18em;
  margin-bottom:-.18em;
}
@media(width >= 900px){
  .footer-reveal h2 strong{
    font-size:clamp(2.8rem,4.65vw,5rem);
  }
}
@media(width < 900px){
  .footer-reveal h2 strong{
    font-size:clamp(2.9rem,12vw,4.35rem);
    line-height:1.08;
  }
}

/* Version 59: beauty in the setup, strength in the Superpowers payoff. */
.footer-reveal h2>span{
  font-family:"Instrument Serif",Baskerville,Georgia,serif;
  font-weight:400;
  font-style:italic;
  letter-spacing:-.025em;
}
.footer-reveal h2 strong{
  font-family:Manrope,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-weight:750;
  font-style:normal;
  letter-spacing:-.055em;
  line-height:1.02;
}
.footer-reveal h2 strong>span{
  padding:0 .025em .12em;
  margin-bottom:-.12em;
}
@media(width >= 900px){
  .footer-reveal h2>span{
    font-size:clamp(2.1rem,3.65vw,4rem);
  }
  .footer-reveal h2 strong{
    font-size:clamp(2.9rem,5.7vw,6.15rem);
  }
}
@media(width < 900px){
  .footer-reveal h2>span{
    font-size:clamp(2.1rem,8.6vw,3.3rem);
    line-height:1;
  }
  .footer-reveal h2 strong{
    font-size:clamp(3rem,13vw,4.85rem);
    line-height:1.02;
  }
}

/* Version 60: strengthen the editorial setup while balancing the mobile payoff. */
@media(width >= 900px){
  .footer-reveal h2>span{
    font-size:clamp(2.75rem,4.75vw,5.2rem);
  }
}
@media(width < 900px){
  .footer-reveal h2>span{
    font-size:clamp(2.2rem,9vw,3.45rem);
  }
  .footer-reveal h2 strong{
    font-size:clamp(2.55rem,11.05vw,4.12rem);
  }
}

/* Version 61: larger desktop editorial line, branded terminal dot, tighter mobile reveal. */
.footer-reveal .brand-dot{
  display:inline-block;
  margin-left:.015em;
  color:#0b5cab;
  -webkit-text-fill-color:#0b5cab;
  font-family:"Instrument Serif",Baskerville,Georgia,serif;
  font-size:.92em;
  font-weight:400;
  font-style:normal;
  line-height:1;
  letter-spacing:0;
  text-shadow:0 0 12px rgba(56,154,242,.24);
}
@media(width >= 900px){
  .footer-reveal h2>span{
    font-size:clamp(3.3rem,5.7vw,6.24rem);
  }
}
@media(width < 900px){
  .footer-reveal-spacer,
  .footer-reveal,
  .footer-reveal-inner{
    height:520px;
    min-height:520px;
  }
  .footer-reveal-inner{
    padding-top:112px;
    padding-bottom:40px;
  }
}

/* Version 62: balance the editorial line and emphasize the branded dot. */
.footer-reveal .brand-dot{font-size:1.01em}
@media(width >= 900px){
  .footer-reveal h2>span{
    font-size:clamp(3rem,5.13vw,5.62rem);
  }
}

/* Version 63: amplify the brand dot and strengthen the desktop payoff. */
.footer-reveal .brand-dot{font-size:1.16em}
@media(width >= 900px){
  .footer-reveal h2 strong{
    font-size:clamp(3.2rem,6.27vw,6.77rem);
  }
}

/* Version 64: tighten the desktop statement and separate CTA from brand. */
@media(width >= 900px){
  .footer-reveal h2 strong{
    position:relative;
    top:-8px;
  }
  .footer-reveal-button{
    margin-bottom:120px;
  }
}

/* Version 65: compose the footer reveal for iPad and other landscape tablets. */
@media (width >= 900px) and (width < 1400px) and (orientation:landscape) and (pointer:coarse){
  .footer-reveal-spacer,
  .footer-reveal{
    height:700px;
    min-height:700px;
  }
  .footer-reveal-inner{
    height:700px;
    align-content:center;
    gap:0;
    padding:52px 32px 46px;
  }
  .footer-reveal h2{
    height:auto;
    margin:0 0 50px;
  }
  .footer-reveal h2>span{
    font-size:clamp(2.75rem,5vw,4.65rem);
  }
  .footer-reveal h2 strong{
    top:-4px;
    font-size:clamp(3.7rem,6.5vw,6rem);
  }
  .footer-reveal-button{
    width:min(520px,72vw);
    height:70px;
    min-height:70px;
    margin:0 0 64px;
    padding:18px 34px;
    font-size:1.08rem;
  }
  .footer-reveal-brand{
    height:72px;
  }
  .footer-reveal-brand img{
    height:54px;
  }
}

/* Version 72: configurable beauty-brand marquee within the hero. */
.client-logo-marquee{
  position:absolute;
  z-index:5;
  right:0;
  bottom:0;
  left:0;
  height:80px;
  overflow:hidden;
  display:flex;
  align-items:center;
  background:rgba(2,10,25,.72);
  border-top:1px solid rgba(255,255,255,.1);
  border-bottom:1px solid rgba(255,255,255,.06);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%);
}
.client-logo-track{
  display:flex;
  width:max-content;
  align-items:center;
  animation:client-logo-scroll 60s linear infinite;
  will-change:transform;
}
.client-logo-group{
  display:flex;
  flex:none;
  align-items:center;
  gap:72px;
  padding:16px 72px 16px 0;
}
.client-logo-item{
  display:grid;
  place-items:center;
  flex:none;
  width:150px;
  height:48px;
  opacity:.7;
  transition:opacity .2s ease;
}
.client-logo-item img{
  display:block;
  width:auto;
  height:auto;
  max-width:100%;
  max-height:48px;
}
@keyframes client-logo-scroll{to{transform:translateX(-50%)}}
@media(width < 900px){
  .client-logo-marquee{
    position:relative;
    z-index:3;
    height:72px;
    margin-top:36px;
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 10%,#000 90%,transparent 100%);
    mask-image:linear-gradient(90deg,transparent 0,#000 10%,#000 90%,transparent 100%);
  }
  .client-logo-group{gap:48px;padding:14px 48px 14px 0}
  .client-logo-item{width:128px;height:44px}
  .client-logo-item img{max-height:44px}
}
@media(prefers-reduced-motion:reduce){
  .client-logo-track{animation:none}
  .client-logo-marquee{overflow-x:auto;-webkit-mask-image:none;mask-image:none}
}

/* Version 73: put the brand marquee into the mobile hero story. */
.client-logo-marquee--mobile{display:none}
@media(width < 900px){
  .client-logo-marquee--desktop{display:none}
  .client-logo-marquee--mobile{
    display:flex;
    width:100vw;
    margin:30px 0 0 calc(50% - 50vw);
  }
  .mobile-hero-actions{margin-bottom:0}
  .mobile-platform-link{
    display:inline-flex;
    margin:40px auto;
    font-size:.92rem;
  }
}

/* Version 82: desktop hero copy and interaction cleanup. */
@media(width >= 900px){
  .hero-grid .hero-copy{
    transform:translateY(-18px);
  }
  .hero-grid .hero-copy .eyebrow{
    color:#f7eee0;
    font-size:var(--type-eyebrow-fluid);
  }
  .hero-grid .hero-copy .eyebrow span{
    display:none;
  }
  .hero-grid .hero-title-lead{
    display:block;
    font-size:1.06em;
  }
  .hero-grid .hero-copy h1{
    margin-top:29px;
  }
  .hero-grid .hero-copy h1 em{
    display:block;
    margin-top:17px;
    font-size:1.1em;
    line-height:.96;
  }
  .hero-grid .hero-copy h1 em span{
    display:block;
    white-space:nowrap;
  }
  .hero-grid .hero-lede{
    max-width:var(--measure-supporting-fluid);
    font-size:var(--type-supporting-fluid);
    line-height:1.5;
  }
  .hero-grid .hero-actions{
    margin:48px 0 34px;
  }
  .hero-grid .hero-actions .text-link{
    text-decoration:underline;
    text-decoration-thickness:1px;
    text-underline-offset:5px;
  }
  .hero-recognition{
    max-width:var(--measure-positioning-fluid);
    margin:41px 0 0;
    color:#d5e1f0;
    font-size:var(--type-positioning-fluid);
    font-weight:600;
    line-height:1.6;
  }
}

/* Version 83: test the desktop hero without the product-overlay cluster. */
@media(width >= 900px){
  .hero-grid{
    grid-template-columns:1fr;
  }
  .hero-grid .hero-copy{
    width:min(700px,62%);
  }
}

/* Version 87: softened desktop operational timeline with deadline-to-start hierarchy. */
.hero-signal-stack{display:none}
@media(width >= 900px){
  .hero-signal-stack{
    position:absolute;
    right:0;
    bottom:104px;
    z-index:3;
    display:flex;
    flex-direction:column;
    align-items:flex-end;
    gap:8px;
    pointer-events:none;
  }
  .hero-signal-stack:before{
    content:"";
    position:absolute;
    top:80px;
    bottom:-22px;
    left:15.5px;
    width:1px;
    background:linear-gradient(to bottom,rgba(202,219,239,.28) 0%,rgba(202,219,239,.28) 78%,rgba(202,219,239,0) 100%);
  }
  .hero-signal-card{
    width:188px;
    min-height:58px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:10px 15px;
    color:rgba(255,255,255,.86);
    background:rgba(6,18,39,.20);
    border:1px solid rgba(255,255,255,.18);
    border-radius:10px;
    box-shadow:0 10px 30px rgba(0,8,27,.11);
    backdrop-filter:blur(12px) saturate(105%);
    -webkit-backdrop-filter:blur(12px) saturate(105%);
  }
  .hero-signal-card strong{
    font-size:.88rem;
    font-weight:650;
    line-height:1.22;
    letter-spacing:-.01em;
  }
  .hero-signal-card span{
    margin-top:3px;
    color:rgba(255,255,255,.64);
    font-size:.69rem;
    line-height:1.3;
  }
  .hero-signal-card--primary{
    width:214px;
    min-height:84px;
    padding:12px 16px;
    background:rgba(6,18,39,.30);
  }
  .hero-signal-card--primary small{
    margin-bottom:2px;
    color:rgba(255,255,255,.64);
    font-size:.70rem;
    font-weight:750;
    letter-spacing:.12em;
  }
  .hero-signal-card--primary strong{
    font-size:1.42rem;
    font-weight:720;
  }
  .hero-signal-card:not(.hero-signal-card--primary):before{
    content:"";
    position:absolute;
    top:50%;
    left:-14px;
    width:7px;
    height:7px;
    border-radius:50%;
    background:rgba(202,219,239,.48);
    box-shadow:0 0 0 3px rgba(6,18,39,.16);
    transform:translateY(-50%);
  }
  .hero-signal-card:not(.hero-signal-card--primary){
    position:relative;
  }
}

/* Version 89: brighten only the desktop video's right side while preserving copy contrast and cards. */
@media(width >= 900px){
  .hero:before{
    background:
      linear-gradient(90deg,rgba(3,15,38,.98) 0%,rgba(4,22,52,.91) 36%,rgba(4,24,55,.36) 63%,rgba(4,22,50,.08) 100%),
      linear-gradient(180deg,rgba(4,18,43,.08) 48%,rgba(4,18,43,.55) 100%);
  }
}

/* Version 90 homepage comparison: restore the earlier, simpler horizontal feature selector.
   /home-2 keeps the later left-rail showcase for direct comparison. */
@media(width >= 900px){
  .home-primary .platform-showcase{display:block}
  .home-primary .platform-showcase .feature-tabs{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:10px;
    margin:0 0 28px;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
  }
  .home-primary .platform-showcase .feature-tabs button{
    width:auto;
    min-height:0;
    display:block;
    padding:11px 18px;
    text-align:center;
    border:1px solid #cfdcd9;
    border-radius:999px;
    background:rgba(255,255,255,.82);
    color:#52656d;
  }
  .home-primary .platform-showcase .feature-tabs button:hover{
    border-color:#9db5c4;
    background:#fff;
    color:var(--navy);
  }
  .home-primary .platform-showcase .feature-tabs button[aria-selected="true"]{
    border-color:var(--navy);
    background:var(--navy);
    color:#fff;
    box-shadow:0 9px 22px rgba(7,27,62,.16);
  }
  .home-primary .platform-showcase .tab-number,
  .home-primary .platform-showcase .tab-label small{display:none}
  .home-primary .platform-showcase .tab-label{font-size:.88rem}
  .home-primary .platform-showcase .tab-panel{
    min-height:0;
    grid-template-columns:.82fr 1.18fr;
    gap:48px;
    padding:50px;
    border-radius:24px;
  }
}

/* Version 90: reveal more of the desktop video on the right without changing the cards or left-side copy contrast. */
@media(width >= 900px){
  .hero:before{
    background:
      linear-gradient(90deg,rgba(3,15,38,.98) 0%,rgba(4,22,52,.91) 36%,rgba(4,24,55,.29) 63%,rgba(4,22,50,.02) 100%),
      linear-gradient(180deg,rgba(4,18,43,.06) 48%,rgba(4,18,43,.40) 100%);
  }
}

/* Version 93: consistent hero messaging, with independent phone and tablet compositions. */
@media(width < 600px){
  .mobile-hero-copy h1{max-width:34rem;font-size:clamp(2.5rem,10.5vw,3.8rem);line-height:1.06}
  .mobile-hero-copy h1 em{margin-top:.3em;line-height:1.05}
  .mobile-hero-copy .eyebrow{font-size:clamp(.75rem,2.2vw,.82rem);line-height:1.5;letter-spacing:.1em}
  .mobile-hero-copy>p.mobile-hero-lede{max-width:34rem;margin:0 auto;font-size:clamp(1rem,2.8vw,1.08rem);line-height:1.6;color:#cbdced}
  .mobile-hero-copy>p.mobile-hero-recognition{max-width:30rem;margin:0 auto 2rem;font-size:clamp(.9rem,2.5vw,1rem);line-height:1.6;color:#d5e1f0}
  .mobile-hero-actions .button{max-width:100%;white-space:normal;text-align:center}
}
@media(width >= 600px) and (width < 1200px), (width >= 600px) and (width < 1400px) and (orientation:portrait) and (pointer:coarse){
  .hero{padding:150px 0 80px;min-height:0}
  .hero:before{display:block;background:linear-gradient(90deg,rgba(3,15,38,.94),rgba(4,22,52,.78) 65%,rgba(4,22,50,.55))}
  .hero .mobile-hero{display:none}
  .hero .hero-grid{display:block;min-height:0;width:calc(100% - 64px)}
  .hero-grid .hero-copy{width:100%;max-width:760px;padding:0;transform:none}
  .hero-grid .hero-copy .eyebrow{font-size:var(--type-eyebrow-fluid);line-height:1.5;letter-spacing:.1em;color:#f7eee0}
  .hero-grid .hero-copy .eyebrow span{display:none}
  .hero-grid .hero-copy h1{font-size:clamp(3.2rem,6.5vw,4.8rem);line-height:1.06;margin:24px 0}
  .hero-grid .hero-title-lead{display:block;font-size:1em}
  .hero-grid .hero-title-lead br{display:block}
  .hero-grid .hero-copy h1 em{display:block;margin-top:.25em;font-size:1.08em;line-height:1.06}
  .hero-grid .hero-copy h1 em span{display:block;white-space:nowrap}
  .hero-grid .hero-lede{max-width:38rem;font-size:clamp(1.08rem,2vw,1.35rem);line-height:1.6}
  .hero-grid .hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:24px;margin:32px 0}
  .hero-grid .hero-actions .button{white-space:normal;text-align:center;max-width:100%}
  .hero-grid .hero-recognition{max-width:38rem;margin:30px 0 0;font-size:var(--type-positioning-fluid);line-height:1.6}
  .hero .hero-signal-stack{display:none}
}

/* Version 95: tablet video, one contrast layer, and intentional four-line title. */
@media(width >= 600px) and (width < 1400px){
  .hero{background:#061632 url("assets/bridal-beauty-hero.png") 56% center/cover no-repeat}
  .hero .hero-video{position:absolute;inset:0;z-index:0;display:block;width:100%;height:100%;object-fit:cover;object-position:56% center}
  .hero:before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;display:block;background:linear-gradient(90deg,rgba(3,15,38,.9) 0%,rgba(4,22,52,.78) 38%,rgba(4,24,55,.35) 72%,rgba(4,22,50,.12) 100%),linear-gradient(180deg,transparent 55%,rgba(4,18,43,.35) 100%)}
  .hero .hero-grid{position:relative;z-index:2}
}
@media(width >= 600px) and (width < 1200px), (width >= 600px) and (width < 1400px) and (orientation:portrait) and (pointer:coarse){
  .hero-grid .hero-copy{max-width:680px}
  .hero-grid .hero-copy h1{font-size:clamp(2.8rem,5.8vw,4.6rem);line-height:1.04}
  .hero-grid .hero-lede,.hero-grid .hero-recognition{max-width:32rem}
}
@media(width >= 600px) and (width < 1200px) and (orientation:landscape){
  .hero{padding-top:120px;padding-bottom:96px}
}
@media(prefers-reduced-motion:reduce){.hero .hero-video{display:none}}

/* Version 96: restore the timeline in the existing landscape tablet range. */
@media(width >= 900px) and (width < 1200px) and (orientation:landscape){
  .hero .hero-grid{display:grid;grid-template-columns:minmax(0,1fr) 200px;column-gap:32px;align-items:center}
  .hero-grid .hero-copy{width:100%;min-width:0}
  .hero .hero-signal-stack{position:relative;inset:auto;display:flex;align-self:center;width:200px;gap:8px}
  .hero .hero-signal-card{width:174px}
  .hero .hero-signal-card--primary{width:200px}
}

/* Version 97: mobile copy alignment; preserve the approved image area. */
@media(width < 600px){
  .mobile-hero-copy .eyebrow{color:#f7eee0;font-size:clamp(.75rem,2.2vw,.82rem);font-weight:800;letter-spacing:.1em;line-height:1.5}
  .mobile-hero-copy .eyebrow span{display:none}
  .mobile-hero-copy h1{margin:20px auto;font-size:clamp(2rem,9.5vw,3.5rem);line-height:1.04}
  .mobile-hero-copy h1 .mobile-title-line{display:block}
  .mobile-hero-copy h1 em{margin-top:.25em;line-height:1.06}
  .mobile-hero-copy>p.mobile-hero-lede{max-width:32rem;line-height:1.55}
  .mobile-hero-actions{margin:24px 0 28px}
  .site-version{position:static;display:table;margin:16px 12px 16px auto}
}

/* Version 98: align only the mobile hero introduction; keep image and CTA composition. */
@media(width < 600px){
  .mobile-hero-copy .eyebrow,
  .mobile-hero-copy h1,
  .mobile-hero-copy>p.mobile-hero-lede{
    width:calc(100vw - 48px);
    max-width:100%;
    margin-inline:auto;
    text-align:left;
  }
  .mobile-hero-copy .eyebrow{justify-content:flex-start}
}

/* Version 99: lift mobile content ~30px and independently scale headline styles. */
@media(width < 600px){
  .mobile-hero-copy{padding-top:195px}
  .mobile-hero-copy h1{font-size:clamp(2.18rem,10.355vw,3.815rem)}
  .mobile-hero-copy h1 em{font-size:clamp(2.12rem,10.07vw,3.71rem)}
}

/* Version 100: stronger mobile headlines and a continuous navy media fade. */
@media(width < 600px){
  .mobile-hero-copy h1{font-size:clamp(2.3544rem,11.1834vw,4.1202rem)}
  .mobile-hero-copy h1 em{font-size:clamp(2.226rem,10.5735vw,3.8955rem)}
  .hero{background:#061632}
  .mobile-context-photo:after{
    background:
      linear-gradient(180deg,rgba(6,22,50,.18) 0%,rgba(6,22,50,.36) 34%,rgba(6,22,50,.78) 64%,rgba(6,22,50,.86) 75%,rgba(6,22,50,.95) 85%,#061632 96%,#061632 100%),
      linear-gradient(90deg,rgba(6,22,50,.28),rgba(6,22,50,.04));
  }
}

/* Version 102: phrase-anchored editorial sweep with responsive clearance. */
.hero h1 .hero-payoff{position:relative;display:inline-block;font:inherit;color:inherit}
.hero h1 .hero-payoff:after{
  content:"";position:absolute;pointer-events:none;left:0;
  top:calc(100% + .09em);width:100%;height:.13em;
  background:url("assets/hero-payoff-underline.svg") center/100% 100% no-repeat;
}
@media(width < 600px){
  .mobile-hero-copy h1 em{color:#f7eee0;font-size:clamp(2.4486rem,11.63085vw,4.28505rem)}
}