/* Flamingo keeps the approved immersive opening while using the consumer
   brand's pink chapter as its only route-specific surface colour. */
/* Temporary local preview fonts. Replace with licensed web files before public release. */
@font-face { font-family:"Flamingo Adieu Preview"; src:url("../fonts/flamingo-preview/adieu-black-900-preview.ttf") format("truetype"); font-weight:900; font-style:normal; font-display:swap; }
@font-face { font-family:"Flamingo GT America Trial"; src:url("../fonts/flamingo-preview/gt-america-standard-regular-400-trial.otf") format("opentype"); font-weight:400; font-style:normal; font-display:swap; }

.flamingo-page { --flamingo-pink:#f7cee1; --flamingo-white:#fff; --flamingo-dark:#142a23; background:var(--flamingo-white); }
.flamingo-page main { --flamingo-display:"Flamingo Adieu Preview","Parkinsans",sans-serif; --flamingo-body:"Flamingo GT America Trial","Hanken Grotesk",sans-serif; padding-top:0; overflow:clip; color:var(--flamingo-dark); font-family:var(--flamingo-body); font-weight:400; font-synthesis:none; }
.flamingo-page .site-header.is-solid { background:color-mix(in srgb,var(--flamingo-white) 92%,transparent); }
.flamingo-page main h2,.flamingo-page main h3,.flamingo-page main p { margin-top:0; }
.flamingo-page main h2 { margin-bottom:0; font-family:var(--flamingo-display); font-size:clamp(42px,6.4vw,88px); font-weight:900; letter-spacing:.065em; line-height:.95; text-transform:uppercase; text-wrap:balance; }
.flamingo-page main h2 strong { font-weight:900; }
.flamingo-page main p { letter-spacing:.01em; }

/* Hero */
.flamingo-hero { --hero-logo-y:0px; position:relative; display:grid; min-height:max(680px,100svh); place-items:center; overflow:hidden; isolation:isolate; background:var(--ink-deep); }
.flamingo-hero__media { position:absolute; inset:-4%; width:108%; height:108%; object-fit:cover; object-position:center 52%; transform:scale(1.015); }
.flamingo-hero__shade { position:absolute; inset:0; background:linear-gradient(180deg,rgba(5,24,19,.44) 0,rgba(5,24,19,.08) 34%,rgba(5,24,19,.14) 68%,rgba(5,24,19,.35) 100%); }
.flamingo-hero__logo { position:relative; z-index:1; width:min(46.75vw,527px); margin:0; transform:translate3d(0,var(--hero-logo-y),0); will-change:transform; }
.flamingo-hero__logo img { display:block; width:100%; height:auto; filter:drop-shadow(0 18px 34px rgba(0,0,0,.15)); }

/* Intro and continuous packaging carousel */
.flamingo-intro { position:relative; z-index:2; padding:clamp(104px,12vw,176px) 0 clamp(92px,10vw,148px); background:var(--flamingo-pink); }
.flamingo-intro__copy { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:24px; align-items:end; margin-bottom:clamp(72px,8vw,116px); }
.flamingo-intro__copy h2 { grid-column:1/8; }
.flamingo-intro__text { grid-column:9/-1; max-width:31ch; padding-bottom:8px; }
.flamingo-intro__label { margin-bottom:24px; font:900 16px/1.25 var(--flamingo-display); letter-spacing:.08em; text-transform:uppercase; }
.flamingo-intro__text p:last-child { margin-bottom:0; font-size:clamp(18px,1.55vw,23px); line-height:1.45; text-wrap:pretty; }
.flamingo-carousel { display:flex; gap:clamp(14px,1.7vw,26px); width:100%; overflow-x:auto; padding-inline:clamp(16px,3vw,48px); scrollbar-width:none; overscroll-behavior-x:contain; cursor:grab; touch-action:pan-x; }
.flamingo-carousel::-webkit-scrollbar { display:none; }
.flamingo-carousel:active { cursor:grabbing; }
.flamingo-carousel:focus-visible { outline:3px solid var(--ink-deep); outline-offset:-4px; }
.flamingo-carousel__slide { flex:0 0 clamp(310px,39vw,560px); aspect-ratio:4/3; margin:0; overflow:hidden; border-radius:24px; background:#e6c1d2; }
.flamingo-carousel__slide img { display:block; width:100%; height:100%; object-fit:cover; }

/* White map chapter held in place while the pink chapter rises over it. */
.flamingo-origin-stage { position:relative; z-index:1; min-height:220svh; background:var(--flamingo-white); }
.flamingo-origin { position:sticky; top:0; display:grid; min-height:100svh; align-items:center; overflow:hidden; background:var(--flamingo-white); }
.flamingo-origin__inner { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); grid-template-rows:auto auto; column-gap:24px; row-gap:clamp(72px,8vh,92px); min-height:100svh; align-content:center; align-items:center; box-sizing:border-box; padding-block:clamp(108px,14vh,132px) clamp(60px,8vh,86px); }
.flamingo-page main .flamingo-origin h2 { grid-column:1/7; grid-row:1; align-self:start; font-size:clamp(34px,5.12vw,70px); }
.flamingo-map { position:relative; grid-column:4/-1; grid-row:1/3; align-self:center; justify-self:start; aspect-ratio:2.65; width:118%; margin:clamp(-72px,-5vw,-36px) 0 0; }
.flamingo-map__dots { position:absolute; inset:0; background:var(--flamingo-dark); -webkit-mask:url('../assets/network-world-dots.svg') center/100% 100% no-repeat; mask:url('../assets/network-world-dots.svg') center/100% 100% no-repeat; opacity:.82; }
.flamingo-map svg { position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.flamingo-map__route { fill:none; stroke:url(#flamingo-route-gradient); stroke-width:.46; stroke-linecap:round; stroke-dasharray:100; stroke-dashoffset:0; }
.flamingo-map__marker circle:first-child { fill:var(--orange-action); opacity:.2; }
.flamingo-map__marker circle:last-child { fill:var(--orange-action); }
.flamingo-map.is-active .flamingo-map__route { stroke-dashoffset:100; opacity:0; animation-duration:8s; animation-timing-function:linear; animation-iteration-count:infinite; }
.flamingo-map.is-active .flamingo-map__route--1 { animation-name:flamingo-route-1; }
.flamingo-map.is-active .flamingo-map__route--2 { animation-name:flamingo-route-2; }
.flamingo-map.is-active .flamingo-map__route--3 { animation-name:flamingo-route-3; }
.flamingo-map.is-active .flamingo-map__route--4 { animation-name:flamingo-route-4; }
.flamingo-map.is-active .flamingo-map__marker circle:first-child { animation:flamingo-pulse 2.8s ease-in-out infinite; }
.flamingo-origin__copy { grid-column:1/5; grid-row:2; align-self:start; display:grid; gap:20px; }
.flamingo-origin__copy p { max-width:33ch; margin-bottom:0; font-size:clamp(17px,1.3vw,20px); line-height:1.5; text-wrap:pretty; }
@keyframes flamingo-route-1 { 0% { opacity:0; stroke-dashoffset:100; } 2% { opacity:1; } 20%,99.9% { opacity:1; stroke-dashoffset:0; } 100% { opacity:0; stroke-dashoffset:100; } }
@keyframes flamingo-route-2 { 0%,25% { opacity:0; stroke-dashoffset:100; } 27% { opacity:1; } 45%,99.9% { opacity:1; stroke-dashoffset:0; } 100% { opacity:0; stroke-dashoffset:100; } }
@keyframes flamingo-route-3 { 0%,50% { opacity:0; stroke-dashoffset:100; } 52% { opacity:1; } 70%,99.9% { opacity:1; stroke-dashoffset:0; } 100% { opacity:0; stroke-dashoffset:100; } }
@keyframes flamingo-route-4 { 0%,75% { opacity:0; stroke-dashoffset:100; } 77% { opacity:1; } 95%,99.9% { opacity:1; stroke-dashoffset:0; } 100% { opacity:0; stroke-dashoffset:100; } }
@keyframes flamingo-pulse { 0%,100% { opacity:.12; transform:scale(.8); } 50% { opacity:.4; transform:scale(1.15); } }

/* Products */
.flamingo-products { position:relative; z-index:3; margin-top:-80svh; padding:clamp(116px,12vw,180px) 0 clamp(120px,14vw,210px); border-radius:32px 32px 0 0; background:var(--flamingo-pink); }
.flamingo-products__logo { width:min(48vw,520px); margin:0 auto clamp(100px,13vw,190px)!important; }
.flamingo-products__logo img { display:block; width:100%; height:auto; }
.flamingo-products__list { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:clamp(80px,9vw,150px) 24px; align-items:center; }
.flamingo-product-card { --float-y:0px; transform:translate3d(0,var(--float-y),0); will-change:transform; }
.flamingo-product-card--left { grid-column:1/7; }
.flamingo-product-card--right { grid-column:7/-1; }
.flamingo-product-card--last { margin-top:clamp(30px,5vw,72px); }
.flamingo-product-card figure { aspect-ratio:1.16; margin:0 0 20px; overflow:hidden; border-radius:24px; background:#e3bdce; }
.flamingo-product-card img { display:block; width:100%; height:100%; object-fit:cover; }
.flamingo-product-card--last figure { aspect-ratio:1.16; }
.flamingo-product-card h3 { margin-bottom:0; color:#000; font:900 clamp(21px,2.4vw,34px)/.95 var(--flamingo-display); letter-spacing:.06em; text-transform:uppercase; }
.flamingo-products__badge { --float-y:0px; display:block; align-self:center; width:clamp(150px,19vw,250px); height:auto; transform:translate3d(0,var(--float-y),0); will-change:transform; }
.flamingo-products__badge--ready { grid-column:9/12; grid-row:1; justify-self:center; }
.flamingo-products__badge--tree { grid-column:2/5; grid-row:2; justify-self:center; }
.flamingo-enhanced [data-flamingo-float] { opacity:0; transform:translate3d(0,calc(110px + var(--float-y,0px)),0); transition:opacity .72s cubic-bezier(.22,1,.36,1),transform 1.05s cubic-bezier(.22,1,.36,1); }
.flamingo-enhanced [data-flamingo-float].is-visible { opacity:1; transform:translate3d(0,var(--float-y,0px),0); }

/* Quality and independently supplied credential marks */
.flamingo-quality-stage { position:relative; z-index:4; min-height:200svh; background:var(--flamingo-white); }
.flamingo-quality { position:sticky; top:0; display:grid; min-height:100svh; align-items:center; overflow:hidden; background:var(--flamingo-white); }
.flamingo-quality__inner { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:24px; align-items:stretch; padding-block:clamp(80px,8vw,122px); }
.flamingo-quality__content { grid-column:1/7; display:flex; min-width:0; flex-direction:column; justify-content:space-between; padding-right:clamp(16px,3vw,54px); }
.flamingo-page main .flamingo-quality__copy h2 { font-size:clamp(34px,5.12vw,70px); }
.flamingo-quality__copy p { max-width:32ch; margin:clamp(18px,2vw,28px) 0 0; font-size:clamp(18px,1.45vw,21px); line-height:1.5; }
.flamingo-certifications { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:clamp(20px,2.6vw,42px) clamp(16px,2vw,30px); align-items:center; margin:clamp(58px,7vw,100px) 0 0; padding:0; list-style:none; }
.flamingo-certifications li { display:grid; min-width:0; min-height:72px; place-items:center; }
.flamingo-certifications img { display:block; max-width:100%; max-height:84px; object-fit:contain; }
.flamingo-quality__gallery { position:relative; grid-column:7/-1; min-height:min(72svh,760px); overflow:hidden; border-radius:28px; background:#e8e1dc; }
.flamingo-quality__gallery img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transform:scale(1.025); transition:opacity 1.15s ease,transform 5s ease; }
.flamingo-quality__gallery img.is-active { z-index:1; opacity:1; transform:scale(1); }

/* Pink chapter covers quality while the Mux film expands with scroll. */
.flamingo-film { --film-width:52vw; --film-height:62svh; --film-radius:28px; position:relative; z-index:6; min-height:190svh; margin-top:-70svh; background:var(--flamingo-pink); }
.flamingo-film__sticky { position:sticky; top:0; display:grid; width:100%; height:100svh; place-items:center; overflow:hidden; }
.flamingo-film__frame { position:relative; width:var(--film-width); height:var(--film-height); overflow:hidden; border-radius:var(--film-radius); background:var(--flamingo-dark); will-change:width,height,border-radius; }
.flamingo-film__poster { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:cover; }
.flamingo-film iframe { position:absolute; z-index:1; top:50%; left:50%; display:block; width:auto; min-width:100%; height:100%; min-height:100%; border:0; aspect-ratio:16/9; opacity:0; transform:translate(-50%,-50%); transition:opacity .5s ease; pointer-events:none; }
.flamingo-film.is-playing iframe { opacity:1; }

/* Shared closing CTA composition */
.flamingo-contact { position:relative; z-index:7; padding-block:clamp(84px,10vw,150px); color:var(--flamingo-white); background:var(--flamingo-dark); }
.flamingo-contact__inner { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:24px; align-items:end; }
.flamingo-page main .flamingo-contact h2 { grid-column:1/8; color:var(--paper); font-family:var(--flamingo-display); font-size:clamp(34px,5.12vw,70px); font-weight:900; letter-spacing:.065em; line-height:.95; text-transform:uppercase; }
.flamingo-contact__inner>div { grid-column:9/-1; }
.flamingo-contact p { max-width:31ch; margin:0 0 28px; font:400 clamp(17px,1.3vw,20px)/1.5 "Hanken Grotesk",sans-serif; }
.flamingo-contact .page-button { font-family:"Hanken Grotesk",sans-serif; font-weight:600; }
.flamingo-page .site-footer { position:relative; z-index:7; margin-top:0; background:var(--flamingo-dark); }

@media (max-width:1040px) {
  .flamingo-page main .flamingo-origin h2 { grid-column:1/7; }
  .flamingo-origin__copy { grid-column:1/6; }
  .flamingo-map { grid-column:5/-1; width:125%; }
  .flamingo-certifications { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .flamingo-page main .flamingo-contact h2 { font-size:clamp(32px,4.3vw,46px); letter-spacing:.05em; }
}

@media (min-width:1041px) {
  .flamingo-certifications { grid-template-columns:repeat(8,minmax(0,1fr)); column-gap:clamp(12px,1.4vw,22px); }
  .flamingo-certifications li { grid-column:span 2; }
  .flamingo-certifications li:nth-child(5) { grid-column:2/span 2; }
  .flamingo-certifications li:nth-child(6) { grid-column:4/span 2; }
  .flamingo-certifications li:nth-child(7) { grid-column:6/span 2; }
}

/* Rotated phones have desktop width but not desktop height. Keep the logo and
   every chapter readable, while retaining carousel, map and film motion. */
@media (min-width:801px) and (max-height:500px) {
  .flamingo-hero { min-height:100svh; }
  .flamingo-hero__logo { width:min(30vw,320px); }
  .flamingo-origin-stage,.flamingo-quality-stage { min-height:auto; }
  .flamingo-origin,.flamingo-quality { position:relative; min-height:0; }
  .flamingo-origin__inner { row-gap:48px; min-height:0; padding-block:96px 72px; }
  .flamingo-products { margin-top:0; }
  .flamingo-film { min-height:150svh; margin-top:0; }
}

@media (max-width:800px) {
  .flamingo-page main h2 { font-size:clamp(38px,11.8vw,60px); line-height:.95; }
  .flamingo-hero { min-height:max(620px,100svh); }
  .flamingo-hero__media { inset:0; width:100%; height:100%; object-position:57% center; }
  .flamingo-hero__shade { background:linear-gradient(180deg,rgba(5,24,19,.45) 0,rgba(5,24,19,.04) 38%,rgba(5,24,19,.25) 100%); }
  .flamingo-hero__logo { width:min(74.8vw,476px); }
  .flamingo-intro { padding-block:80px 88px; }
  .flamingo-intro__copy { grid-template-columns:1fr; gap:44px; margin-bottom:64px; }
  .flamingo-intro__copy h2,.flamingo-intro__text { grid-column:1; }
  .flamingo-intro__text { max-width:31ch; padding:0; }
  .flamingo-intro__label { margin-bottom:20px; font-size:13px; }
  .flamingo-carousel { gap:12px; padding-inline:16px; }
  .flamingo-carousel__slide { flex-basis:min(82vw,400px); border-radius:18px; }
  .flamingo-origin-stage { min-height:auto; }
  .flamingo-origin { position:relative; min-height:0; }
  .flamingo-origin__inner { grid-template-columns:1fr; grid-template-rows:auto; gap:52px; min-height:0; padding-block:88px 116px; }
  .flamingo-page main .flamingo-origin h2,.flamingo-map,.flamingo-origin__copy { grid-column:1; grid-row:auto; }
  .flamingo-page main .flamingo-origin h2 { font-size:clamp(30px,9.4vw,48px); }
  .flamingo-page main .flamingo-quality__copy h2 { font-size:clamp(30px,9.4vw,48px); }
  .flamingo-page main .flamingo-contact h2 { font-size:clamp(28px,8.2vw,40px); letter-spacing:.045em; }
  .flamingo-map { aspect-ratio:1.65; width:135%; margin:0 0 0 -18%; }
  .flamingo-origin__copy { gap:18px; }
  .flamingo-origin__copy p { max-width:34ch; font-size:17px; }
  .flamingo-products { margin-top:0; padding-block:90px 112px; border-radius:26px 26px 0 0; }
  .flamingo-products__logo { width:min(88vw,440px); margin-bottom:88px!important; }
  .flamingo-products__list { grid-template-columns:1fr; gap:72px; }
  .flamingo-product-card--left,.flamingo-product-card--right,.flamingo-products__badge--ready,.flamingo-products__badge--tree { grid-column:1; grid-row:auto; }
  .flamingo-product-card { width:92%; }
  .flamingo-product-card--right { justify-self:end; }
  .flamingo-product-card figure { margin-bottom:16px; border-radius:20px; }
  .flamingo-products__badge { width:min(40vw,180px); justify-self:center; }
  .flamingo-quality-stage { min-height:auto; }
  .flamingo-quality { position:relative; min-height:0; }
  .flamingo-quality__inner { grid-template-columns:1fr; gap:68px; padding-block:88px 116px; }
  .flamingo-quality__content,.flamingo-quality__gallery { grid-column:1; }
  .flamingo-quality__content { padding-right:0; }
  .flamingo-certifications { grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:64px; }
  .flamingo-certifications img { max-height:66px; }
  .flamingo-quality__gallery { min-height:76svh; border-radius:22px; }
  .flamingo-film { --film-width:84vw; --film-height:56svh; min-height:170svh; margin-top:0; }
  .flamingo-contact__inner { grid-template-columns:1fr; gap:34px; }
  .flamingo-page main .flamingo-contact h2,.flamingo-contact__inner>div { grid-column:1; }
}

@media (max-width:520px) {
  .flamingo-hero__logo { width:79.9vw; }
  .flamingo-certifications { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .flamingo-quality__gallery { min-height:68svh; }
}

@media (prefers-reduced-motion:reduce) {
  .flamingo-hero__logo,.flamingo-enhanced [data-flamingo-float] { opacity:1!important; transform:none!important; transition:none!important; }
  .flamingo-map.is-active .flamingo-map__route,.flamingo-map.is-active .flamingo-map__marker circle:first-child { animation:none!important; opacity:1; stroke-dashoffset:0; }
  .flamingo-quality__gallery img { transition:none; transform:none; }
  .flamingo-film { --film-width:min(84vw,900px)!important; --film-height:70svh!important; --film-radius:28px!important; min-height:100svh; }
  .flamingo-film iframe { display:none; }
}

html.motion-paused .flamingo-hero__logo,html.motion-paused [data-flamingo-float] { opacity:1!important; transform:none!important; transition:none!important; }
html.motion-paused .flamingo-map__route,html.motion-paused .flamingo-map__marker circle:first-child { animation:none!important; opacity:1; stroke-dashoffset:0; }
html.motion-paused .flamingo-film iframe { display:none; }
html.motion-paused .flamingo-film { --film-width:min(84vw,900px)!important; --film-height:70svh!important; --film-radius:28px!important; min-height:100svh; }
