/* ASSOCIAZIONE ATC — R8 MEASURED LAYOUT 2026
   Sistema geometrico verificabile: niente canvas rigidi, niente riduzioni casuali.
   Ogni composizione nasce da griglie intrinseche e breakpoint per geometria reale. */

:root{
  --r8-max: 1220px;
  --r8-edge: clamp(24px, 4vw, 64px);
  --r8-header: 82px;
}

html{overflow-x:hidden}
body{overflow-x:hidden}
.wrap{width:min(var(--r8-max),calc(100% - (var(--r8-edge) * 2)));margin-inline:auto}
h1,h2,h3,strong{overflow-wrap:normal;word-break:normal;hyphens:none;text-wrap:balance}
p{overflow-wrap:normal;word-break:normal;hyphens:auto}

/* ---------- HEADER ---------- */
.nav-shell{padding:14px var(--r8-edge) 22px}
.nav{max-width:1440px;gap:24px}
.nav-links{gap:18px}
.nav-links a{font-size:11px}
.nav-contact{padding:10px 15px}

/* ---------- HOME HERO ---------- */
.civic-hero,
.civic-hero.civic-hero--hive{
  min-height:100svh;
  height:auto;
  padding:clamp(92px,13vh,138px) 0 clamp(34px,6vh,72px);
  display:flex;
  align-items:center;
  overflow:hidden;
}
.civic-hero__content{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(300px,.92fr);
  grid-template-areas:
    "eyebrow visual"
    "title visual"
    "copy visual";
  column-gap:clamp(38px,5vw,88px);
  align-items:center;
}
.civic-eyebrow{
  grid-area:eyebrow;
  margin:0 0 clamp(14px,2.2vh,26px);
  align-self:end;
  max-width:70ch;
}
.civic-hero h1,
.civic-hero--hive h1{
  grid-area:title;
  font-size:clamp(3rem,5.45vw,6.7rem);
  line-height:.94;
  letter-spacing:-.065em;
  max-width:11.7ch;
  margin:0;
}
.civic-hero__bottom,
.civic-hero--hive .civic-hero__bottom{
  grid-area:copy;
  margin:clamp(20px,3.8vh,40px) 0 0;
  width:auto;
  max-width:52ch;
  padding:0 0 0 18px;
  border-left:2px solid var(--amber);
  background:none;
  backdrop-filter:none;
}
.civic-hero__bottom>p{font-size:clamp(.94rem,1.15vw,1.15rem);line-height:1.55;color:#c8c3b9;margin:0}
.civic-links{gap:22px;margin-top:18px}
.civic-sideword{display:none}

.hive-stage{
  grid-area:visual;
  position:relative;
  inset:auto;
  width:min(100%,520px);
  height:auto;
  aspect-ratio:1/1;
  justify-self:end;
  align-self:center;
  opacity:.86;
  z-index:1;
}
.hive-core{left:16%;top:29%;width:68%}
.civic-hero:after{right:-12vw;bottom:-22vh;width:52vw;height:52vw}

/* ---------- RECOGNITION: free but bounded, no absolute scatter ---------- */
.recognition{padding:clamp(78px,9vw,140px) 0}
.recognition__head{grid-template-columns:minmax(180px,.55fr) minmax(0,1.45fr);gap:clamp(36px,6vw,90px)}
.recognition__head h2{font-size:clamp(3.1rem,6.6vw,7.2rem);max-width:10ch}
.recognition__field{
  height:auto;
  min-height:0;
  margin-top:clamp(46px,6vw,78px);
  padding:clamp(42px,5vw,72px) 0;
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:clamp(22px,3.2vw,48px) clamp(22px,3.5vw,54px);
  align-items:start;
}
.r-word,.r-all{position:static!important;max-width:none!important;text-align:left!important;transform:none!important}
.r-a{grid-column:1/7;font-size:clamp(2.1rem,3.9vw,4.7rem)}
.r-b{grid-column:8/13;font-size:clamp(2.7rem,5.1vw,6rem)}
.r-c{grid-column:3/8;font-size:clamp(1.8rem,3vw,3.3rem)}
.r-d{grid-column:8/13;font-size:clamp(2rem,3.5vw,4rem)}
.r-e{grid-column:1/7;font-size:clamp(2.35rem,4.2vw,5rem)}
.r-f{grid-column:7/12;font-size:clamp(1.9rem,3.1vw,3.4rem)}
.r-g{grid-column:2/7;font-size:clamp(1.9rem,3vw,3.3rem)}
.r-h{grid-column:8/13;font-size:clamp(1.9rem,3vw,3.3rem)}
.r-all{grid-column:9/13;justify-self:end;font-size:11px}

/* ---------- GAE ---------- */
.gae-flagship{padding:clamp(82px,10vw,150px) 0}
.gae-flagship__grid{grid-template-columns:minmax(300px,.8fr) minmax(0,1.2fr);gap:clamp(44px,7vw,100px)}
.gae-symbol{min-height:0;aspect-ratio:1/1;width:min(100%,470px)}
.gae-flagship__copy h2{font-size:clamp(3.4rem,6.2vw,6.9rem);max-width:10ch;margin:14px 0 28px}
.gae-lead{font-size:clamp(1.08rem,1.6vw,1.42rem)}
.gae-statements{margin-top:40px;gap:24px}
.gae-link{margin-top:36px}

/* ---------- METHOD: asymmetric grid, no absolute canvas ---------- */
.civic-method{padding:clamp(84px,10vw,150px) 0}
.civic-method__intro{margin-left:0;max-width:900px;display:grid;grid-template-columns:.38fr 1.62fr;gap:clamp(30px,5vw,72px);align-items:start}
.civic-method__intro .micro{padding-top:10px}
.civic-method__intro h2{font-size:clamp(3rem,5.7vw,6.2rem);line-height:.95}
.civic-method__flow{
  position:relative;
  height:auto;
  margin-top:clamp(58px,7vw,100px);
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:clamp(44px,6vw,84px) clamp(26px,4vw,58px);
  align-items:start;
}
.civic-method__flow article,
.civic-method__flow .m-left,
.civic-method__flow .m-right,
.civic-method__flow .m-center,
.civic-method__flow .m-left.lower,
.civic-method__flow .m-right.lower{
  position:static;
  width:auto;
  margin:0;
  text-align:left;
  justify-self:stretch;
}
.civic-method__flow article:nth-child(1){grid-column:1/6}
.civic-method__flow article:nth-child(2){grid-column:7/13;margin-top:clamp(36px,6vw,80px)}
.civic-method__flow article:nth-child(3){grid-column:4/10}
.civic-method__flow article:nth-child(4){grid-column:1/6;margin-top:clamp(20px,3vw,44px)}
.civic-method__flow article:nth-child(5){grid-column:8/13;margin-top:clamp(58px,8vw,110px)}
.civic-method__flow strong{font-size:clamp(2.8rem,4.9vw,5.6rem);line-height:.92}
.civic-method__flow p{font-size:clamp(.94rem,1.1vw,1.02rem);line-height:1.55;max-width:35ch;margin:12px 0 0!important}

/* ---------- OTHER HOME SECTIONS ---------- */
.history-cut{min-height:0;grid-template-columns:minmax(0,1.1fr) minmax(360px,.9fr)}
.history-cut__image{min-height:clamp(520px,58vw,760px)}
.history-cut__copy{padding:clamp(58px,7vw,110px) clamp(40px,6vw,84px)}
.history-cut__copy blockquote{font-size:clamp(2.5rem,4.5vw,4.9rem)}
.energy-signature{min-height:0;padding:clamp(92px,11vw,160px) 0}
.energy-signature__content{grid-template-columns:.4fr 1.6fr;column-gap:clamp(40px,7vw,96px)}
.energy-signature__content h2{font-size:clamp(3rem,5.6vw,6.1rem);max-width:12ch}
.civic-close{padding:clamp(90px,11vw,160px) 0}
.civic-close h2{font-size:clamp(3.2rem,6.2vw,6.7rem);max-width:14ch}
.civic-close__links{margin-left:0;margin-top:42px}

/* ---------- INTERNAL PAGE HERO ---------- */
.page-hero,
.page-hero--quiet{
  min-height:0;
  padding:clamp(126px,17vh,180px) 0 clamp(58px,8vh,92px);
  align-items:end;
}
.page-hero .wrap{
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);
  gap:clamp(42px,7vw,100px);
  align-items:end;
}
.page-hero h1{font-size:clamp(3.4rem,6.3vw,7rem);line-height:.94;max-width:12ch}
.side-note{max-width:42ch}

/* ---------- SHORT / SPLIT DESKTOP VIEWPORT ---------- */
@media (min-width:821px) and (max-height:650px){
  :root{--r8-header:68px}
  .nav-shell{padding-top:8px;padding-bottom:14px}
  .brand img{width:40px}
  .brand strong{font-size:11px}.brand small{font-size:8px}
  .nav-links a{font-size:9px}.nav-contact{font-size:10px;padding:8px 12px}

  .civic-hero,
  .civic-hero.civic-hero--hive{
    min-height:100svh;
    padding-top:78px;
    padding-bottom:26px;
  }
  .civic-hero__content{
    grid-template-columns:minmax(0,1.18fr) minmax(270px,.82fr);
    column-gap:36px;
  }
  .civic-eyebrow{font-size:8px;margin-bottom:10px}
  .civic-hero h1,.civic-hero--hive h1{font-size:clamp(2.65rem,4.75vw,3.7rem);line-height:.94;max-width:12.5ch}
  .civic-hero__bottom,.civic-hero--hive .civic-hero__bottom{margin-top:14px;max-width:55ch;padding-left:14px}
  .civic-hero__bottom>p{font-size:.78rem;line-height:1.45}
  .civic-links{margin-top:10px;gap:16px}.civic-links a{font-size:10px}
  .hive-stage{width:min(100%,360px);opacity:.72}

  .page-hero,.page-hero--quiet{padding-top:88px;padding-bottom:34px}
  .page-hero h1{font-size:clamp(2.8rem,5vw,4rem)}
  .page-hero .kicker,.page-hero .eyebrow{margin-bottom:10px}
  .side-note{font-size:.88rem}

  .recognition,.gae-flagship,.civic-method,.energy-signature,.civic-close{padding-top:72px;padding-bottom:72px}
  .recognition__field{padding-top:36px;padding-bottom:36px;gap:24px 32px}
  .civic-method__intro h2{font-size:clamp(2.7rem,4.6vw,3.9rem)}
  .civic-method__flow{margin-top:44px;gap:38px 32px}
  .civic-method__flow strong{font-size:clamp(2.45rem,4.2vw,3.5rem)}
  .civic-method__flow p{font-size:.82rem}
}

/* ---------- MID WIDTH: recomposition, not shrink ---------- */
@media (max-width:1080px) and (min-width:701px){
  .wrap{width:min(100% - 56px,1040px)}
  .nav-links{gap:12px}.nav-links a{font-size:9px}.nav{gap:15px}
  .brand img{width:42px}.brand strong{font-size:11px}.brand small{font-size:8px}
  .nav-contact{font-size:10px;padding:9px 12px}

  .civic-hero__content{grid-template-columns:minmax(0,1.15fr) minmax(260px,.85fr);column-gap:34px}
  .civic-hero h1,.civic-hero--hive h1{font-size:clamp(3rem,5.4vw,4.5rem);max-width:12ch}
  .hive-stage{width:min(100%,390px)}

  .recognition__head{grid-template-columns:1fr 2fr}
  .recognition__field{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 44px}
  .r-a,.r-b,.r-c,.r-d,.r-e,.r-f,.r-g,.r-h,.r-all{grid-column:auto!important;justify-self:start!important}
  .r-a,.r-b,.r-e{font-size:clamp(2.4rem,5vw,3.8rem)}
  .r-c,.r-d,.r-f,.r-g,.r-h{font-size:clamp(1.85rem,3.5vw,2.8rem)}
  .r-all{grid-column:2!important;justify-self:end!important}

  .gae-flagship__grid{grid-template-columns:minmax(260px,.75fr) minmax(0,1.25fr);gap:42px}
  .gae-flagship__copy h2{font-size:clamp(3rem,5.5vw,4.8rem)}
  .gae-statements{grid-template-columns:1fr;gap:16px}

  .civic-method__intro{grid-template-columns:1fr 2.3fr}
  .civic-method__flow article:nth-child(1){grid-column:1/7}
  .civic-method__flow article:nth-child(2){grid-column:7/13}
  .civic-method__flow article:nth-child(3){grid-column:3/11}
  .civic-method__flow article:nth-child(4){grid-column:1/7}
  .civic-method__flow article:nth-child(5){grid-column:7/13}

  .history-cut{grid-template-columns:1fr 1fr}
  .page-hero .wrap{grid-template-columns:minmax(0,1.2fr) minmax(240px,.8fr)}
}

/* ---------- MOBILE ---------- */
@media (max-width:700px){
  :root{--r8-edge:20px}
  .wrap{width:calc(100% - 40px)}
  .civic-hero,.civic-hero.civic-hero--hive{min-height:0;padding:118px 0 54px;align-items:start}
  .civic-hero__content{display:block}
  .civic-eyebrow{font-size:9px;margin-bottom:18px;max-width:31ch}
  .civic-hero h1,.civic-hero--hive h1{font-size:clamp(3rem,13vw,4.9rem);max-width:9.8ch;line-height:.92;position:relative;z-index:2}
  .hive-stage{position:absolute;right:-38vw;top:92px;width:112vw;max-width:none;opacity:.35}
  .hive-core{display:block;opacity:.6}
  .civic-hero__bottom,.civic-hero--hive .civic-hero__bottom{position:relative;z-index:2;margin-top:40px;width:100%;max-width:34ch;padding-left:14px}
  .civic-hero__bottom>p{font-size:.98rem}
  .civic-links{gap:18px}

  .recognition__head{display:block}.recognition__head h2{margin-top:20px;font-size:clamp(3rem,14vw,5.1rem)}
  .recognition__field{grid-template-columns:1fr;padding:36px 0;gap:28px}
  .r-a,.r-b,.r-c,.r-d,.r-e,.r-f,.r-g,.r-h,.r-all{grid-column:1!important;justify-self:start!important;font-size:clamp(1.9rem,8vw,3.2rem)!important}
  .r-all{font-size:11px!important;margin-top:10px}

  .gae-flagship__grid{grid-template-columns:1fr}.gae-symbol{width:min(72vw,340px);margin:0 auto 22px}.gae-flagship__copy h2{font-size:clamp(3.2rem,14vw,5.5rem)}
  .gae-statements{grid-template-columns:1fr}

  .civic-method__intro{display:block}.civic-method__intro h2{margin-top:18px;font-size:clamp(3rem,13vw,5rem)}
  .civic-method__flow{grid-template-columns:1fr;gap:44px;margin-top:54px}
  .civic-method__flow article:nth-child(n){grid-column:1!important;margin:0!important}
  .civic-method__flow strong{font-size:clamp(2.8rem,12vw,4.5rem)}

  .history-cut{grid-template-columns:1fr}.history-cut__image{min-height:58vh}.history-cut__copy{padding:54px 20px 74px}
  .energy-signature__content{display:block}.energy-signature__content h2{margin-top:18px;font-size:clamp(3rem,13vw,5rem)}
  .energy-signature__content>p:not(.micro){margin-top:22px}
  .civic-close h2{font-size:clamp(3rem,13vw,5rem)}

  .page-hero,.page-hero--quiet{padding:120px 0 56px}
  .page-hero .wrap{display:block}.page-hero h1{font-size:clamp(3rem,13vw,5rem);max-width:10ch}.side-note{margin-top:34px}
}