/* =========================================================
   TINK HOME — FINAL QUALITY PASS
   Loaded last on every page for one consistent visual system.
   ========================================================= */

:root{
  --th-radius:28px;
  --th-radius-sm:18px;
  --th-shadow:0 24px 70px rgba(7,22,30,.12);
}

/* Unified hero language — same composition as the homepage */
.hero,
.page-hero,
.about-hero,
.contact-hero,
.product-hero,
.service-hero{
  min-height:760px !important;
  height:100svh;
  max-height:980px;
  position:relative;
  display:flex;
  align-items:center !important;
  overflow:hidden;
  background:#0b1419;
  color:#fff;
}

.product-hero-media,
.page-hero-bg,
.hero-media{
  position:absolute;
  inset:-3%;
}

.product-hero-media img,
.page-hero-bg img,
.hero-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.product-hero-media img{
  filter:brightness(.5) saturate(.83) contrast(1.02);
  transform:scale(1.04);
  animation:heroBreath 12s ease-in-out infinite alternate;
}

.product-hero-overlay{
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 58% 44%,transparent 0,rgba(4,9,12,.08) 34%,rgba(4,9,12,.7) 100%),
    linear-gradient(90deg,rgba(4,9,12,.86),rgba(4,9,12,.16) 72%),
    linear-gradient(0deg,rgba(4,9,12,.7),transparent 50%);
}

.product-hero-content{
  position:relative;
  z-index:3;
  width:100%;
  padding:94px 0 56px !important;
}

.product-kicker{margin:0}

.product-hero .hero-title,
.page-hero h1,
.contact-hero .hero-title,
.about-hero .hero-title,
.service-hero .hero-title{
  font:700 clamp(58px,8vw,116px)/.86 Manrope,sans-serif !important;
  letter-spacing:-.075em !important;
  max-width:900px !important;
  margin:25px 0 28px !important;
  text-wrap:balance;
}

.product-hero .hero-title em,
.page-hero h1 em{
  color:#82d0f6;
  font-style:italic;
  font-weight:500;
}

.product-hero-copy{
  max-width:570px;
  margin:0 0 26px;
  color:rgba(255,255,255,.74);
  font-size:14px;
  line-height:1.9;
}

.product-hero-meta{
  width:min(620px,100%);
  gap:34px;
  margin-top:24px;
  padding-top:17px;
  border-top:1px solid rgba(255,255,255,.16);
}

/* Services overview: images remain cinematic but never oversized */
.service-detail{
  min-height:0 !important;
  margin-block:18px;
}
.service-detail-image{
  min-height:0 !important;
  height:clamp(390px,42vw,560px) !important;
}
.service-detail-image img{
  width:100%;
  height:100%;
  object-fit:cover;
}

/* Repeatable gallery system: works with 1, 10, 30 or more images */
.product-section{
  padding:clamp(82px,8vw,112px) 0 !important;
}

.gallery-grid{
  display:grid !important;
  grid-template-columns:repeat(12,minmax(0,1fr)) !important;
  gap:14px !important;
  margin-top:48px !important;
}

.gallery-item,
.gallery-item-single{
  grid-column:span 6 !important;
  min-height:0 !important;
  height:clamp(290px,28vw,410px) !important;
  border-radius:var(--th-radius-sm);
  overflow:hidden;
  background:#dfe5e7;
  box-shadow:0 12px 34px rgba(7,22,30,.07);
}

.gallery-item:nth-child(6n+1),
.gallery-item:nth-child(6n+4){grid-column:span 7 !important}

.gallery-item:nth-child(6n+2),
.gallery-item:nth-child(6n+3){grid-column:span 5 !important}

.gallery-item:nth-child(6n+5),
.gallery-item:nth-child(6n+6){grid-column:span 6 !important}

.gallery-item img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .9s cubic-bezier(.16,1,.3,1),filter .5s ease;
  filter:saturate(.92) contrast(1.015);
}

.gallery-item:hover img{transform:scale(1.035)}

.gallery-item::after{
  content:"";
  position:absolute;
  inset:45% 0 0;
  background:linear-gradient(transparent,rgba(4,9,12,.4));
  pointer-events:none;
}

.gallery-number,.gallery-caption{z-index:3}

/* Videos keep a controlled footprint */
.video-layout{gap:clamp(36px,6vw,72px)}
.video-frame,
.video-frame video{
  min-height:0 !important;
  height:clamp(340px,38vw,520px) !important;
  border-radius:var(--th-radius);
}
.video-frame video{object-fit:cover}

/* CTA */
.product-cta{
  min-height:0 !important;
  height:auto !important;
  margin:18px;
  border-radius:var(--th-radius);
  overflow:hidden;
}
.product-cta-media{min-height:520px}
.product-cta-media img{
  width:100%;
  height:100%;
  object-fit:cover;
}

/* Floating WhatsApp becomes a clean icon */
.whatsapp{
  position:fixed;
  left:22px;
  bottom:22px;
  z-index:900;
  width:54px !important;
  height:54px !important;
  min-width:54px;
  padding:0 !important;
  border-radius:50% !important;
  display:grid !important;
  place-items:center;
  color:#fff !important;
  background:#20b866 !important;
  box-shadow:0 16px 38px rgba(16,143,76,.3) !important;
  border:1px solid rgba(255,255,255,.28);
  transition:transform .3s ease,box-shadow .3s ease,background .3s ease;
}
.whatsapp svg{width:25px;height:25px;display:block}
.whatsapp:hover{
  transform:translateY(-4px) scale(1.04);
  background:#18aa5a !important;
  box-shadow:0 20px 44px rgba(16,143,76,.38) !important;
}

.product-intro{gap:clamp(42px,7vw,80px)}
.product-intro-copy{max-width:510px}
.spec-card{border-radius:20px}

/* Tablet */
@media(max-width:950px){
  .hero,.page-hero,.about-hero,.contact-hero,.product-hero,.service-hero{
    min-height:680px !important;
    height:88svh;
  }
  .product-hero-content{padding:108px 0 54px !important}
  .service-detail-image{height:460px !important}
  .gallery-item,
  .gallery-item-single,
  .gallery-item:nth-child(n){
    grid-column:span 6 !important;
    height:340px !important;
  }
  .product-cta-media{min-height:470px}
}

/* Mobile */
@media(max-width:600px){
  .hero,.page-hero,.about-hero,.contact-hero,.product-hero,.service-hero{
    min-height:620px !important;
    height:86svh;
    max-height:none;
  }
  .product-hero-content{padding:112px 0 44px !important}
  .product-hero .hero-title,
  .page-hero h1,
  .contact-hero .hero-title,
  .about-hero .hero-title,
  .service-hero .hero-title{
    font-size:clamp(46px,13vw,66px) !important;
    line-height:.9 !important;
    max-width:100% !important;
    margin:20px 0 22px !important;
  }
  .product-hero-copy{font-size:13px;line-height:1.75}
  .product-hero-meta{gap:16px 24px;margin-top:18px}
  .service-detail{margin:10px}
  .service-detail-image{height:360px !important}
  .gallery-grid{
    grid-template-columns:1fr !important;
    gap:12px !important;
    margin-top:36px !important;
  }
  .gallery-item,
  .gallery-item-single,
  .gallery-item:nth-child(n){
    grid-column:1 !important;
    width:100% !important;
    height:clamp(300px,100vw,420px) !important;
    min-height:0 !important;
    border-radius:16px;
  }
  .video-frame,.video-frame video{height:340px !important}
  .product-cta{margin:10px;border-radius:20px}
  .product-cta-media{min-height:430px}
  .whatsapp{
    left:14px;
    bottom:14px;
    width:50px !important;
    height:50px !important;
    min-width:50px;
  }
  .whatsapp svg{width:23px;height:23px}
}

@media(prefers-reduced-motion:reduce){
  .product-hero-media img{animation:none!important}
}


/* =========================================================
   DELIVERY POLISH — OCT 2026
   Shared loader, homepage 4-panel hero, featured Sur Mesure,
   and deterministic scrolled-nav CTA contrast.
   ========================================================= */

/* ---------- Shared cinematic loader ---------- */
.loader{
  position:fixed !important;
  inset:0 !important;
  z-index:99999 !important;
  display:grid !important;
  place-items:center !important;
  background:#071116 !important;
  color:#fff !important;
  overflow:hidden !important;
  transition:opacity .55s ease, visibility .55s ease !important;
}
.loader::before{
  content:"";
  position:absolute;
  inset:-25%;
  background:radial-gradient(circle at 50% 45%,rgba(74,181,232,.14),transparent 34%);
  animation:loaderGlow 2.6s ease-in-out infinite alternate;
}
.loader.hide{opacity:0 !important;visibility:hidden !important;pointer-events:none !important}
.loader-stage{position:relative;z-index:2;display:flex;align-items:center;gap:34px;padding:28px}
.loader-plan{position:relative;width:104px;height:104px;border:1px solid rgba(255,255,255,.20);transform:rotate(-2deg)}
.loader-room{position:absolute;border:1px solid rgba(130,208,246,.34);background:rgba(130,208,246,.035)}
.loader-room-a{left:10px;top:10px;width:38px;height:52px}
.loader-room-b{right:10px;top:10px;width:38px;height:32px}
.loader-room-c{right:10px;bottom:10px;width:38px;height:42px}
.loader-room-d{left:10px;bottom:10px;width:38px;height:22px}
.loader-plan-line{position:absolute;background:#82d0f6;box-shadow:0 0 16px rgba(130,208,246,.42)}
.loader-plan-line-v{width:1px;height:0;left:52px;top:10px;animation:drawV .72s .08s ease forwards}
.loader-plan-line-h{height:1px;width:0;left:10px;top:68px;animation:drawH .72s .2s ease forwards}
.loader-copy{display:flex;flex-direction:column;min-width:255px}
.loader-kicker{font:700 7px Manrope,sans-serif;letter-spacing:.19em;color:#7f9aa7;margin-bottom:9px}
.loader-brand{font:700 clamp(26px,4vw,43px)/1 Manrope,sans-serif;letter-spacing:-.045em;color:#fff}
.loader-sub{margin-top:11px;font:500 9px Manrope,sans-serif;letter-spacing:.08em;color:rgba(255,255,255,.52)}
.loader-progress{position:absolute;left:0;right:0;bottom:0;height:2px;background:rgba(255,255,255,.06)}
.loader-progress i{display:block;height:100%;width:0;background:#82d0f6;animation:loaderProgress .95s cubic-bezier(.2,.7,.2,1) forwards}
@keyframes loaderProgress{to{width:100%}}
@keyframes drawV{to{height:84px}}
@keyframes drawH{to{width:84px}}
@keyframes loaderGlow{to{transform:scale(1.12);opacity:.68}}

/* ---------- Homepage four-image hero ---------- */
.home .hero-media,
body:not(.home) .hero-media.hero-media-split{inset:0 !important}
.hero .hero-media:has(.hero-panel){
  inset:0 !important;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1px;
  background:#071116;
}
.hero-panel{position:relative;overflow:hidden;min-width:0;isolation:isolate}
.hero-panel::after{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(3,8,11,.10) 35%,rgba(3,8,11,.66) 100%);
  transition:background .55s ease;
}
.hero-panel img{
  width:100% !important;height:100% !important;object-fit:cover !important;
  filter:brightness(.58) saturate(.76) !important;
  transform:scale(1.035) !important;
  animation:none !important;
  transition:transform 1.15s cubic-bezier(.2,.7,.2,1),filter .7s ease !important;
}
.hero-panel:hover img{transform:scale(1.095) !important;filter:brightness(.72) saturate(.95) !important}
.hero-panel:hover::after{background:linear-gradient(180deg,rgba(3,8,11,.02) 30%,rgba(3,8,11,.46) 100%)}
.hero-panel-label{
  position:absolute;z-index:2;left:22px;right:22px;bottom:28px;
  display:flex;align-items:center;gap:9px;
  color:rgba(255,255,255,.88);font:700 9px Manrope,sans-serif;letter-spacing:.05em;text-transform:uppercase;
  opacity:.72;transform:translateY(4px);transition:.4s ease;
}
.hero-panel-label b{font-size:7px;color:#82d0f6;letter-spacing:.12em}
.hero-panel-label em{margin-left:auto;font-style:normal;color:#82d0f6;font-size:15px}
.hero-panel:hover .hero-panel-label{opacity:1;transform:none}
.hero .hero-overlay{z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(3,8,11,.84) 0%,rgba(3,8,11,.58) 35%,rgba(3,8,11,.24) 72%,rgba(3,8,11,.36) 100%),linear-gradient(0deg,rgba(3,8,11,.62),transparent 52%) !important}
.hero .hero-frame,.hero .hero-content,.hero .hero-bottom{z-index:3}

/* ---------- Sur Mesure becomes the closing / signature card ---------- */
.service-card-featured{
  grid-column:1 / -1 !important;
  position:relative;
  background:#071116 !important;
  border-color:rgba(130,208,246,.22) !important;
  color:#fff;
  box-shadow:0 22px 65px rgba(4,18,25,.12);
}
.service-card-featured::before{
  content:"SIGNATURE TINK HOME";
  position:absolute;z-index:8;right:18px;top:18px;
  padding:8px 11px;border:1px solid rgba(130,208,246,.34);border-radius:999px;
  background:rgba(5,16,22,.52);backdrop-filter:blur(12px);
  color:#a6ddf6;font:700 7px Manrope,sans-serif;letter-spacing:.15em;
}
.service-card-featured::after{
  content:"";position:absolute;z-index:0;right:-10%;bottom:-45%;width:46%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(81,185,234,.20),transparent 67%);pointer-events:none;
}
.service-card-featured .service-image{height:390px !important}
.service-card-featured .service-image::after{
  content:"";position:absolute;inset:0;z-index:4;pointer-events:none;
  background:linear-gradient(90deg,rgba(5,14,19,.34),transparent 48%),linear-gradient(0deg,rgba(5,14,19,.32),transparent 45%);
}
.service-card-featured .service-info{position:relative;z-index:2;min-height:122px;background:linear-gradient(100deg,#071116,#0a1a22);padding:25px 26px}
.service-card-featured .service-info h3{color:#fff;font-size:25px}
.service-card-featured .service-info p{color:rgba(255,255,255,.58);max-width:610px}
.service-card-featured .service-arrow{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(130,208,246,.34);color:#82d0f6}
.service-card-featured:hover{box-shadow:0 30px 85px rgba(4,18,25,.20),0 0 0 1px rgba(130,208,246,.08)}

/* ---------- Navbar CTA: explicit contrast once navbar becomes white ---------- */
.header.scrolled .nav-links .nav-cta,
.header.scrolled .nav-links a.nav-cta,
.header.scrolled .nav-cta{
  background:#0b1115 !important;
  color:#ffffff !important;
  border-color:#0b1115 !important;
}
.header.scrolled .nav-links .nav-cta span,
.header.scrolled .nav-cta span{color:#82d0f6 !important}
.header.scrolled .nav-links .nav-cta:hover,
.header.scrolled .nav-cta:hover{
  background:#168fc9 !important;
  color:#fff !important;
  border-color:#168fc9 !important;
}

@media(max-width:900px){
  .hero .hero-media:has(.hero-panel){grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr)}
  .hero-panel-label{left:14px;right:14px;bottom:16px;font-size:8px}
  .service-card-featured .service-image{height:330px !important}
}
@media(max-width:600px){
  .loader-stage{gap:18px;padding:22px}.loader-plan{width:76px;height:76px}.loader-copy{min-width:0}
  .loader-kicker{font-size:6px}.loader-brand{font-size:25px}.loader-sub{font-size:7px}
  .loader-room-a{left:8px;top:8px;width:27px;height:38px}.loader-room-b{right:8px;top:8px;width:27px;height:23px}
  .loader-room-c{right:8px;bottom:8px;width:27px;height:31px}.loader-room-d{left:8px;bottom:8px;width:27px;height:16px}
  .loader-plan-line-v{left:38px;top:8px}.loader-plan-line-h{left:8px;top:50px}
  @keyframes drawV{to{height:60px}}@keyframes drawH{to{width:60px}}
  .hero .hero-media:has(.hero-panel){grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr}
  .hero-panel-label{gap:5px;bottom:12px;left:10px;right:10px;font-size:7px}.hero-panel-label em{display:none}
  .hero-panel-label b{display:none}
  .service-card-featured .service-image{height:285px !important}
  .service-card-featured::before{right:12px;top:12px;font-size:6px}
  .service-card-featured .service-info{padding:21px 18px}
}

@media(prefers-reduced-motion:reduce){
  .loader::before,.loader-progress i,.loader-plan-line{animation:none !important}
  .loader-progress i{width:100%}
  .loader-plan-line-v{height:84px}.loader-plan-line-h{width:84px}
  .hero-panel img{transition:none !important}
}

/* ===== DELIVERY CONSISTENCY PATCH — OCT 04 2026 ===== */

/* Prevent old product layouts from spilling outside the viewport */
html,body{max-width:100%;overflow-x:hidden}
.product-page .product-hero{isolation:isolate}
.product-page .product-hero .container{width:min(1180px,calc(100% - 48px));margin-inline:auto}
.product-page .product-hero-content{box-sizing:border-box;min-width:0}
.product-page .product-hero .hero-title{width:min(920px,100%);max-width:100%!important;overflow-wrap:normal;word-break:normal}
.product-page .product-hero-media img{object-position:center center}

/* Product heroes now follow the same framed cinematic language as main pages */
.product-page .product-hero .hero-frame{
  position:absolute;
  inset:92px 22px 22px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:28px;
  z-index:2;
  pointer-events:none;
}
.product-page .product-hero::after{
  content:"";
  position:absolute;
  left:22px;right:22px;bottom:22px;
  height:18%;
  z-index:1;
  background:linear-gradient(transparent,rgba(2,7,10,.42));
  border-radius:0 0 28px 28px;
  pointer-events:none;
}

/* Services page: user sees the work first, then a clear contact action */
.service-actions{gap:10px!important;align-items:stretch!important}
.service-view-btn,.service-contact-btn{
  min-height:52px;
  padding:14px 20px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  border:1px solid var(--blue);
  font:700 9px Manrope,sans-serif;
  letter-spacing:.06em;
  text-transform:uppercase;
  transition:transform .3s ease,background .3s ease,color .3s ease,border-color .3s ease,box-shadow .3s ease;
}
.service-view-btn{
  order:1;
  background:var(--blue);
  color:#fff;
  box-shadow:0 12px 30px rgba(8,123,193,.16);
}
.service-contact-btn{
  order:2;
  background:#fff;
  color:var(--ink);
  border-color:rgba(6,30,43,.2);
  box-shadow:0 10px 24px rgba(6,30,43,.07);
}
.service-view-btn:hover{background:var(--ink);border-color:var(--ink);transform:translateY(-3px)}
.service-contact-btn:hover{background:var(--ink);border-color:var(--ink);color:#fff;transform:translateY(-3px);box-shadow:0 18px 38px rgba(6,30,43,.16)}
.service-view-btn span,.service-contact-btn span{font-size:15px}

/* Stable product-page closing CTA: image, headline and buttons always stay inside the card */
.product-page .product-cta{
  position:relative;
  min-height:560px!important;
  height:560px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:64px 24px!important;
  box-sizing:border-box;
}
.product-page .product-cta-media{
  position:absolute!important;
  inset:0!important;
  width:100%;height:100%;min-height:0!important;
}
.product-page .product-cta-media img{
  width:100%;height:100%;object-fit:cover!important;display:block;
  filter:brightness(.3) saturate(.72)!important;
}
.product-page .product-cta-overlay{z-index:1;background:linear-gradient(90deg,rgba(3,9,12,.72),rgba(3,9,12,.38)),radial-gradient(circle at 50% 42%,rgba(5,12,16,.05),rgba(5,12,16,.72))!important}
.product-page .product-cta-inner{z-index:3!important;width:min(900px,100%);margin:auto;padding:0 18px;box-sizing:border-box}
.product-page .product-cta h2{font-size:clamp(46px,6.3vw,84px)!important;max-width:850px;margin:18px auto 16px!important}
.product-page .product-cta p{max-width:560px;margin:0 auto 24px!important;line-height:1.7}
.product-page .product-cta .btn{position:relative;z-index:4}
.product-page .product-back{position:relative;z-index:4;color:rgba(255,255,255,.64)!important;border-color:rgba(255,255,255,.22)!important}

/* Meuble TV gallery: consistent crop and focus */
.product-page .gallery-item img{object-position:center center}


.service-actions-feature .service-contact-btn-light{background:rgba(255,255,255,.96);color:var(--ink);border-color:#fff}.service-actions-feature .service-contact-btn-light:hover{background:var(--blue);border-color:var(--blue);color:#fff}
@media(max-width:950px){
  .product-page .product-hero .container{width:min(100% - 36px,1180px)}
  .product-page .product-hero .hero-frame{inset:84px 14px 14px;border-radius:24px}
  .product-page .product-cta{height:520px!important;min-height:520px!important;margin:14px!important}
}

@media(max-width:600px){
  .product-page .product-hero{height:auto!important;min-height:720px!important;max-height:none!important;align-items:center!important}
  .product-page .product-hero .container{width:calc(100% - 36px)!important}
  .product-page .product-hero .hero-frame{inset:76px 8px 8px;border-radius:20px}
  .product-page .product-hero-content{padding:132px 0 56px!important;width:100%;max-width:100%}
  .product-page .product-hero .hero-title{font-size:clamp(42px,12.2vw,58px)!important;line-height:.92!important;letter-spacing:-.065em!important;width:100%!important;max-width:100%!important;margin:18px 0 20px!important;text-wrap:balance}
  .product-page .product-kicker{font-size:7px;letter-spacing:.15em}
  .product-page .product-hero-copy{width:100%;max-width:100%;font-size:12px;line-height:1.65}
  .product-page .product-hero-meta{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:14px 18px!important}
  .product-page .product-hero-meta div:last-child{grid-column:1/-1}
  .service-actions{display:grid!important;grid-template-columns:1fr!important;width:100%;gap:9px!important}
  .service-view-btn,.service-contact-btn{width:100%!important;box-sizing:border-box}
  .product-page .product-cta{height:auto!important;min-height:470px!important;margin:10px!important;padding:58px 16px!important;border-radius:20px!important}
  .product-page .product-cta h2{font-size:clamp(42px,13vw,60px)!important;line-height:.91!important;letter-spacing:-.065em!important;width:100%;max-width:100%;overflow-wrap:normal}
  .product-page .product-cta p{font-size:12px}
}

/* =========================================================
   TINK HOME — CINEMATIC MINIMAL LOADER V3
   ========================================================= */
html.loader-active{overflow:hidden}

.loader{
  position:fixed !important;
  inset:0 !important;
  z-index:99999 !important;
  display:block !important;
  overflow:hidden !important;
  background:#0b0d0e !important;
  color:#f4f1eb !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  isolation:isolate;
}
.loader.hide{
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
}
.loader::before{display:none !important}

.loader-panel{
  position:absolute;
  left:0;
  width:100%;
  height:50.2%;
  z-index:1;
  background:
    linear-gradient(110deg,rgba(255,255,255,.016),transparent 34%,rgba(255,255,255,.026) 56%,transparent 74%),
    #0b0d0e;
  transition:transform .92s cubic-bezier(.77,0,.18,1);
  will-change:transform;
}
.loader-panel-top{top:0;border-bottom:1px solid rgba(255,255,255,.055)}
.loader-panel-bottom{bottom:0;border-top:1px solid rgba(255,255,255,.035)}

.loader-light{
  position:absolute;
  z-index:2;
  left:-35%;
  top:0;
  width:38%;
  height:100%;
  pointer-events:none;
  opacity:.32;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.055),transparent);
  transform:skewX(-14deg);
  animation:loaderLightSweep 1.9s cubic-bezier(.2,.7,.2,1) infinite;
}

.loader-center{
  position:absolute;
  left:50%;
  top:50%;
  z-index:4;
  width:min(620px,82vw);
  transform:translate(-50%,-50%);
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  padding:26px 18px;
  animation:loaderCenterIn .68s cubic-bezier(.2,.7,.2,1) both;
  transition:opacity .26s ease,transform .36s cubic-bezier(.2,.7,.2,1),filter .36s ease;
}
.loader-kicker{
  margin:0 0 18px !important;
  color:rgba(244,241,235,.48) !important;
  font:600 clamp(7px,.68vw,9px)/1.2 Manrope,sans-serif !important;
  letter-spacing:.31em !important;
}
.loader-wordmark{
  color:#f5f3ee;
  font:700 clamp(38px,5.3vw,74px)/.92 Manrope,sans-serif;
  letter-spacing:-.055em;
  white-space:nowrap;
  text-rendering:geometricPrecision;
}
.loader-wordmark span{
  color:#f5f3ee;
  font-weight:500;
  opacity:.88;
}
.loader-line{
  position:relative;
  display:block;
  width:min(330px,58vw);
  height:1px;
  margin:24px 0 17px;
  overflow:hidden;
  background:rgba(255,255,255,.10);
}
.loader-line::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:4px;
  height:4px;
  border-radius:50%;
  background:#2a83bd;
  box-shadow:0 0 20px rgba(42,131,189,.62);
  transform:translate(-50%,-50%);
}
.loader-line i{
  display:block;
  width:100%;
  height:100%;
  transform:scaleX(0);
  transform-origin:center;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.72) 18%,#2a83bd 50%,rgba(255,255,255,.72) 82%,transparent);
  animation:loaderLineDraw .78s .14s cubic-bezier(.2,.7,.2,1) forwards;
}
.loader-sub{
  margin:0 !important;
  color:rgba(244,241,235,.54) !important;
  font:600 clamp(7px,.72vw,9px)/1.3 Manrope,sans-serif !important;
  letter-spacing:.26em !important;
}

.loader.opening .loader-center{
  opacity:0;
  filter:blur(3px);
  transform:translate(-50%,-52%) scale(.985);
}
.loader.opening .loader-panel-top{transform:translateY(-101%)}
.loader.opening .loader-panel-bottom{transform:translateY(101%)}
.loader.opening .loader-light{opacity:0;transition:opacity .18s ease}

@keyframes loaderCenterIn{
  from{opacity:0;transform:translate(-50%,-46%) scale(.985);filter:blur(5px)}
  to{opacity:1;transform:translate(-50%,-50%) scale(1);filter:blur(0)}
}
@keyframes loaderLineDraw{to{transform:scaleX(1)}}
@keyframes loaderLightSweep{
  0%{left:-42%;opacity:0}
  18%{opacity:.28}
  62%{opacity:.16}
  100%{left:112%;opacity:0}
}

@media (max-width:700px){
  .loader-center{width:min(390px,86vw);padding:22px 12px}
  .loader-kicker{margin-bottom:15px !important;letter-spacing:.24em !important}
  .loader-wordmark{font-size:clamp(34px,11.5vw,52px);letter-spacing:-.05em}
  .loader-line{width:min(260px,66vw);margin:20px 0 15px}
  .loader-sub{font-size:7px !important;letter-spacing:.20em !important}
}

@media (prefers-reduced-motion:reduce){
  .loader-center,.loader-line i,.loader-light{animation:none !important}
  .loader-line i{transform:scaleX(1)}
  .loader-panel{transition:none !important}
}