/* ==========================================================================
   A777NEW.COM.PK — "ATELIER"
   Digital luxury campaign. Warm paper, ink, burnt orange, bronze.
   Type: Space Grotesk (display) / Inter (body)
   Class prefix: ed*   — shares nothing with a*, nv*, cb* or pk*
   ========================================================================== */

:root{
  --paper:#F6F4EF; --paper2:#EFEBE2; --card:#FFFFFF; --line:#ECE7DF;
  --ink:#1A1A1A; --tx:#111111; --mu:#666666;
  /* brief accent, kept for LARGE type and fills */
  --ac:#D35400;
  /* derived for small text + button fills so it clears WCAG AA */
  --ac-ink:#B84600; --ac-deep:#8F3600;
  --sec:#B98B58; --sec-ink:#8A6538;

  --sh1:0 2px 8px rgba(26,26,26,.05);
  --sh2:0 18px 44px rgba(26,26,26,.09);
  --sh3:0 40px 90px rgba(26,26,26,.14);
  --sh4:0 70px 140px rgba(26,26,26,.18);

  --d:'Space Grotesk',ui-sans-serif,system-ui,sans-serif;
  --b:'Inter',ui-sans-serif,system-ui,sans-serif;

  --r1:4px; --r2:10px; --r3:20px; --r4:34px; --rp:999px;
  --e:cubic-bezier(.16,.84,.28,1); --e2:cubic-bezier(.4,0,.2,1);
  --f:.22s var(--e); --n:.5s var(--e); --sl:.9s var(--e);
  --max:1280px; --gut:clamp(20px,4vw,64px);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:clip;scroll-behavior:smooth;scroll-padding-top:110px}
body{margin:0;background:var(--paper);color:var(--tx);font-family:var(--b);font-size:17px;
  line-height:1.68;font-weight:400;-webkit-font-smoothing:antialiased;overflow-x:clip}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
h1,h2,h3,h4{margin:0;font-family:var(--d);font-weight:700;line-height:.98;letter-spacing:-.04em}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
:focus-visible{outline:2px solid var(--ac-ink);outline-offset:4px}
::selection{background:var(--ac);color:#fff}

/* paper grain + warm light */
.edGrain{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.4;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.28'/%3E%3C/svg%3E")}
.edLight{position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(60% 40% at 78% 4%,rgba(211,84,0,.07),transparent 64%),
    radial-gradient(46% 34% at 6% 52%,rgba(185,139,88,.10),transparent 66%),
    radial-gradient(70% 44% at 50% 104%,rgba(185,139,88,.08),transparent 64%)}
/* cursor glow, desktop only */
.edGlow{position:fixed;top:0;left:0;width:520px;height:520px;margin:-260px 0 0 -260px;z-index:1;
  pointer-events:none;border-radius:50%;opacity:0;transition:opacity .5s var(--e);
  background:radial-gradient(circle,rgba(211,84,0,.10),transparent 62%);
  will-change:transform}
.edGlow.on{opacity:1}

/* ---------------- shell ---------------- */
.edW{width:min(100% - (var(--gut) * 2),var(--max));margin-inline:auto;position:relative;z-index:2}
.edWide{width:min(100% - 24px,1560px);margin-inline:auto;position:relative;z-index:2}
.edS{position:relative;padding:clamp(76px,11vw,168px) 0;z-index:2}
.edS--sm{padding:clamp(48px,6vw,96px) 0}
main{position:relative;z-index:2}
.edRule{height:1px;background:var(--line);transform:scaleX(0);transform-origin:left;
  transition:transform 1.2s var(--e)}
.edRule.on{transform:scaleX(1)}

/* ---------------- type ---------------- */
.edEy{display:inline-flex;align-items:center;gap:12px;font-family:var(--b);font-size:.72rem;
  font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--ac-ink)}
.edEy::before{content:"";width:32px;height:1px;background:var(--sec)}
.edD1{font-size:clamp(46px,10.5vw,148px);line-height:.9;letter-spacing:-.05em;font-weight:700}
.edD2{font-size:clamp(34px,6.6vw,92px);line-height:.94;letter-spacing:-.045em}
.edD3{font-size:clamp(26px,3.6vw,48px);line-height:1.02;letter-spacing:-.04em}
.edH4{font-family:var(--d);font-weight:700;font-size:clamp(19px,2vw,25px);letter-spacing:-.03em;
  line-height:1.2}
.edIt{font-style:italic;font-weight:400;font-family:Georgia,'Times New Roman',serif;
  letter-spacing:-.02em}
.edAc{color:var(--ac)}                     /* large type only — 3.79:1 */
.edLd{color:var(--mu);font-size:clamp(15.5px,1.05vw,17.5px);line-height:1.76;max-width:46ch}
.edMu{color:var(--mu)}
.edCen{text-align:center}
.edCen .edLd{margin-inline:auto}
.edNum{font-family:var(--d);font-variant-numeric:tabular-nums}

/* mask-reveal lines */
.edRv{display:block;overflow:hidden}
.edRv > span{display:block;transform:translateY(105%);
  transition:transform 1s var(--e);transition-delay:var(--dl,0ms)}
.edRv.on > span{transform:none}

/* generic reveal — opacity + translate only (never clip/scale: it breaks the observer) */
.edR{opacity:0;transform:translateY(26px);
  transition:opacity .9s var(--e),transform .9s var(--e);transition-delay:var(--dl,0ms)}
.edR.on{opacity:1;transform:none}
.edR[data-rv="blur"]{filter:blur(10px)}
.edR.on[data-rv="blur"]{filter:none}

/* ---------------- buttons ---------------- */
.edB{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:12px;
  font-family:var(--b);font-weight:600;font-size:.92rem;letter-spacing:.01em;
  padding:18px 32px;border-radius:var(--rp);min-height:54px;white-space:nowrap;cursor:pointer;
  overflow:hidden;isolation:isolate;transition:color var(--n),border-color var(--n),transform var(--f)}
.edB svg{width:17px;height:17px;flex:none;position:relative;z-index:2;transition:transform var(--n)}
.edB span{position:relative;z-index:2}
.edB::before{content:"";position:absolute;inset:0;z-index:1;border-radius:inherit;
  transform:translateY(101%);transition:transform .55s var(--e)}
.edB:hover::before{transform:none}
.edB:hover svg{transform:translateY(2px)}
.edB--pr{background:var(--ac-ink);color:#fff}
.edB--pr::before{background:var(--ink)}
.edB--gh{color:var(--tx);border:1px solid var(--ink)}
.edB--gh::before{background:var(--ink)}
.edB--gh:hover{color:var(--paper)}
.edB--lt{color:var(--paper);border:1px solid rgba(246,244,239,.42)}
.edB--lt::before{background:var(--paper)}
.edB--lt:hover{color:var(--ink);border-color:var(--paper)}
.edB--sm{padding:12px 22px;font-size:.84rem;min-height:46px}
.edB--blk{width:100%}
.edB:active{transform:scale(.985)}
.edRip{position:absolute;z-index:3;border-radius:50%;transform:scale(0);
  background:rgba(255,255,255,.32);animation:edRip .62s var(--e2) forwards;pointer-events:none}
@keyframes edRip{to{transform:scale(2.6);opacity:0}}

/* ---------------- navigation ---------------- */
.edNav{position:fixed;top:0;left:0;right:0;z-index:60;
  transition:background var(--n),box-shadow var(--n),border-color var(--n)}
.edNav-in{display:flex;align-items:center;gap:22px;height:88px;transition:height var(--n)}
.edNav.is-stuck{background:rgba(246,244,239,.9);backdrop-filter:blur(16px) saturate(150%);
  -webkit-backdrop-filter:blur(16px) saturate(150%);box-shadow:0 1px 0 var(--line),var(--sh1)}
.edNav.is-stuck .edNav-in{height:70px}
.edLogo{display:inline-flex;align-items:center;flex:none;padding-block:10px}
.edLogo img{height:28px;width:auto}
.edMenu{display:flex;align-items:center;gap:6px;margin-left:auto}
.edMenu a{position:relative;padding:10px 4px;margin-inline:11px;font-size:.88rem;font-weight:500;
  color:var(--tx);transition:color var(--f)}
.edMenu a::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:1px;
  background:var(--ac-ink);transform:scaleX(0);transform-origin:right;
  transition:transform .45s var(--e)}
.edMenu a:hover::after{transform:scaleX(1);transform-origin:left}
.edMenu a[aria-current="page"]{color:var(--ac-ink)}
.edMenu a[aria-current="page"]::after{transform:scaleX(1)}
.edBurg{display:none;width:48px;height:48px;margin-left:auto;flex:none;border-radius:50%;
  align-items:center;justify-content:center;flex-direction:column;gap:6px;border:1px solid var(--line);
  background:var(--card)}
.edBurg i{display:block;width:17px;height:1px;background:var(--ink);
  transition:transform var(--f),opacity var(--f)}
.edBurg[aria-expanded="true"] i:nth-child(1){transform:translateY(7px) rotate(45deg)}
.edBurg[aria-expanded="true"] i:nth-child(2){opacity:0}
.edBurg[aria-expanded="true"] i:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

.edDrw{position:fixed;inset:0;z-index:59;visibility:hidden;pointer-events:none}
.edDrw-sc{position:absolute;inset:0;background:rgba(26,26,26,.4);opacity:0;transition:opacity var(--n)}
.edDrw-p{position:absolute;top:0;right:0;bottom:0;width:min(420px,90vw);padding:104px 32px 34px;
  background:var(--paper);transform:translateX(102%);transition:transform var(--sl);
  display:flex;flex-direction:column;overflow-y:auto;box-shadow:var(--sh3)}
.edDrw.on{visibility:visible;pointer-events:auto}
.edDrw.on .edDrw-sc{opacity:1}
.edDrw.on .edDrw-p{transform:none}
.edDrw-p a.edLnk{display:flex;align-items:baseline;gap:16px;padding:20px 0;
  border-bottom:1px solid var(--line);font-family:var(--d);font-weight:700;
  font-size:clamp(26px,7vw,38px);letter-spacing:-.04em;line-height:1;
  opacity:0;transform:translateY(16px);
  transition:opacity .5s var(--e),transform .5s var(--e),color var(--f)}
.edDrw-p a.edLnk i{font-style:normal;font-family:var(--b);font-size:.64rem;font-weight:600;
  letter-spacing:.2em;color:var(--sec-ink)}
.edDrw-p a.edLnk:hover{color:var(--ac-ink)}
.edDrw.on .edDrw-p a.edLnk{opacity:1;transform:none}
.edDrw-p .edB{margin-top:30px}

/* ==========================================================================
   HERO — editorial cover
   ========================================================================== */
.edCover{position:relative;padding-top:clamp(124px,15vw,196px);padding-bottom:clamp(50px,7vw,110px)}
.edCover-top{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:end;
  padding-bottom:clamp(18px,2.4vw,30px);border-bottom:1px solid var(--line)}
.edCover-meta{display:flex;flex-wrap:wrap;gap:26px;font-size:.7rem;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;color:var(--mu)}
.edCover h1{margin-top:clamp(26px,3.4vw,48px)}
.edCover-g{display:grid;grid-template-columns:1fr .92fr;gap:clamp(28px,5vw,80px);
  align-items:start;margin-top:clamp(26px,3vw,44px)}
.edCover-l{display:grid;gap:30px;justify-items:start;padding-top:8px}
.edCta{display:flex;flex-wrap:wrap;gap:14px}
.edProof{display:flex;flex-wrap:wrap;gap:24px;font-size:.74rem;font-weight:500;
  letter-spacing:.12em;text-transform:uppercase;color:var(--mu)}
.edProof span{display:inline-flex;align-items:center;gap:8px}
.edProof svg{width:14px;height:14px;color:var(--ac-ink);flex:none}

/* layered device composition */
.edComp{position:relative;display:grid;place-items:center;min-height:clamp(420px,52vw,620px)}
.edComp-bg{position:absolute;inset:auto 0 6% 0;height:64%;border-radius:var(--r4);
  background:linear-gradient(165deg,var(--paper2),rgba(185,139,88,.16));z-index:0}
.edPhone{position:relative;z-index:3;width:min(272px,60%);will-change:transform}
.edLayer{position:absolute;z-index:2;width:min(156px,34%);border-radius:var(--r2);overflow:hidden;
  box-shadow:var(--sh3);background:var(--card);will-change:transform}
.edLayer img{width:100%;height:auto;aspect-ratio:512/908;object-fit:cover;object-position:top}
.edLayer.l1{top:6%;left:0}
.edLayer.l2{bottom:4%;right:0}
.edFloat{position:absolute;z-index:4;padding:14px 18px;border-radius:var(--rp);background:var(--card);
  box-shadow:var(--sh2);display:flex;align-items:center;gap:12px;white-space:nowrap}
.edFloat b{font-family:var(--d);font-size:1rem;letter-spacing:-.03em}
.edFloat small{display:block;font-size:.66rem;color:var(--mu);letter-spacing:.06em}
.edFloat .dot{width:8px;height:8px;border-radius:50%;background:var(--ac-ink);flex:none}
.edFloat.f1{top:2%;right:6%}
.edFloat.f2{bottom:10%;left:2%}

/* ---------------- phone shell (screen carries the ratio — never crops) ---------------- */
.edPhone-b{position:relative;border-radius:clamp(28px,8%,46px);padding:9px;background:var(--ink);
  box-shadow:var(--sh4)}
.edPhone-s{position:relative;aspect-ratio:512/908;border-radius:clamp(21px,6.4%,38px);
  overflow:hidden;background:var(--paper2)}
.edPhone-s img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  object-position:center;opacity:0;transition:opacity .8s var(--e)}
.edPhone-s img.on{opacity:1}
.edPips{display:flex;justify-content:center;gap:8px;margin-top:22px}
.edPips i{width:6px;height:6px;border-radius:50%;background:var(--line);transition:all var(--f)}
.edPips i.on{width:26px;border-radius:99px;background:var(--ac)}

/* ==========================================================================
   STORY STRIP — full bleed, parallax
   ========================================================================== */
.edStrip{position:relative;min-height:clamp(420px,58vw,660px);overflow:hidden;
  display:grid;place-items:center;background:var(--ink);color:var(--paper)}
.edStrip-bg{position:absolute;inset:-12% 0;z-index:0;opacity:.34;will-change:transform;
  background-size:cover;background-position:center;filter:grayscale(.3) contrast(1.05)}
.edStrip::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(26,26,26,.55),rgba(26,26,26,.82))}
.edStrip-in{position:relative;z-index:2;text-align:center;padding:clamp(60px,9vw,120px) var(--gut)}
.edStrip h2{color:var(--paper);max-width:16ch;margin-inline:auto}
.edStrip .edLd{color:rgba(246,244,239,.72);margin:clamp(20px,2.6vw,34px) auto 0;max-width:44ch}
.edStrip .edEy{color:var(--sec)}
.edStrip .edEy::before{background:var(--sec)}

/* ==========================================================================
   EDITORIAL GALLERY — sticky caption, offset stack, no slider
   ========================================================================== */
.edGal{display:grid;grid-template-columns:.82fr 1.18fr;gap:clamp(30px,5vw,80px);align-items:start}
.edGal-side{position:sticky;top:clamp(110px,14vh,150px);align-self:start;display:grid;gap:22px;
  justify-items:start}
.edGal-count{font-family:var(--d);font-size:.8rem;letter-spacing:.18em;color:var(--sec-ink)}
.edGal-count b{color:var(--ac-ink)}
.edGal-stack{display:grid;gap:clamp(34px,5vw,76px)}
.edPlate{position:relative}
/* magazine composition: capped plates, alternating alignment and scale */
.edPlate{max-width:400px}
.edPlate:nth-child(even){margin-left:auto;max-width:330px}
.edPlate:nth-child(3n){margin-left:12%;max-width:360px}
.edPlate-fig{position:relative;overflow:hidden;border-radius:var(--r3);background:var(--card);
  box-shadow:var(--sh2)}
.edPlate-fig img{width:100%;height:auto;aspect-ratio:512/908;object-fit:cover;object-position:top;
  transform:scale(1.12);transition:transform 1.5s var(--e)}
.edPlate.on .edPlate-fig img{transform:scale(1)}
/* mask wipe */
.edPlate-fig::after{content:"";position:absolute;inset:0;background:var(--paper);z-index:2;
  transform-origin:top;transition:transform 1.15s var(--e)}
.edPlate.on .edPlate-fig::after{transform:scaleY(0);transform-origin:bottom}
.edPlate-cap{display:flex;align-items:baseline;gap:16px;margin-top:18px;
  padding-top:16px;border-top:1px solid var(--line)}
.edPlate-cap b{font-family:var(--d);font-size:.76rem;letter-spacing:.16em;color:var(--ac-ink);
  flex:none}
.edPlate-cap span{color:var(--mu);font-size:.92rem;line-height:1.6}

/* ==========================================================================
   STORY BLOCKS — alternating, no icon cards
   ========================================================================== */
.edStory{display:grid;gap:clamp(48px,6vw,104px)}
.edBlock{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,86px);align-items:center}
.edBlock:nth-child(even) .edBlock-fig{order:2}
.edBlock-fig{position:relative;overflow:hidden;border-radius:var(--r3);background:var(--paper2);
  box-shadow:var(--sh2)}
.edBlock-fig img{width:100%;height:auto;object-fit:cover;object-position:top;
  transform:scale(1.06);transition:transform 1.6s var(--e)}
.edBlock.on .edBlock-fig img{transform:scale(1)}
/* tall variant: narrower column, source ratio preserved */
.edBlock-fig--tall{max-width:352px}
.edBlock:nth-child(even) .edBlock-fig--tall{margin-left:auto}
.edBlock-t{display:grid;gap:20px;justify-items:start}
.edBlock-n{font-family:var(--d);font-size:.78rem;letter-spacing:.2em;color:var(--sec-ink)}
.edDiv{width:100%;height:1px;background:var(--line);position:relative;overflow:hidden;margin-top:6px}
.edDiv::after{content:"";position:absolute;inset:0;background:var(--ac);transform:scaleX(0);
  transform-origin:left;transition:transform 1.1s var(--e) .2s}
.edBlock.on .edDiv::after{transform:scaleX(1)}

/* ==========================================================================
   PRODUCT SHEET (download)
   ========================================================================== */
.edSheet{background:var(--card);border-radius:var(--r4);box-shadow:var(--sh3);
  padding:clamp(30px,4.6vw,72px)}
.edSheet-hd{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:end;
  padding-bottom:clamp(24px,3vw,38px);border-bottom:1px solid var(--line)}
.edSpecs{display:grid;grid-template-columns:repeat(5,1fr);margin-top:clamp(24px,3vw,40px)}
.edSpec{padding:4px 26px 4px 0}
.edSpec + .edSpec{border-left:1px solid var(--line);padding-left:26px}
.edSpec dt{font-size:.68rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  color:var(--mu);margin-bottom:12px}
.edSpec dd{margin:0;font-family:var(--d);font-weight:700;font-size:clamp(17px,1.6vw,22px);
  letter-spacing:-.03em}
.edSheet-ft{display:grid;grid-template-columns:1fr auto;gap:26px;align-items:center;
  margin-top:clamp(28px,3.4vw,46px);padding-top:clamp(24px,3vw,36px);border-top:1px solid var(--line)}
.edMarks{display:flex;flex-wrap:wrap;gap:22px;font-size:.76rem;color:var(--mu);letter-spacing:.06em}
.edMarks span{display:inline-flex;align-items:center;gap:8px}
.edMarks svg{width:14px;height:14px;color:var(--ac-ink);flex:none}

/* ==========================================================================
   EDITORIAL QUOTES — horizontal scroll
   ========================================================================== */
.edQuotes{display:flex;gap:clamp(20px,3vw,44px);overflow-x:auto;scroll-snap-type:x mandatory;
  padding:6px calc(50vw - min(50% - var(--gut),var(--max)/2)) 34px;
  margin-inline:calc(50% - 50vw);scrollbar-width:none}
.edQuotes::-webkit-scrollbar{display:none}
.edQ{flex:none;width:min(430px,84vw);scroll-snap-align:center;
  padding-top:clamp(30px,4vw,54px);position:relative}
.edQ::before{content:"\\201C";position:absolute;top:-.08em;left:-.04em;font-family:Georgia,serif;
  font-size:clamp(96px,12vw,168px);line-height:1;color:var(--sec);opacity:.34}
.edQ p{position:relative;font-family:var(--d);font-weight:500;
  font-size:clamp(19px,2.1vw,26px);line-height:1.34;letter-spacing:-.03em}
.edQ-w{display:flex;align-items:center;gap:14px;margin-top:clamp(22px,2.6vw,34px);
  padding-top:20px;border-top:1px solid var(--line)}
.edAv{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;flex:none;
  font-family:var(--d);font-weight:700;background:var(--ink);color:var(--paper)}
.edQ-w b{display:block;font-size:.94rem;font-weight:600}
.edQ-w small{display:block;font-size:.72rem;color:var(--mu);letter-spacing:.08em}
.edQ-w .st{margin-left:auto;color:var(--ac-ink);font-size:.8rem;letter-spacing:.1em}
.edScrollHint{display:flex;align-items:center;gap:12px;font-size:.7rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--mu)}
.edScrollHint i{display:block;width:46px;height:1px;background:var(--sec);font-style:normal}

/* ==========================================================================
   STATISTICS — massive numbers
   ========================================================================== */
.edStats{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(24px,3vw,48px)}
.edStat{padding-top:26px;border-top:1px solid var(--ink)}
.edStat b{display:block;font-family:var(--d);font-weight:700;
  font-size:clamp(46px,7.4vw,104px);line-height:.86;letter-spacing:-.06em}
.edStat span{display:block;margin-top:16px;font-size:.74rem;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;color:var(--mu)}

/* ==========================================================================
   FAQ — thin dividers
   ========================================================================== */
.edFaq{border-top:1px solid var(--line)}
.edQa{border-bottom:1px solid var(--line)}
.edQa summary{list-style:none;cursor:pointer;position:relative;
  padding:clamp(24px,3vw,38px) 64px clamp(24px,3vw,38px) 0;
  font-family:var(--d);font-weight:700;font-size:clamp(18px,2vw,25px);letter-spacing:-.03em;
  line-height:1.28;transition:color var(--f)}
.edQa summary::-webkit-details-marker{display:none}
.edQa summary:hover{color:var(--ac-ink)}
.edQa summary::after,.edQa summary::before{content:"";position:absolute;right:14px;top:50%;
  background:var(--ink);transition:transform var(--n),background var(--f)}
.edQa summary::after{width:18px;height:1px;transform:translateY(-50%)}
.edQa summary::before{width:1px;height:18px;right:22.5px;transform:translateY(-50%)}
.edQa[open] summary::before{transform:translateY(-50%) scaleY(0)}
.edQa[open] summary{color:var(--ac-ink)}
.edAns{padding:0 22% clamp(28px,3.4vw,44px) 0;color:var(--mu);font-size:1rem;line-height:1.8}

/* ==========================================================================
   CONTACT
   ========================================================================== */
.edContact{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(28px,4vw,72px);
  align-items:stretch}
.edContact-fig{position:relative;border-radius:var(--r4);overflow:hidden;background:var(--ink);
  box-shadow:var(--sh2);display:grid;place-items:center;padding:clamp(28px,4vw,56px);min-height:100%}
.edContact-fig .edPhone{width:min(228px,64%)}
.edWays{display:grid;gap:0;margin-top:30px;width:100%}
.edWay{display:flex;align-items:center;gap:16px;padding:18px 4px;
  border-top:1px solid rgba(246,244,239,.16);color:var(--paper);cursor:pointer;
  transition:padding-left var(--n)}
.edWay:last-child{border-bottom:1px solid rgba(246,244,239,.16)}
.edWay:hover{padding-left:12px}
.edWay .ic{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;flex:none;
  border:1px solid rgba(246,244,239,.3);color:var(--sec)}
.edWay .ic svg{width:17px;height:17px}
.edWay b{display:block;font-size:.94rem;font-weight:600}
.edWay small{display:block;font-size:.76rem;color:rgba(246,244,239,.58)}
.edWay .go{margin-left:auto;color:var(--sec);transition:transform var(--f)}
.edWay:hover .go{transform:translateX(5px)}
.edForm{background:var(--card);border-radius:var(--r4);box-shadow:var(--sh2);
  padding:clamp(28px,3.6vw,56px)}
.edFld{margin-bottom:22px}
.edFld label{display:block;font-size:.68rem;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;color:var(--mu);margin-bottom:10px}
.edFld input,.edFld textarea{width:100%;padding:14px 0;border:0;border-bottom:1px solid var(--line);
  background:transparent;font:inherit;font-size:1rem;color:var(--tx);border-radius:0;
  transition:border-color var(--f)}
.edFld textarea{min-height:110px;resize:vertical}
.edFld input:focus,.edFld textarea:focus{outline:none;border-bottom-color:var(--ac-ink)}
.edMsg{margin-top:16px;font-size:.9rem;color:var(--ac-ink);font-weight:500}
.edMsg[hidden]{display:none}

/* ---------------- marquee ---------------- */
.edMarqWrap{overflow:hidden;width:100%;border-block:1px solid var(--line);
  padding-block:clamp(18px,2.4vw,30px)}
.edMarq{display:flex;width:max-content;animation:edRoll var(--dur,52s) linear infinite}
.edMarqWrap:hover .edMarq{animation-play-state:paused}
@keyframes edRoll{to{transform:translateX(-50%)}}
.edMarq-i{display:inline-flex;align-items:center;gap:clamp(24px,3vw,52px);
  padding-inline:clamp(16px,2vw,30px);font-family:var(--d);font-weight:700;
  font-size:clamp(20px,2.6vw,34px);letter-spacing:-.035em;white-space:nowrap;color:var(--tx)}
.edMarq-i::after{content:"";width:9px;height:9px;border-radius:50%;background:var(--ac);flex:none}

/* game tiles */
.edTiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
  gap:clamp(12px,1.6vw,20px)}
.edTile{position:relative;overflow:hidden;border-radius:var(--r2);background:var(--card);
  box-shadow:var(--sh1);transition:transform var(--n),box-shadow var(--n)}
.edTile img{width:100%;height:auto;aspect-ratio:211/260;object-fit:cover;
  transition:transform .8s var(--e)}
.edTile figcaption{padding:12px 14px;font-size:.8rem;font-weight:600;letter-spacing:-.01em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.edTile:hover{transform:translateY(-6px);box-shadow:var(--sh2)}
.edTile:hover img{transform:scale(1.07)}
.edTile.off{display:none}
.edFilter{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:clamp(26px,3vw,40px)}
.edFilter button{padding:11px 20px;border-radius:var(--rp);min-height:44px;font-size:.82rem;
  font-weight:500;border:1px solid var(--line);background:var(--card);color:var(--tx);
  transition:all var(--f)}
.edFilter button:hover{border-color:var(--ink)}
.edFilter button.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}

/* rail (homepage lobby) */
.edRailWrap{position:relative;overflow:hidden;width:100%}
.edRail{display:flex;gap:16px;width:max-content;margin-bottom:16px;
  animation:edRoll var(--dur,70s) linear infinite}
.edRail--rev{animation-direction:reverse}
.edRailWrap:hover .edRail{animation-play-state:paused}
.edRail .edTile{flex:none;width:150px}
.edFade{position:absolute;top:0;bottom:0;width:10%;z-index:3;pointer-events:none}
.edFade.l{left:0;background:linear-gradient(90deg,var(--paper),transparent)}
.edFade.r{right:0;background:linear-gradient(270deg,var(--paper),transparent)}

/* ==========================================================================
   FOOTER
   ========================================================================== */
.edFoot{position:relative;z-index:2;background:var(--ink);color:var(--paper);
  margin-top:clamp(60px,8vw,120px);padding-top:clamp(56px,7vw,100px)}
.edFoot-brand{font-family:var(--d);font-weight:700;font-size:clamp(52px,13vw,190px);
  line-height:.84;letter-spacing:-.055em;color:var(--paper);
  padding-bottom:clamp(30px,4vw,58px);border-bottom:1px solid rgba(246,244,239,.16)}
.edFoot-g{display:grid;grid-template-columns:1.5fr .8fr .8fr 1.2fr;gap:clamp(26px,4vw,56px);
  padding:clamp(38px,5vw,66px) 0 40px}
.edFoot h4{font-size:.68rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;
  color:var(--sec);margin-bottom:20px}
.edFoot .l{display:block;padding:11px 0;color:rgba(246,244,239,.72);font-size:.92rem;
  transition:color var(--f),padding-left var(--f)}
.edFoot .l:hover{color:var(--sec);padding-left:6px}
.edFoot-b p{color:rgba(246,244,239,.6);font-size:.9rem;max-width:36ch;margin-bottom:24px}
.edNews{display:flex;gap:10px;margin-top:6px;flex-wrap:wrap}
.edNews input{flex:1 1 160px;min-width:0;padding:14px 0;border:0;
  border-bottom:1px solid rgba(246,244,239,.3);background:transparent;color:var(--paper);
  font:inherit;font-size:.92rem;border-radius:0}
.edNews input::placeholder{color:rgba(246,244,239,.45)}
.edNews input:focus{outline:none;border-bottom-color:var(--sec)}
.edSoc{display:flex;gap:12px;margin-top:26px}
.edSoc a{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;
  border:1px solid rgba(246,244,239,.28);color:var(--paper);transition:all var(--f)}
.edSoc a:hover{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.edSoc svg{width:17px;height:17px}
.edFoot-b2{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;align-items:center;
  padding:22px 0 30px;border-top:1px solid rgba(246,244,239,.16);
  font-size:.76rem;color:rgba(246,244,239,.5);letter-spacing:.06em}
.edFoot-b2 .pol{display:flex;gap:4px;flex-wrap:wrap}
.edFoot-b2 .pol a{display:inline-flex;align-items:center;min-height:44px;padding:0 12px}
.edFoot-b2 a:hover{color:var(--sec)}

.edTop{position:fixed;right:26px;bottom:26px;z-index:55;width:52px;height:52px;border-radius:50%;
  display:grid;place-items:center;background:var(--ink);color:var(--paper);
  opacity:0;visibility:hidden;transform:translateY(10px);transition:all var(--n);box-shadow:var(--sh2)}
.edTop.on{opacity:1;visibility:visible;transform:none}
.edTop:hover{background:var(--ac-ink)}
.edTop svg{width:18px;height:18px}

/* sticky download bar — unique class, used nowhere else */
.edDock{position:fixed;left:12px;right:12px;bottom:12px;z-index:56;display:none;
  align-items:center;gap:14px;padding:11px 11px 11px 20px;border-radius:var(--rp);
  background:var(--ink);color:var(--paper);box-shadow:var(--sh3);
  transform:translateY(150%);transition:transform var(--sl)}
.edDock.on{transform:none}
.edDock .edB{flex:none}
.edDock-t{flex:1 1 auto;min-width:0}
.edDock-t b{display:block;font-family:var(--d);font-size:.98rem;letter-spacing:-.03em}
.edDock-t small{display:block;font-size:.68rem;color:rgba(246,244,239,.6)}
.edProg{position:fixed;top:0;left:0;height:2px;z-index:80;width:0;background:var(--ac);
  transition:width .1s linear}

/* ---------------- gate / cookie / prose ---------------- */
.edGate{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:24px;
  background:rgba(26,26,26,.72);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.edGate[hidden]{display:none}
.edGate-c{max-width:460px;text-align:center;padding:clamp(34px,4vw,52px);border-radius:var(--r4);
  background:var(--paper);box-shadow:var(--sh3)}
.edGate-c .seal{font-family:var(--d);font-weight:700;font-size:2.6rem;letter-spacing:-.05em;
  color:var(--ac);margin-bottom:14px}
.edGate-c h2{font-size:1.6rem;margin-bottom:14px}
.edGate-c p{color:var(--mu);font-size:.95rem;margin-bottom:30px}
.edGate-c .row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.edCookie{position:fixed;left:18px;right:18px;bottom:18px;z-index:70;display:flex;gap:16px;
  align-items:center;justify-content:space-between;flex-wrap:wrap;padding:16px 22px;
  border-radius:var(--r3);background:var(--card);box-shadow:var(--sh2);font-size:.88rem;
  color:var(--mu)}
.edCookie[hidden]{display:none}

.edProse{max-width:720px}
.edProse h2{font-size:clamp(21px,2.4vw,30px);margin:clamp(34px,4vw,54px) 0 16px}
.edProse h2:first-child{margin-top:0}
.edProse p{color:var(--mu);margin-bottom:16px;font-size:1rem;line-height:1.8}
.edProse a{color:var(--ac-ink);text-decoration:underline;text-underline-offset:4px}

/* ==========================================================================
   RESPONSIVE — mobile is composed, not stacked
   ========================================================================== */
@media(max-width:1080px){
  .edStats{grid-template-columns:repeat(2,1fr);gap:clamp(28px,5vw,44px)}
  .edSpecs{grid-template-columns:repeat(3,1fr);gap:20px 0}
  .edSpec:nth-child(3n+1){border-left:0;padding-left:0}
  .edFoot-g{grid-template-columns:1fr 1fr}
}
@media(max-width:900px){
  .edMenu{display:none}
  .edNav .edB--sm{display:none}
  .edBurg{display:flex}
  .edCover-g{grid-template-columns:1fr;gap:38px}
  .edComp{min-height:clamp(360px,84vw,520px)}
  .edPhone{width:min(238px,58%)}
  .edGal{grid-template-columns:1fr;gap:34px}
  .edGal-side{position:static}
  .edPlate{max-width:340px}
  .edPlate:nth-child(even){margin-left:auto;max-width:300px}
  .edPlate:nth-child(3n){margin-left:8%;max-width:320px}
  .edBlock{grid-template-columns:1fr;gap:26px}
  .edBlock:nth-child(even) .edBlock-fig{order:0}
  .edContact{grid-template-columns:1fr}
  .edAns{padding-right:6%}
  .edSheet-hd,.edSheet-ft{grid-template-columns:1fr;align-items:start}
}
@media(max-width:720px){
  body{font-size:16px}
  .edCover{padding-top:clamp(104px,26vw,140px)}
  .edCover-top{grid-template-columns:1fr}
  .edCover-meta{gap:14px;font-size:.62rem}
  .edSpecs{grid-template-columns:1fr;gap:0}
  .edSpec{padding:16px 0;border-top:1px solid var(--line)}
  .edSpec + .edSpec{border-left:0;padding-left:0}
  .edSpec dt{margin-bottom:6px}
  .edStats{grid-template-columns:1fr;gap:30px}
  .edFoot-g{grid-template-columns:1fr;gap:34px}
  .edDock{display:flex}
  .edTop{bottom:92px;right:16px}
  .edCookie{bottom:92px}
  .edLayer.l1{top:0;left:-4%;width:32%}
  .edLayer.l2{bottom:0;right:-4%;width:32%}
  .edFloat{padding:10px 14px}
  .edFloat.f1{right:0;top:0}
  .edFloat.f2{left:0;bottom:4%}
  .edCta{width:100%}
  .edCta .edB{flex:1;min-width:170px}
  .edQ{width:min(340px,84vw)}
  .edPlate,.edPlate:nth-child(even),.edPlate:nth-child(3n){max-width:74%;margin-left:0}
  .edPlate:nth-child(even){margin-left:auto}
  .edPlate:nth-child(3n){margin-left:13%}
}
@media(max-width:420px){
  .edFloat.f2{display:none}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;
    transition-duration:.001ms !important}
  .edR,.edRv > span{opacity:1;transform:none}
  .edPlate-fig::after{transform:scaleY(0)}
  .edPlate-fig img,.edBlock-fig img{transform:none}
  .edRail,.edMarq{animation:none}
  .edGlow{display:none}
}
@media print{
  .edNav,.edDock,.edTop,.edGate,.edCookie,.edGrain,.edLight,.edGlow,.edProg{display:none !important}
  body{background:#fff}
}
