/* ══════ LACTONIC® & LACTOLAC® — toque arabesco sobre el sistema visual de la web ══════ */
:root{--gold:#C9A24E;--gold-2:#E8C77A;--nightsky:#141A45}
.lac-ar,.ac-bd h3 [lang="ar"]{font-family:"Amiri",var(--display);font-weight:700}

/* patrón geométrico (estrella de 8 puntas) con un brillo que lo recorre */
.lac-pattern{position:absolute;inset:0;width:100%;height:100%;opacity:.16;pointer-events:none;
  -webkit-mask-image:linear-gradient(105deg,rgba(0,0,0,.35) 30%,#000 50%,rgba(0,0,0,.35) 70%);mask-image:linear-gradient(105deg,rgba(0,0,0,.35) 30%,#000 50%,rgba(0,0,0,.35) 70%);
  -webkit-mask-size:300% 100%;mask-size:300% 100%;animation:sheen 9s linear infinite}
@keyframes sheen{from{-webkit-mask-position:100% 0;mask-position:100% 0}to{-webkit-mask-position:-200% 0;mask-position:-200% 0}}

/* cabecera */
.lac-hero{position:relative;overflow:hidden;color:#fff;min-height:min(92svh,940px);display:flex;align-items:center;
  background:radial-gradient(80% 90% at 75% 45%,#2A3480 0%,#1A2160 45%,var(--nightsky) 100%)}
.lac-glow{position:absolute;right:8%;top:50%;width:min(56vw,760px);aspect-ratio:1;transform:translateY(-50%);border-radius:50%;
  background:radial-gradient(circle,rgba(232,199,122,.35) 0%,rgba(201,162,78,.12) 40%,transparent 68%);pointer-events:none}
.lac-hero-grid{position:relative;z-index:2;width:100%;display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,70px);align-items:center;
  padding:clamp(120px,12vw,160px) var(--pad) clamp(50px,6vw,90px)}
.lac-hero .crumbs ol{color:rgba(255,255,255,.55)}.lac-hero .crumbs [aria-current]{color:#fff}.lac-hero .crumbs li+li::before{color:rgba(255,255,255,.3)}
.lac-hero .eyebrow{color:var(--gold-2);margin-top:22px}
.lac-hero .eyebrow::before{background:var(--gold)}
.lac-hero h1{color:#fff;font-size:clamp(46px,6.6vw,104px);margin:18px 0 6px;letter-spacing:-.03em}
.lac-hero h1 em{color:var(--gold-2);font-style:italic}
.lac-hero h1 sup{font-size:.32em;vertical-align:.95em;margin-left:2px;color:var(--gold-2)}
.lac-ar{font-size:clamp(30px,3.4vw,50px);color:var(--gold-2);line-height:1.5;margin-bottom:18px;
  background:linear-gradient(90deg,#C9A24E,#F4DFA4,#C9A24E);-webkit-background-clip:text;background-clip:text;color:transparent;background-size:200% 100%;animation:goldflow 6s ease-in-out infinite alternate}
@keyframes goldflow{to{background-position:100% 0}}
.lac-hero .lead{color:rgba(255,255,255,.8);max-width:46ch}
.lac-hero .lead strong{color:#fff}
.lac-seals{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.lac-seals li{font-family:var(--mono);font-size:11px;letter-spacing:.08em;padding:8px 13px;border:1px solid rgba(201,162,78,.55);border-radius:100px;color:var(--gold-2)}
.lac-hero .actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.lac-hero .btn.light{background:var(--gold);color:#1A1E45}
.lac-hero .btn.light:hover{background:var(--gold-2)}

/* arco con las latas */
.lac-arch-wrap{position:relative;aspect-ratio:1/1.08;width:min(100%,560px);justify-self:center;display:grid;place-items:center}
.lac-arch{position:absolute;inset:4% 12% 0;border-radius:50% 50% 0 0/38% 38% 0 0;padding:10px;
  background:linear-gradient(160deg,var(--gold-2),var(--gold) 40%,#8A6A25);box-shadow:0 50px 80px -40px rgba(0,0,0,.6)}
.lac-arch-in{display:block;width:100%;height:100%;border-radius:50% 50% 0 0/38% 38% 0 0;
  background:radial-gradient(120% 80% at 50% 70%,#FFF8E8 0%,#F4E3BC 55%,#D9BC7C 100%)}
.lac-arch::after{content:"";position:absolute;inset:-14px;border-radius:50% 50% 0 0/38% 38% 0 0;border:1px solid rgba(201,162,78,.5)}
.lt{position:absolute;bottom:5%;filter:drop-shadow(0 30px 30px rgba(20,26,69,.45));opacity:0;translate:0 50px;transition:opacity 1s var(--ease),translate 1.3s var(--ease)}
.on .lt{opacity:1;translate:0 0}
.lt1{width:44%;left:28%;z-index:3;transition-delay:.2s}
.lt2{width:34%;left:9%;bottom:8%;rotate:-7deg;z-index:2;transition-delay:.4s}
.lt3{width:34%;right:9%;bottom:8%;rotate:7deg;z-index:2;transition-delay:.55s}
.on .lt1{animation:ltf 6s ease-in-out 1.4s infinite}.on .lt2{animation:ltf 7s ease-in-out 1.7s infinite reverse}.on .lt3{animation:ltf 6.6s ease-in-out 2s infinite}
@keyframes ltf{0%,100%{transform:translate3d(var(--mx,0),var(--my,0),0)}50%{transform:translate3d(var(--mx,0),calc(var(--my,0px) - 10px),0)}}
.spark{position:absolute;width:10px;height:10px;background:var(--gold-2);clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%);animation:twinkle 3.2s ease-in-out infinite;z-index:4}
.spark.s1{left:14%;top:22%}.spark.s2{right:12%;top:30%;animation-delay:.8s;width:14px;height:14px}.spark.s3{left:20%;bottom:30%;animation-delay:1.6s}.spark.s4{right:22%;top:10%;animation-delay:2.3s;width:7px;height:7px}
@keyframes twinkle{0%,100%{opacity:.15;transform:scale(.6) rotate(0)}50%{opacity:1;transform:scale(1.1) rotate(45deg)}}

/* introducción con un filete decorativo */
.lac-intro{background:linear-gradient(180deg,#FBF8F3,#F6EFE2)}

/* cuatro líneas en tarjetas con forma de arco */
.lac-lines{background:#F6EFE2;padding-top:0}
.arches{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.6vw,24px)}
.archcard{background:#fff;border-radius:200px 200px 10px 10px/130px 130px 10px 10px;overflow:hidden;border:1px solid rgba(201,162,78,.35);
  box-shadow:0 30px 50px -36px rgba(20,26,69,.4);transition:.6s var(--ease);display:flex;flex-direction:column}
.archcard:hover{transform:translateY(-8px);box-shadow:0 44px 70px -40px rgba(20,26,69,.5)}
.ac-top{position:relative;aspect-ratio:1/0.95;background:radial-gradient(120% 90% at 50% 100%,color-mix(in srgb,var(--c2) 35%,#fff) 0%,color-mix(in srgb,var(--c1) 20%,#fff) 60%,#fff 100%);overflow:hidden}
.ac-top::before{content:"";position:absolute;inset:10px 10px 0;border-radius:190px 190px 0 0/120px 120px 0 0;border:1px solid rgba(201,162,78,.45)}
.ac-top img{position:absolute;bottom:4%;filter:drop-shadow(0 16px 16px rgba(20,26,69,.3));transition:transform .9s var(--ease)}
.ac-top .a1{width:46%;left:27%;z-index:2}
.ac-top .a2{width:36%;left:6%;bottom:7%;rotate:-6deg}
.ac-top .a3{width:36%;right:6%;bottom:7%;rotate:6deg}
.archcard:hover .a2{transform:translateX(-6%)}.archcard:hover .a3{transform:translateX(6%)}.archcard:hover .a1{transform:translateY(-6px)}
.ac-bd{padding:20px 22px 24px;display:flex;flex-direction:column;gap:8px;flex:1;border-top:3px solid var(--c1)}
.ac-k{color:var(--c1)}
.ac-bd h3{color:var(--deep);font-size:clamp(18px,1.5vw,22px)}
.ac-bd h3 span{display:block;font-size:.8em;color:var(--muted)}
.ac-bd p{font-size:14.5px;color:var(--muted)}
.ac-age{list-style:none;display:flex;gap:6px;margin-top:auto;padding-top:6px}
.ac-age li{font-family:var(--mono);font-size:10.5px;padding:5px 9px;border-radius:100px;background:color-mix(in srgb,var(--c1) 12%,#fff);color:var(--c1)}

/* desfile de las 12 latas */
.lac-parade{position:relative;overflow:hidden;background:var(--nightsky);color:#fff;padding-block:clamp(60px,7vw,100px)}
.parade-head{position:relative;z-index:2;margin-bottom:clamp(26px,3vw,44px)}
.parade-head .eyebrow{color:var(--gold-2)}.parade-head .eyebrow::before{background:var(--gold)}
.parade-head .h2{color:#fff;margin-top:16px}
.parade{position:relative;z-index:2;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.prow{display:flex;gap:clamp(18px,2.4vw,36px);width:max-content;animation:slide 60s linear infinite}
.parade:hover .prow{animation-play-state:paused}
.pt{width:clamp(130px,12vw,180px);text-align:center;transition:transform .5s var(--ease)}
.pt:hover{transform:translateY(-10px)}
.pt img{width:100%;filter:drop-shadow(0 20px 22px rgba(0,0,0,.45))}
.pt figcaption{margin-top:12px}
.pt b{display:block;font-family:var(--display);font-weight:400;font-size:16px;color:#fff}
.pt span{color:var(--gold-2);font-size:10px}
@keyframes slide{to{transform:translateX(-50%)}}

/* bloque Arabia Saudí */
.lac-ksa{display:grid;grid-template-columns:auto 1fr;gap:clamp(20px,3vw,44px);align-items:center;background:#fff;border:1px solid rgba(201,162,78,.4);
  border-radius:12px;padding:clamp(24px,3vw,44px);position:relative;overflow:hidden}
.lac-ksa::after{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;border:1px solid rgba(201,162,78,.35);box-shadow:0 0 0 18px rgba(201,162,78,.06)}
.ksa-flag{width:96px;border-radius:6px;box-shadow:0 18px 34px -16px rgba(20,26,69,.5)}
.lac-ksa .h2{color:var(--deep);margin:12px 0 12px;font-size:clamp(26px,3vw,42px)}
.lac-ksa p:not(.h2){color:#454C6E;max-width:60ch;margin-bottom:16px}

@media(max-width:1080px){.lac-hero-grid{grid-template-columns:1fr}.arches{grid-template-columns:1fr 1fr}.lac-arch-wrap{width:min(88%,460px)}}
@media(max-width:600px){.arches{grid-template-columns:1fr}.lac-ksa{grid-template-columns:1fr}.archcard{border-radius:160px 160px 10px 10px/100px 100px 10px 10px}}
@media(prefers-reduced-motion:reduce){.lac-pattern,.lac-ar,.prow,.spark,.on .lt{animation:none!important}}

/* logos oficiales */
.lac-logos{display:grid;gap:clamp(10px,1.4vw,18px);margin:24px 0 8px;justify-items:start}
.lac-logos img{width:min(440px,86%);height:auto;filter:drop-shadow(0 6px 18px rgba(232,199,122,.25))}
.lac-logos img+img{width:min(450px,88%)}
.on .lac-logos img{animation:logoRise 1s var(--ease) both}.on .lac-logos img+img{animation-delay:.15s}
@keyframes logoRise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
