/* HOMEPAGE-02: styles scoped to the new sections. Hero styles stay in their original files. */
.homepage-02 { scroll-behavior:smooth; }
.homepage { display:block; }
.page-section { position:relative; display:flex; align-items:center; min-height:100svh; padding:100px 64px; color:#171d4c; overflow:clip; }
.section-inner { width:100%; max-width:1240px; margin:0 auto; }
.section-heading { text-align:center; }
.section-eyebrow { color:#727da6; text-transform:uppercase; font-size:13px; font-weight:550; letter-spacing:1.3px; line-height:1.5; margin:0 0 31px; }
.section-eyebrow span { padding:0 7px; }
.section-eyebrow::after { content:''; display:block; width:38px; height:2px; background:#cfc7ff; margin:13px auto 0; }
.page-section h2 { font-size:clamp(40px,3.5vw,54px); line-height:1.12; letter-spacing:-2px; font-weight:650; }
.section-gradient { color:#7860ff; background:linear-gradient(100deg,#6885ff,#8c4fff); background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
.section-description { font-size:18px; line-height:1.65; font-weight:400; color:#7581a5; margin:22px auto 0; max-width:770px; letter-spacing:-.2px; }
.value-section { background:linear-gradient(120deg,#fff,#fafbff); }
.value-columns { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:70px; margin:70px auto 0; max-width:1150px; text-align:center; }
.value-columns article { min-width:0; }
.section-icon { width:88px; height:88px; background:#f1efff; color:#674aff; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.section-icon svg { width:39px; height:39px; stroke-width:1.7; }
.value-columns .section-icon { margin:0 auto 25px; }
.page-section h3 { font-size:20px; line-height:1.35; font-weight:600; letter-spacing:-.55px; }
.value-columns p,.trust-items p { color:#7884a8; font-size:17px; line-height:1.65; margin-top:12px; letter-spacing:-.15px; }
.advantage-section { background:radial-gradient(ellipse at 90% 12%,#e9e2ff90,transparent 60%),linear-gradient(125deg,#f6f3ff,#f2f1ff 65%,#f6f3ff); }
.advantage-section .section-inner { max-width:1260px; }
.creative-gallery { display:grid; grid-template-columns:.83fr 30px repeat(3,1.07fr); gap:22px; align-items:start; margin-top:48px; }
.creative-gallery figure { margin:0; min-width:0; }
.source-product { align-self:start; border-radius:16px; overflow:hidden; background:#ffffffc9; box-shadow:0 12px 35px #3d376010; }
.source-photo { aspect-ratio: .81; overflow:hidden; }
.source-photo img { display:block; width:100%; height:100%; object-fit:cover; }
.source-product figcaption { padding:19px 21px 22px; }
.creative-gallery figcaption strong { display:block; font-size:15px; line-height:1.4; font-weight:550; color:#141b47; letter-spacing:-.2px; }
.creative-gallery figcaption>span { display:block; font-size:14px; line-height:1.5; color:#7d85aa; margin-top:3px; }
.creative-arrow { align-self:center; color:#ad97ff; width:30px; height:30px; margin-top:-25px; stroke-width:2; }
.creative-photo { position:relative; aspect-ratio:.87; border-radius:15px; overflow:hidden; box-shadow:0 10px 24px #46405d0c; }
.creative-photo>img { display:block; width:100%; height:100%; object-fit:cover; }
.creative-overlay { position:absolute; inset:0; padding:24px; color:#211b17; }
.creative-brand { font-size:12px; letter-spacing:4px; }
.creative-overlay p { font-family:Georgia,'Times New Roman',serif; font-size:clamp(21px,1.9vw,28px); line-height:1.02; margin-top:30px; max-width:90%; letter-spacing:-.8px; }
.creative-shop { display:inline-flex; gap:10px; align-items:center; margin-top:19px; padding:9px 13px; border-radius:7px; font-size:10px; background:#372719; color:#fff; }
.fresh-direction .creative-overlay,.warm-direction .creative-overlay { color:#fff; }
.fresh-direction .creative-shop { color:#282c42; background:#f5f8ff; }
.warm-direction .creative-shop { color:#493021; background:#fff2e2; }
.creative-direction figcaption { padding:17px 4px 0; }
.illustrative-note { text-align:center; color:#8686a4; font-size:11px; line-height:1.5; letter-spacing:.1px; margin:27px 0 0; }
.trust-section { background:linear-gradient(115deg,#fff,#fafbff); }
.trust-layout { display:grid; grid-template-columns:.85fr 1.15fr; align-items:center; gap:88px; }
.trust-heading .section-eyebrow::after { margin-left:0; }
.trust-heading h2 { font-size:clamp(44px,4vw,60px); }
.trust-heading .section-description { max-width:440px; font-size:20px; line-height:1.6; margin-left:0; }
.trust-items { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:50px 37px; }
.trust-items article { display:flex; gap:18px; min-width:0; align-items:flex-start; }
.trust-items .section-icon { width:66px; height:66px; }
.trust-items .section-icon svg { width:29px; height:29px; }
.trust-items h3 { font-size:16px; letter-spacing:-.3px; padding-top:6px; }
.trust-items p { font-size:16px; margin-top:7px; }
.pilot-section { isolation:isolate; text-align:center; background:#10162c; color:#fff; }
.pilot-landscape { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; }
.pilot-section::before { content:''; position:absolute; inset:0; background:linear-gradient(#0d142b90,#10162c48 65%,#0a11237a); z-index:-1; }
.pilot-section .section-inner { max-width:1180px; }
.pilot-section .section-eyebrow { color:#e8e8f7; }
.pilot-section .section-eyebrow::after { background:#aea3e7; }
.pilot-section h2 { font-size:clamp(40px,3.5vw,54px); text-wrap:balance; }
.pilot-section h2>span { color:#9582ff; }
.pilot-section .section-description { color:#e6e8f3; max-width:850px; }
.pilot-cta { display:inline-flex; align-items:center; justify-content:center; gap:18px; padding:19px 29px; background:#fff; color:#151b46; border-radius:14px; font-size:18px; min-height:60px; margin-top:34px; box-shadow:0 5px 18px #00000014; transition:transform .2s,box-shadow .2s; }
.pilot-cta:hover { transform:translateY(-2px); box-shadow:0 10px 25px #0003; }
.pilot-cta svg { width:21px; height:21px; }
.site-footer { background:#0d142a; color:#d5d9e6; padding:32px 64px; }
.footer-inner { max-width:1240px; margin:auto; display:flex; align-items:center; justify-content:space-between; gap:40px; }
.footer-brand { display:flex; align-items:center; width:160px; min-height:44px; }
.footer-brand { gap:9px; font-size:18px; font-weight:650; letter-spacing:.2px; color:#fff; }
.footer-symbol { position:relative; width:35px; height:34px; flex-shrink:0; overflow:hidden; }
.footer-symbol img { position:absolute; left:0; top:3.5px; height:27px; width:auto; max-width:none; }
.site-footer nav { display:flex; align-items:center; gap:34px; flex-wrap:wrap; }
.site-footer nav a { display:flex; align-items:center; min-height:44px; font-size:14px; transition:color .2s; }
.site-footer nav a:hover { color:#a796ff; }
.footer-login { border-left:1px solid #72788d; padding-left:34px; }
.section-navigation { display:none; position:fixed; z-index:15; right:7px; top:50%; transform:translateY(-50%); }
.section-navigation a { width:44px; height:44px; display:flex; justify-content:center; align-items:center; border-radius:50%; }
.section-navigation a>span { display:block; width:6px; height:6px; background:#8b91ad99; border:1px solid #8b91ad44; border-radius:50%; transition:background .25s,transform .25s; }
.section-navigation a[aria-current="location"]>span { background:#7654ff; border-color:#7654ff; transform:scale(1.5); }
.section-navigation a:focus-visible { outline:2px solid #7955ff; outline-offset:-5px; }
.section-navigation[data-dark="true"] a>span { background:#ffffff85; border-color:#fff3; }
.section-navigation[data-dark="true"] a[aria-current="location"]>span { background:#b5a4ff; border-color:#b5a4ff; }
/* Optional soft snapping: disable with data-soft-snap="off" on the html element. */
@media(min-width:1440px) {
  /* Preserve the previously scrollbar-free approved desktop hero width. */
  .homepage-02 { scrollbar-width:none; }
  .homepage-02::-webkit-scrollbar { display:none; }
  .section-navigation { display:block; }
}
@media(min-width:1280px) and (min-height:800px) and (prefers-reduced-motion:no-preference) {
  .homepage-02:not([data-soft-snap="off"]) { scroll-snap-type:y proximity; }
  [data-page-section] { scroll-snap-align:start; scroll-snap-stop:normal; }
}
@media(prefers-reduced-motion:no-preference) {
  .reveal.is-ready.is-visible { animation:section-entrance .65s ease both; }
  @keyframes section-entrance { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:none; } }
}
@media(max-width:1279px) {
  .page-section { padding:86px 40px; }
  .creative-gallery { gap:16px; grid-template-columns:.83fr 20px repeat(3,1fr); }
  .creative-arrow { width:20px; }
  .creative-overlay { padding:18px; }
  .creative-overlay p { font-size:21px; margin-top:24px; }
  .trust-layout { gap:45px; grid-template-columns:.8fr 1.2fr; }
  .trust-items { gap:35px 24px; }
  .trust-items article { gap:13px; }
  .trust-items .section-icon { width:52px; height:52px; }
}
@media(max-width:1023px) {
  .page-section { min-height:0; padding:88px 36px; }
  .page-section h2 { font-size:42px; }
  .value-columns { gap:28px; margin-top:52px; }
  .value-columns p { font-size:16px; }
  .page-section h3 { font-size:18px; }
  .section-icon { width:72px; height:72px; }
  .creative-gallery { grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px 18px; margin-top:40px; }
  .source-product { grid-column:1/-1; display:flex; align-items:center; justify-self:center; width:300px; }
  .source-photo { width:125px; flex-shrink:0; aspect-ratio:.85; }
  .source-product figcaption { padding:20px; }
  .creative-arrow { display:none; }
  .creative-photo { aspect-ratio:.77; }
  .creative-overlay { padding:16px; }
  .creative-overlay p { font-size:23px; }
  .creative-gallery figcaption strong { font-size:13px; }
  .creative-gallery figcaption>span { font-size:13px; }
  .trust-layout { grid-template-columns:1fr; gap:44px; }
  .trust-heading { max-width:620px; }
  .trust-heading .section-description { max-width:600px; }
  .trust-items { gap:32px 40px; }
  .trust-items h3 { font-size:16px; }
  .pilot-section { min-height:660px; }
  .footer-inner { flex-direction:column; gap:20px; }
  .site-footer { padding:30px 36px; }
  .site-footer nav { justify-content:center; gap:22px; }
  .footer-login { padding-left:22px; }
}
@media(max-width:767px) {
  .page-section { padding:72px 24px; }
  .section-eyebrow { font-size:11px; margin-bottom:25px; }
  .page-section h2 { font-size:clamp(30px,8vw,42px); letter-spacing:-1.2px; }
  .section-description { font-size:16px; line-height:1.65; margin-top:20px; }
  .desktop-break { display:none; }
  .value-columns { grid-template-columns:1fr; gap:38px; margin-top:44px; }
  .value-columns article { max-width:340px; margin:auto; }
  .value-columns .section-icon { margin-bottom:18px; }
  .value-columns p { margin-top:10px; }
  .creative-gallery { grid-template-columns:1fr; gap:32px; }
  .source-product { grid-column:auto; width:100%; max-width:340px; }
  .creative-direction { width:100%; max-width:340px; justify-self:center; }
  .creative-photo { aspect-ratio:.87; }
  .creative-overlay { padding:24px; }
  .creative-overlay p { font-size:clamp(23px,7vw,30px); margin-top:28px; }
  .creative-brand { font-size:12px; }
  .creative-shop { font-size:11px; padding:10px 14px; }
  .creative-gallery figcaption strong { font-size:15px; }
  .creative-gallery figcaption>span { font-size:14px; }
  .illustrative-note { margin-top:26px; font-size:11px; }
  .trust-heading .section-description { font-size:17px; }
  .trust-items { grid-template-columns:1fr; gap:28px; }
  .trust-items article { gap:17px; }
  .trust-items h3 { font-size:16px; }
  .trust-items p { font-size:15px; }
  .trust-items .section-icon { width:56px; height:56px; }
  .pilot-section { min-height:600px; }
  .pilot-section h2 { font-size:36px; }
  .pilot-cta { font-size:16px; padding:17px 23px; min-height:56px; }
  .site-footer { padding:30px 24px; }
  .site-footer nav { gap:8px 24px; }
  .footer-login { border:0; padding-left:0; }
}
@media(prefers-reduced-motion:reduce) {
  .homepage-02 { scroll-behavior:auto; scroll-snap-type:none; }
  .reveal { opacity:1; transform:none; }
  .pilot-cta:hover { transform:none; }
}
/* Leave the final section unsnapped so its short footer is always reachable. */
.pilot-section { scroll-snap-align:none; }

/* Viewport-height correction: follow the visible browser area, including resizes. */
.homepage-02 { --page-viewport-height:100vh; }
@supports(height:100dvh) { .homepage-02 { --page-viewport-height:100dvh; } }
@media(min-width:1024px) {
  .page-section { min-height:var(--page-viewport-height); padding-block:clamp(40px,7dvh,100px); }
  .creative-gallery { max-width:min(100%,max(850px,calc((var(--page-viewport-height) - 500px)*3.5))); margin-inline:auto; }
}
@media(min-width:1024px) and (max-width:1439px) and (max-height:899px) {
  .artboard { min-height:var(--page-viewport-height); padding-bottom:32px; }
  .navigation { margin-bottom:clamp(20px,calc(var(--page-viewport-height) - 700px),76px); }
}
@media(min-width:1440px) and (max-height:899px) {
  .desktop-viewport { height:var(--page-viewport-height); }
  .artboard {
    --hero-extra-height:0px;
    height:1045px;
    left:calc((100% - 1672px*var(--compact-hero-scale,.861244019139))/2);
    transform:scale(var(--compact-hero-scale,.861244019139));
  }
  .hero-background {
    width:calc(100vw / var(--compact-hero-scale,.861244019139));
    height:1045px;
    left:calc((1672px - 100vw / var(--compact-hero-scale,.861244019139))/2);
  }
  .hero-copy { top:157px; }
  .product-story { top:0; }
}
@media(min-width:1024px) {
  .creative-gallery { margin-top:clamp(24px,4dvh,48px); }
  .illustrative-note { margin-top:clamp(16px,2dvh,27px); }
}
@media(min-width:1024px) {
  .advantage-section { padding-block:clamp(36px,6dvh,100px); }
}
@media(min-width:1440px) {
  .desktop-viewport { height:var(--page-viewport-height); }
  .artboard { --hero-extra-height:max(0px,calc(var(--page-viewport-height) - 900px)); }
}
@media(min-width:1024px) {
  .creative-photo { container-type:inline-size; }
  .creative-overlay { padding:clamp(14px,7cqw,24px); }
  .creative-overlay p { font-size:clamp(18px,10cqw,28px); margin-top:clamp(18px,10cqw,30px); }
}