
/* ==========================================================================
   GAC Ebanisteria — landing page
   Due layout dalla grafica: desktop (frame 1920px) e mobile (frame 750px = 375px @2x).
   Ogni misura e' espressa in --s = "1px di design": a 1920px (desktop) e a 375px (mobile) coincide
   con la grafica e tra i breakpoint scala in proporzione.
   Fasce (per le animazioni): [data-fascia="hero|philosophy|chapter|statement|millimeter|form|footer"]
   ========================================================================== */
@font-face{font-family:"Lora";src:url(../fonts/lora-latin.woff2) format("woff2");font-weight:400 700;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url(../fonts/inter-latin-400-500.woff2) format("woff2");font-weight:400 500;font-style:normal;font-display:swap}
/* fallback con metriche allineate, per limitare i salti di layout durante lo swap */
@font-face{font-family:"Lora Fallback";src:local("Georgia");size-adjust:106.54%;ascent-override:94.42%;descent-override:25.72%;line-gap-override:0%}
@font-face{font-family:"Inter Fallback";src:local("Arial");size-adjust:108.59%;ascent-override:89.21%;descent-override:22.21%;line-gap-override:0%}

:root{
  --white:#fff; --black:#000; --ink:#1a1a1a;
  --olive:#2d2e1f; --stone:#beb9af; --stone-ink:#c0bcb2;
  --serif:"Lora","Lora Fallback",Georgia,"Times New Roman",serif;
  --sans:"Inter","Inter Fallback",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--white);color:var(--black);font-family:var(--sans);font-weight:500;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
h1,h2,p,ul,figure,form{margin:0;padding:0}
ul{list-style:none}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid currentColor;outline-offset:3px}
img,video,svg{display:block}
picture{display:contents}
.sprite{position:absolute;width:0;height:0}
.sr{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.fill{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.site{container-type:inline-size;margin-inline:auto;overflow:clip}
.site section,.site header,.site footer,.site figure{position:relative}
.logo{position:absolute;color:var(--white);line-height:0}
.logo svg{width:100%;height:auto}
.eyebrow{text-transform:uppercase}
.btn{display:block;text-transform:uppercase;white-space:nowrap;background:none;cursor:pointer;transition:color .2s,border-color .2s}
.stm{display:inline}
.hero__media,.story__media{position:absolute;inset:0;overflow:hidden;background:#d9d9d9}
.hero{overflow:clip}

/* ============================ DESKTOP (>= 1024px) ============================ */
@media (min-width:1024px){
  .site{max-width:3840px;--s:calc(100cqw / 1920)}
  .m{display:none}

  /* hero 0-1080 */
  .hero{height:100vh;height:100svh;min-height:max(520px,calc(560 * var(--s)));color:var(--white)}
  .hero__media{transform:scale(1.036);transform-origin:50% 100%}
  .hero__shade{display:none}
  .hero .logo{left:calc(95 * var(--s));top:calc(70 * var(--s));width:calc(280 * var(--s))}
  .hero__title{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);text-align:center;font:600 calc(87.82 * var(--s))/1.2 var(--serif)}
  .hero__tagline{position:absolute;left:calc(81 * var(--s));bottom:calc(68 * var(--s));font:500 max(14px,calc(24 * var(--s)))/calc(29 * var(--s)) var(--sans)}

  /* intro 1080-1878 */
  .intro{height:calc(798 * var(--s));display:flex;align-items:center}
  .intro__text{padding-left:calc(79.5 * var(--s));padding-right:calc(50 * var(--s));text-indent:calc(346.94 * var(--s));font:500 calc(63.59 * var(--s))/calc(67 * var(--s)) var(--serif)}

  /* chapter 1878-3149 */
  .chapter{height:calc(1271 * var(--s))}
  .chapter__brass{position:absolute;left:0;top:0;width:calc(837 * var(--s));height:100%;overflow:hidden}
  .chapter__brass .chapter__img{position:absolute;left:0;top:0;width:calc(837 * var(--s));height:100%;object-fit:cover}
  .chapter__ebano{position:absolute;left:calc(609 * var(--s));top:calc(168 * var(--s));width:calc(506 * var(--s));height:calc(509 * var(--s));box-shadow:0 calc(4 * var(--s)) calc(4 * var(--s)) rgba(0,0,0,.25)}
  .chapter__ebano .chapter__img{width:100%;height:100%;object-fit:cover}
  .chapter__content{position:absolute;left:calc(1118 * var(--s));top:calc(439 * var(--s));width:calc(640 * var(--s));text-align:center}
  .eyebrow{font:500 max(11px,calc(16 * var(--s)))/calc(20 * var(--s)) var(--sans);letter-spacing:.0143em}
  .chapter__text{margin-top:calc(67 * var(--s));font:500 calc(38.71 * var(--s))/calc(45 * var(--s)) var(--serif)}
  .chapter .btn{width:max-content;margin:calc(88 * var(--s)) auto 0;height:calc(50 * var(--s));padding:0 calc(21.65 * var(--s));border:1px solid var(--stone);border-radius:calc(25 * var(--s));color:var(--stone-ink);font:500 max(11px,calc(14.5 * var(--s)))/calc(48 * var(--s)) var(--sans);letter-spacing:.1em}
  .chapter .btn:hover{color:var(--black);border-color:var(--black)}

  /* statement 3149-4390 */
  .statement{height:calc(1241 * var(--s));padding-top:calc(565 * var(--s));text-align:center}
  .statement__text{font:500 calc(38.71 * var(--s))/calc(45 * var(--s)) var(--serif)}
  .stm--1{font-weight:700}

  /* millimeter 4390-5475 */
  .story{height:calc(1085 * var(--s));color:var(--white)}
  .story figcaption{position:absolute;left:calc(125 * var(--s));top:calc(944 * var(--s));font:500 max(14px,calc(24 * var(--s)))/calc(29 * var(--s)) var(--sans)}

  /* form 5475-6616 */
  .contact{height:calc(1141 * var(--s))}
  .contact__title{position:absolute;left:0;right:0;top:calc(418 * var(--s));text-align:center;font:500 calc(43.66 * var(--s))/calc(52 * var(--s)) var(--serif)}
  .form input{position:absolute;left:calc(669 * var(--s));width:calc(582 * var(--s));height:calc(55 * var(--s));padding:0 calc(36 * var(--s));border:1px solid var(--stone);border-radius:calc(11 * var(--s));background:none;color:var(--black);font:400 max(11px,calc(14 * var(--s))) var(--sans);appearance:none;-webkit-appearance:none}
  .form input::placeholder{color:var(--stone-ink);opacity:1}
  .form input[name=project]{top:calc(510 * var(--s))}
  .form input[name=email]{top:calc(575 * var(--s))}
  .btn--form{position:absolute;left:calc(857 * var(--s));top:calc(667 * var(--s));width:calc(208 * var(--s));height:calc(55 * var(--s));border:1px solid var(--black);border-radius:999px;color:var(--black);font:400 max(11px,calc(16 * var(--s))) var(--sans);letter-spacing:.11em;padding:0}
  .btn--form:hover{background:var(--black);color:var(--white)}

  /* footer 6616-7590 */
  .footer{height:calc(974 * var(--s));background:var(--olive);color:var(--white)}
  .footer__eyebrow{position:absolute;left:0;right:0;top:calc(151 * var(--s));text-align:center}
  .footer .logo{left:calc(135 * var(--s));top:calc(611 * var(--s));width:calc(204 * var(--s))}
  .footer__list{position:absolute;left:calc(729 * var(--s));top:calc(567 * var(--s));width:calc(465 * var(--s))}
  .footer__row{position:relative;display:block;height:calc(95 * var(--s));border-top:1px solid #9f9f9f}
  .footer__list li:last-child{border-bottom:1px solid #9f9f9f}
  .footer__list li:last-child .footer__row{height:calc(96 * var(--s))}
  .footer__label{position:absolute;left:0;top:calc(27 * var(--s));font:500 max(16px,calc(29.75 * var(--s)))/calc(38 * var(--s)) var(--serif)}
  .footer__mail{position:absolute;right:0;top:calc(38 * var(--s));font:500 max(12px,calc(18 * var(--s)))/calc(22 * var(--s)) var(--sans)}
  .footer__arrow{position:absolute;left:calc(546 * var(--s));top:calc(26 * var(--s));width:calc(44 * var(--s));height:calc(44 * var(--s))}
  .footer__row:hover .footer__mail{text-decoration:underline}
  .footer__nav,.footer__copy{position:absolute;left:calc(1577 * var(--s));font:500 max(10.5px,calc(11.45 * var(--s)))/max(1.5em,calc(23 * var(--s))) var(--sans)}
  .footer__nav{top:calc(563 * var(--s))}
  .footer__nav a:hover{text-decoration:underline}
  .footer__copy{top:calc(741 * var(--s))}
}
@supports not (width:1cqw){@media (min-width:1024px){.site{--s:calc(min(100vw,3840px) / 1920)}}}

/* ============================ MOBILE (< 1024px) ============================ */
@media (max-width:1023.98px){
  .site{--s:calc(min(100cqw,600px) / 750);--g:max(0px,calc((100cqw - 600px) / 2))}
  .d{display:none}

  /* hero */
  .hero{height:max(480px,100svh);color:var(--white)}
  .hero__media{transform:scale(1.012);transform-origin:50% 0}
  .hero__shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.62) 0%,rgba(0,0,0,.54) 8%,rgba(0,0,0,.48) 17%,rgba(0,0,0,.33) 27%,rgba(0,0,0,.19) 37%,rgba(0,0,0,.16) 41%,rgba(0,0,0,.21) 50%,rgba(0,0,0,.27) 55%,rgba(0,0,0,.385) 65%,rgba(0,0,0,.52) 80%,rgba(0,0,0,.67) 100%)}
  .hero .logo{left:calc(var(--g) + 292 * var(--s));top:calc(44 * var(--s));width:calc(167 * var(--s))}
  .hero__title{position:absolute;left:0;right:0;top:calc(50% + 3 * var(--s));transform:translateY(-50%);text-align:center;font:600 calc(76 * var(--s))/1.2 var(--serif)}
  .hero__tagline{position:absolute;left:calc(var(--g) + 72 * var(--s));width:calc(576 * var(--s));bottom:calc(74 * var(--s));text-align:center;color:#d3d2d1;font:400 max(11px,calc(26 * var(--s)))/calc(32 * var(--s)) var(--sans)}

  /* philosophy */
  .intro{height:calc(1892 * var(--s));padding:calc(458 * var(--s)) calc(var(--g) + 48 * var(--s)) 0;text-align:center;color:var(--ink)}
  .intro .eyebrow{font:400 max(9px,calc(22 * var(--s)))/calc(24 * var(--s)) var(--serif);letter-spacing:.035em;margin-bottom:calc(47 * var(--s))}
  .intro__text{font:600 calc(60 * var(--s))/calc(72 * var(--s)) var(--serif)}

  /* chapter */
  .chapter{color:var(--ink);text-align:center}
  .chapter__media{position:relative;height:calc(904 * var(--s))}
  .chapter__brass{position:absolute;left:var(--g);top:calc(64 * var(--s));width:calc(580 * var(--s));height:calc(840 * var(--s));overflow:hidden;border-radius:calc(8 * var(--s))}
  .chapter__ebano{position:absolute;left:calc(var(--g) + 400 * var(--s));top:0;width:calc(350 * var(--s));height:calc(520 * var(--s));overflow:hidden;border-radius:calc(8 * var(--s))}
  .chapter__img{width:100%;height:100%;object-fit:cover}
  .chapter__content{padding:calc(632 * var(--s)) calc(var(--g) + 48 * var(--s)) calc(548 * var(--s))}
  .eyebrow--chapter,.chapter .eyebrow{font:400 max(9px,calc(22 * var(--s)))/calc(24 * var(--s)) var(--serif);letter-spacing:.035em}
  .chapter__text{margin-top:calc(47 * var(--s));font:500 calc(60 * var(--s))/calc(72 * var(--s)) var(--serif)}
  .chapter .btn{width:calc(520 * var(--s));height:calc(104 * var(--s));margin:calc(52 * var(--s)) auto 0;border:max(1px,calc(2 * var(--s))) solid var(--ink);border-radius:999px;color:var(--ink);font:500 max(9px,calc(22 * var(--s)))/calc(100 * var(--s)) var(--serif);letter-spacing:.12em}

  /* statement */
  .statement{padding:calc(5 * var(--s)) 0 calc(670 * var(--s));text-align:center}
  .statement__text{font:400 calc(60 * var(--s))/calc(66 * var(--s)) var(--serif);color:var(--ink)}
  .stm--1{font-weight:700}
  .stm--2,.stm--3{color:#9e9e9e}

  /* millimeter */
  .story__media{position:relative;inset:auto;height:calc(894 * var(--s))}
  .story figcaption{padding:calc(56 * var(--s)) calc(var(--g) + 60 * var(--s)) 0 0;text-align:right;color:#595959;font:500 max(10px,calc(26 * var(--s)))/calc(32 * var(--s)) var(--sans);min-height:calc(184 * var(--s))}

  /* form */
  .contact{height:calc(1113 * var(--s))}
  .contact__title{position:absolute;left:0;right:0;top:calc(335 * var(--s));text-align:center;color:var(--black);font:500 calc(42.7 * var(--s))/calc(52 * var(--s)) var(--serif)}
  .form input{position:absolute;left:calc(var(--g) + 91 * var(--s));width:calc(570 * var(--s));height:calc(53 * var(--s));padding:0 calc(36 * var(--s));border:1px solid #d6d4cd;border-radius:calc(10 * var(--s));background:none;color:var(--black);font:400 16px var(--sans);appearance:none;-webkit-appearance:none}
  .form input::placeholder{color:var(--stone-ink);opacity:1;font-size:max(7px,calc(13.8 * var(--s)))}
  .form input[name=project]{top:calc(423 * var(--s))}
  .form input[name=email]{top:calc(487 * var(--s))}
  .btn--form{position:absolute;left:calc(var(--g) + 273 * var(--s));top:calc(577 * var(--s));width:calc(204 * var(--s));height:calc(54 * var(--s));border:1px solid #202020;border-radius:999px;color:var(--black);font:400 max(7px,calc(15.5 * var(--s))) var(--sans);letter-spacing:.115em;padding:0}

  /* footer */
  .footer{height:calc(1702 * var(--s));background:var(--olive);color:var(--white)}
  .footer__eyebrow{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .footer__list{position:absolute;left:calc(var(--g) + 48 * var(--s));top:calc(220 * var(--s));width:calc(654 * var(--s))}
  .footer__list li{border-top:max(1px,calc(2 * var(--s))) solid #c8c2b8}
  .footer__list li:last-child{border-bottom:max(1px,calc(2 * var(--s))) solid #c8c2b8}
  .footer__row{position:relative;display:block;height:calc(224 * var(--s))}
  .footer__label{position:absolute;left:0;top:calc(51 * var(--s));font:500 calc(56 * var(--s))/calc(70 * var(--s)) var(--serif)}
  .footer__mail{position:absolute;left:calc(10 * var(--s));top:calc(136 * var(--s));font:500 max(10px,calc(25 * var(--s)))/calc(30 * var(--s)) var(--sans)}
  .footer__arrow{position:absolute;left:calc(534 * var(--s));top:calc(77 * var(--s));width:calc(88 * var(--s));height:calc(88 * var(--s))}
  .footer__list li+li .footer__arrow{left:calc(540 * var(--s))}
  .footer__list li+li .footer__mail{top:calc(140 * var(--s))}
  .footer .logo{left:calc(var(--g) + 252 * var(--s));top:calc(852 * var(--s));width:calc(222 * var(--s))}
  .footer__nav,.footer__copy{position:absolute;left:calc(var(--g) + 48 * var(--s));font:400 max(10px,calc(26 * var(--s)))/calc(50 * var(--s)) var(--serif)}
  .footer__nav{top:calc(1173 * var(--s))}
  .footer__nav a{text-decoration:underline;text-underline-offset:.12em}
  .footer__copy{top:calc(1425 * var(--s));font-size:max(10px,calc(24 * var(--s)));line-height:calc(40 * var(--s))}
}

/* ============================ ANIMAZIONI ============================
   Attive solo con JS e senza prefers-reduced-motion (classe .js sull'<html>, rimossa se lo script non parte). */
.hero__copy{position:absolute;inset:0;opacity:var(--hf,1);pointer-events:none}
.js [data-reveal]{opacity:0;translate:0 calc(34 * var(--s,1px));transition:opacity 1s cubic-bezier(.2,.7,.2,1) var(--d,0s),translate 1s cubic-bezier(.2,.7,.2,1) var(--d,0s)}
.js [data-reveal].is-in{opacity:1;translate:0 0}
.js [data-wipe]{clip-path:inset(0 0 100% 0)}
.js [data-wipe].is-in{clip-path:inset(0);transition:clip-path 1.4s cubic-bezier(.65,0,.2,1)}
.js [data-wipe] .chapter__img{scale:1.18;transition:scale 2s cubic-bezier(.2,.7,.2,1)}
.js [data-wipe].is-in .chapter__img{scale:1}
.anim [data-parallax]{transform:translateY(var(--py,0px))}
.anim [data-zoom] .fill{transform:scale(calc(1.14 - .14 * var(--zp,1)))}
[data-words]{--rv-dark:#000}
@supports (color:color-mix(in srgb,red,blue)){
  .anim [data-words] .w{--p:0;color:color-mix(in srgb,var(--rv-dark) calc(var(--p) * 100%),#d2d2d2)}
}
@media (min-width:1024px){.hero__media{translate:0 var(--hp,0px)}}
@media (max-width:1023.98px){[data-words]{--rv-dark:var(--ink)}}
/* Privacy content is loaded only when the dialog is opened. */
.privacy-modal{width:min(880px,calc(100% - 32px));height:min(800px,calc(100vh - 48px));height:min(800px,calc(100dvh - 48px));max-width:none;max-height:none;margin:auto;padding:0;border:1px solid var(--stone);border-radius:16px;background:var(--white);color:var(--ink);box-shadow:0 24px 80px rgba(0,0,0,.25);overflow:hidden}
.privacy-modal::backdrop{background:rgba(26,26,26,.65)}
.privacy-modal[open]{display:flex;flex-direction:column}
.privacy-modal__header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;border-bottom:1px solid var(--stone)}
.privacy-modal__title{font:500 24px/1.3 var(--serif)}
.privacy-modal__close{flex-shrink:0;min-width:44px;min-height:44px;padding:8px 16px;border:1px solid var(--stone);border-radius:999px;background:none;color:inherit;cursor:pointer;font:500 14px/1.4 var(--sans)}
.privacy-modal__close:hover{background:var(--olive);color:var(--white)}
.privacy-modal__frame{display:block;flex:1;min-height:0;width:100%;border:0;background:var(--white)}
@media(max-width:600px){.privacy-modal{width:calc(100% - 16px);height:calc(100vh - 24px);height:calc(100dvh - 24px);border-radius:12px}.privacy-modal__header{padding:14px 16px}.privacy-modal__title{font-size:20px}}

/* Vimeo riempie la hero mantenendo le proporzioni del video. */
.hero__vimeo{position:absolute;inset:0;overflow:hidden;opacity:0;pointer-events:none;transition:opacity .6s}
.hero__vimeo.is-playing{opacity:1}
.hero__vimeo iframe{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:block;border:0;max-width:none}
@media(prefers-reduced-motion:reduce){.hero__vimeo{display:none}}

/* Dati societari nel footer. */
.footer__company{position:absolute;font:400 12px/1.7 var(--sans);overflow-wrap:anywhere}
.footer__company p{margin:0}
.footer__company-name{font-weight:500}
.footer__company a:hover{text-decoration:underline}
@media(min-width:1024px){.footer{min-height:calc(850 * var(--s) + 140px)}.footer__company{left:calc(135 * var(--s));right:calc(135 * var(--s));top:calc(850 * var(--s));padding:20px 0 28px;border-top:1px solid #6b6c5c}}
@media(max-width:1023.98px){.footer{min-height:calc(1535 * var(--s) + 190px)}.footer__company{left:calc(var(--g) + 48 * var(--s));right:calc(var(--g) + 48 * var(--s));top:calc(1535 * var(--s));padding:20px 0 28px;border-top:1px solid #6b6c5c}}
