/* =========================================================
   SAN GIUSTO SCHERMA — stile condiviso
   Basato su san-giusto-scherma-attivita.html
   ========================================================= */

/* ---------- font locali (self-hosted, no chiamate esterne a Google) ---------- */
@font-face{
  font-family:'Bebas Neue';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url('../fonts/BebasNeue-Regular.ttf') format('truetype');
}
@font-face{
  font-family:'IBM Plex Mono';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url('../fonts/IBMPlexMono-Regular.ttf') format('truetype');
}
@font-face{
  font-family:'IBM Plex Mono';
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url('../fonts/IBMPlexMono-Medium.ttf') format('truetype');
}
@font-face{
  font-family:'IBM Plex Mono';
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url('../fonts/IBMPlexMono-SemiBold.ttf') format('truetype');
}
@font-face{
  font-family:'Inter';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url('../fonts/Inter-Regular.ttf') format('truetype');
}
@font-face{
  font-family:'Inter';
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url('../fonts/Inter-Medium.ttf') format('truetype');
}
@font-face{
  font-family:'Inter';
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url('../fonts/Inter-SemiBold.ttf') format('truetype');
}
@font-face{
  font-family:'Inter';
  font-style:normal;
  font-weight:700;
  font-display:swap;
  src:url('../fonts/Inter-Bold.ttf') format('truetype');
}

:root{
  --ink:#14161a;
  --ink-2:#1b1e23;
  --paper:#f3efe6;
  --red:#c8102e;
  --steel:#8b95a1;
  --steel-dim:#454b53;
  --gold:#3e6c96;
  --verderamina:#5b7a5d;
  --line:rgba(243,239,230,0.14);
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--ink);
  color:var(--paper);
  font-family:'Inter',sans-serif;
  line-height:1.5;
  overflow-x:hidden;
}
::selection{background:var(--red); color:var(--paper);}
img{max-width:100%; display:block;}
a{color:inherit;}

/* ---------- utility ---------- */
.wrap{max-width:1040px; margin:0 auto; padding:0 28px;}
.eyebrow{
  font-family:'IBM Plex Mono',monospace;
  font-size:12px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--steel);
}
.disp{font-family:'Bebas Neue',sans-serif; letter-spacing:0.01em; line-height:0.92;}
.tag{
  font-family:'IBM Plex Mono',monospace;
  font-size:12px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  padding:5px 10px;
  border:1px solid currentColor;
  display:inline-block;
  margin-bottom:22px;
}
.btn{
  display:inline-block;
  font-family:'IBM Plex Mono',monospace;
  font-size:12.5px;
  text-transform:uppercase;
  letter-spacing:0.08em;
  color:var(--ink);
  background:var(--paper);
  padding:14px 24px;
  border:1px solid var(--paper);
  text-decoration:none;
  transition:background .2s, color .2s;
}
.btn:hover{background:transparent; color:var(--paper);}
.btn.outline{background:transparent; color:var(--paper);}
.btn.outline:hover{background:var(--paper); color:var(--ink);}
.btn.red{background:var(--red); color:var(--paper); border-color:var(--red);}
.btn.red:hover{background:transparent; color:var(--red);}

/* =========================================================
   SITE HEADER
   ========================================================= */
header.site{
  position:sticky; top:0; z-index:40;
  background:rgba(20,22,26,0.92);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
header.site .bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:10px 28px;
  max-width:1160px;
  margin:0 auto;
  position:relative;
}
header.site .brand{display:flex; align-items:center; gap:12px; text-decoration:none;}
header.site .brand img{height:78px; width:auto;}
.header-sponsor{display:flex; align-items:center; gap:9px;}
.header-sponsor .lbl{font-family:'IBM Plex Mono',monospace; font-size:10px; text-transform:uppercase; letter-spacing:0.1em; color:var(--steel-dim);}
.header-sponsor img{height:48px; width:auto; display:block;}
@media (max-width:1100px){
  .header-sponsor{display:none;}
}
header.site .brand .brandtext{
  font-family:'Bebas Neue',sans-serif;
  font-size:20px;
  letter-spacing:0.03em;
  color:var(--paper);
  line-height:1;
  display:none;
}
nav.mainnav{display:flex; align-items:center; gap:4px;}
nav.mainnav a{
  font-family:'IBM Plex Mono',monospace;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:0.07em;
  color:var(--steel);
  text-decoration:none;
  padding:10px 14px;
  border-bottom:2px solid transparent;
  transition:color .2s, border-color .2s;
  white-space:nowrap;
}
nav.mainnav a:hover{color:var(--paper);}
nav.mainnav a.active{color:var(--paper); border-color:var(--red);}

.menu-toggle{display:none;}
.menu-btn{
  display:none;
  width:38px; height:38px;
  border:1px solid var(--line);
  background:transparent;
  color:var(--paper);
  align-items:center; justify-content:center;
  cursor:pointer;
  font-size:16px;
}

@media (max-width:860px){
  nav.mainnav{
    position:absolute;
    top:100%; left:0; right:0;
    flex-direction:column;
    align-items:stretch;
    background:var(--ink);
    border-bottom:1px solid var(--line);
    max-height:0;
    overflow:hidden;
    transition:max-height .25s ease;
  }
  nav.mainnav a{padding:14px 28px; border-bottom:1px solid var(--line); border-left:2px solid transparent;}
  nav.mainnav a.active{border-left-color:var(--red); border-bottom-color:var(--line);}
  .menu-btn{display:flex;}
  .menu-toggle:checked ~ nav.mainnav{max-height:420px;}
}

/* =========================================================
   PAGE HERO (typographic, con "lama")
   ========================================================= */
header.pagehero{
  position:relative;
  padding:80px 0 64px;
  border-bottom:1px solid var(--line);
  overflow:hidden;
  background-image:
    linear-gradient(90deg, var(--ink) 0%, var(--ink) 40%, rgba(20,22,26,0.72) 58%, rgba(20,22,26,0.3) 78%, rgba(20,22,26,0.5) 100%),
    url('../img/bg-header-fencing.jpg');
  background-position:0 0, right center;
  background-size:100% 100%, cover;
  background-repeat:no-repeat, no-repeat;
}
@media (max-width:860px){
  header.pagehero{background-image:none;}
}
header.pagehero-club{
  background-image:
    linear-gradient(90deg, var(--ink) 0%, var(--ink) 40%, rgba(20,22,26,0.72) 58%, rgba(20,22,26,0.3) 78%, rgba(20,22,26,0.5) 100%),
    url('../img/bg-header-club.jpg?v=2');
}
header.pagehero-attivita{
  background-image:
    linear-gradient(90deg, var(--ink) 0%, var(--ink) 40%, rgba(20,22,26,0.72) 58%, rgba(20,22,26,0.3) 78%, rgba(20,22,26,0.5) 100%),
    url('../img/bg-header-attivita.jpg?v=2');
}
header.pagehero-news{
  background-image:
    linear-gradient(90deg, var(--ink) 0%, var(--ink) 40%, rgba(20,22,26,0.72) 58%, rgba(20,22,26,0.3) 78%, rgba(20,22,26,0.5) 100%),
    url('../img/bg-header-news.jpg?v=12');
}
header.pagehero-calendari{
  background-image:
    linear-gradient(90deg, var(--ink) 0%, var(--ink) 40%, rgba(20,22,26,0.72) 58%, rgba(20,22,26,0.3) 78%, rgba(20,22,26,0.5) 100%),
    url('../img/bg-header-calendari.jpg?v=2');
}
header.pagehero-contatti{
  background-image:
    linear-gradient(90deg, var(--ink) 0%, var(--ink) 40%, rgba(20,22,26,0.72) 58%, rgba(20,22,26,0.3) 78%, rgba(20,22,26,0.5) 100%),
    url('../img/bg-header-contatti.jpg?v=2');
}
header.pagehero-documenti{
  padding:104px 0 92px;
  background-image:
    linear-gradient(90deg, var(--ink) 0%, var(--ink) 45%, rgba(20,22,26,0.85) 55%, rgba(20,22,26,0.5) 65%, rgba(20,22,26,0.2) 75%, rgba(20,22,26,0.08) 88%, rgba(20,22,26,0.08) 100%),
    url('../img/bg-header-documenti.jpg?v=6');
  background-position:0 0, right center;
  background-size:100% 100%, auto 145%;
  background-repeat:no-repeat, no-repeat;
}
header.pagehero .blade{
  position:absolute;
  top:-10%;
  right:6%;
  width:2px;
  height:130%;
  background:linear-gradient(180deg, transparent, var(--red) 30%, var(--red) 70%, transparent);
  transform:rotate(14deg);
  transform-origin:top;
  animation:draw 1.4s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes draw{ from{ clip-path:inset(0 0 100% 0);} to{ clip-path:inset(0 0 0% 0);} }
header.pagehero .wrap{position:relative; z-index:2;}
header.pagehero .eyebrow{margin-bottom:20px;}
header.pagehero h1.disp{
  font-size:clamp(36px, 6.4vw, 76px);
  text-transform:uppercase;
  color:var(--paper);
}
header.pagehero h1.disp span{color:var(--red);}
header.pagehero .sub{
  margin-top:22px;
  max-width:560px;
  color:var(--steel);
  font-size:16px;
}

/* home hero, un po' piu' alto */
header.homehero{padding:110px 0 84px;}
header.homehero h1.disp{font-size:clamp(40px, 7vw, 92px);}

/* ---------- category sub-nav (dentro le pagine lunghe) ---------- */
nav.catnav{
  position:sticky; top:99px; z-index:30;
  background:rgba(20,22,26,0.96);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
nav.catnav .wrap{display:flex; gap:0; overflow-x:auto;}
nav.catnav a{
  font-family:'IBM Plex Mono',monospace;
  font-size:12.5px;
  text-transform:uppercase;
  letter-spacing:0.08em;
  color:var(--steel);
  text-decoration:none;
  padding:16px 20px;
  white-space:nowrap;
  border-bottom:2px solid transparent;
  transition:color .2s, border-color .2s;
}
nav.catnav a:hover{color:var(--paper); border-color:var(--steel);}
nav.catnav a.r:hover{border-color:var(--red); color:var(--paper);}

/* ---------- section shell ---------- */
section.cat{
  padding:80px 0;
  border-bottom:1px solid var(--line);
  color:var(--steel);
}
section.cat h2.disp{
  font-size:clamp(30px,4.8vw,50px);
  text-transform:uppercase;
  margin-bottom:14px;
  color:var(--paper);
}
.cat-desc{color:var(--steel); max-width:560px; font-size:15.5px; margin-bottom:48px;}

/* ---------- info grid ---------- */
.info-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line);}
.info-cell{background:var(--ink); padding:26px;}
.info-cell .num{font-family:'IBM Plex Mono',monospace; font-size:22px; color:var(--paper); margin-bottom:6px;}
.info-cell .lbl{font-size:12.5px; color:var(--steel);}
@media(max-width:640px){ .info-grid{grid-template-columns:1fr 1fr;} }

/* ---------- piste ruler (schedule) ---------- */
.piste{margin-bottom:52px;}
.piste-ruler{position:relative; height:26px; margin-left:118px; border-bottom:1px solid var(--line);}
.piste-ruler .tick{position:absolute; bottom:0; width:1px; height:8px; background:var(--steel-dim);}
.piste-ruler .tick span{position:absolute; top:-20px; left:50%; transform:translateX(-50%); font-family:'IBM Plex Mono',monospace; font-size:10px; color:var(--steel);}
.piste-row{display:flex; align-items:center; height:46px; position:relative;}
.piste-row .day{width:118px; flex-shrink:0; font-family:'IBM Plex Mono',monospace; font-size:12px; text-transform:uppercase; letter-spacing:0.06em; color:var(--paper);}
.piste-row .track{position:relative; flex:1; height:100%; border-top:1px dashed var(--line);}
.piste-row .bar{position:absolute; top:9px; height:28px; min-width:max-content; border-radius:2px; display:flex; align-items:center; padding:0 10px; font-family:'IBM Plex Mono',monospace; font-size:11px; font-weight:500; color:var(--ink); white-space:nowrap;}
.bar.principianti{background:var(--verderamina); color:var(--paper);}
.bar.under14{background:var(--gold); color:var(--paper);}
.bar.assoluti{background:var(--red); color:var(--paper);}
.legend{display:flex; gap:22px; margin:16px 0 0 118px; flex-wrap:wrap;}
.legend div{display:flex; align-items:center; gap:8px; font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--steel); text-transform:uppercase; letter-spacing:0.05em;}
.legend .dot{width:10px; height:10px; border-radius:2px;}

@media (max-width:640px){
  .piste-ruler{margin-left:70px;}
  .piste-row .day{width:70px; font-size:10.5px;}
  .legend{margin-left:70px;}
  .piste-row .bar{font-size:9.5px; padding:0 6px;}
}

/* ---------- note / details ---------- */
.note{margin-top:28px; border-left:2px solid var(--red); padding:4px 0 4px 18px; color:var(--paper); font-size:14px; max-width:640px;}
.note b{color:var(--red);}
details{margin-top:34px; border-top:1px solid var(--line); padding-top:20px;}
details summary{cursor:pointer; font-family:'IBM Plex Mono',monospace; font-size:12.5px; text-transform:uppercase; letter-spacing:0.08em; color:var(--paper); list-style:none;}
details summary::-webkit-details-marker{display:none;}
details summary::before{content:'+ '; color:var(--red);}
details[open] summary::before{content:'\2013 ';}
details .content{padding:18px 0 4px; color:var(--steel); font-size:14.5px; max-width:640px;}
details .content p{margin-bottom:12px;}
details .content strong{color:var(--paper);}

/* ---------- payment / iban style block ---------- */
section.pay{padding:80px 0; text-align:center; border-bottom:1px solid var(--line);}
section.pay .iban{
  font-family:'IBM Plex Mono',monospace;
  font-size:clamp(18px,3vw,26px);
  letter-spacing:0.04em;
  color:var(--paper);
  border:1px solid var(--line);
  display:inline-block;
  padding:18px 26px;
  margin:20px 0;
  word-break:break-word;
}
section.pay p{color:var(--steel); max-width:520px; margin:0 auto; font-size:14.5px;}
section.pay .intestatario{margin-top:14px; color:var(--paper); font-size:14.5px;}

/* =========================================================
   CARDS — news / documenti / gallery
   ========================================================= */
.grid{display:grid; gap:1px; background:var(--line); border:1px solid var(--line);}
.grid.cols-3{grid-template-columns:repeat(3,1fr);}
.grid.cols-2{grid-template-columns:repeat(2,1fr);}
@media(max-width:760px){ .grid.cols-3, .grid.cols-2{grid-template-columns:1fr;} }
@media(max-width:760px){ .storia-split{grid-template-columns:1fr !important;} }
@media(max-width:600px){ .curriculum-split{grid-template-columns:120px 1fr !important; gap:16px !important;} }

.card{background:var(--ink); padding:30px; display:flex; flex-direction:column; gap:14px;}
.card .meta{font-family:'IBM Plex Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:0.08em; color:var(--red);}
.card h3{font-family:'Bebas Neue',sans-serif; font-size:21px; text-transform:uppercase; color:var(--paper); letter-spacing:0.01em;}
.card p{color:var(--steel); font-size:14.5px;}
.card .imgwrap{margin:-30px -30px 0; overflow:hidden; aspect-ratio:4/3;}
.card .imgwrap img{width:100%; height:100%; object-fit:cover;}
.card a.more{font-family:'IBM Plex Mono',monospace; font-size:12px; text-transform:uppercase; letter-spacing:0.06em; color:var(--paper); text-decoration:none; border-bottom:1px solid var(--red); align-self:flex-start;}

/* documenti list */
.doclist{border:1px solid var(--line); background:var(--line);}
.docrow{
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  background:var(--ink); padding:22px 26px;
}
.docrow .info{display:flex; align-items:baseline; gap:16px; flex-wrap:wrap;}
.docrow .ext{font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--red); border:1px solid var(--red); padding:2px 7px;}
.docrow h4{font-family:'Bebas Neue',sans-serif; font-size:17px; letter-spacing:0.01em; text-transform:uppercase; color:var(--paper); font-weight:400;}
.docrow .filemeta{font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--steel);}
.docrow .dl{
  font-family:'IBM Plex Mono',monospace; font-size:11.5px; text-transform:uppercase; letter-spacing:0.06em;
  color:var(--paper); text-decoration:none; padding:9px 16px; border:1px solid var(--steel-dim); white-space:nowrap;
  transition:border-color .2s, color .2s;
}
.docrow .dl:hover{border-color:var(--red); color:var(--red);}
@media(max-width:640px){ .docrow{flex-direction:column; align-items:flex-start;} }

/* ---------- timeline (calendari) ---------- */
.timeline{border-top:1px solid var(--line);}
.tl-row{
  display:grid; grid-template-columns:110px 1fr auto; gap:20px; align-items:center;
  padding:22px 0; border-bottom:1px solid var(--line);
}
.tl-row .date{font-family:'IBM Plex Mono',monospace; font-size:13px; color:var(--paper);}
.tl-row .date .day{font-family:'Bebas Neue',sans-serif; font-size:25px; color:var(--red); display:block; line-height:1;}
.tl-row .what h4{font-family:'Bebas Neue',sans-serif; font-size:18px; text-transform:uppercase; color:var(--paper); font-weight:400;}
.tl-row .what p{font-size:13.5px; color:var(--steel); margin-top:4px;}
.tl-row .cat{
  font-family:'IBM Plex Mono',monospace; font-size:10.5px; text-transform:uppercase; letter-spacing:0.08em;
  padding:5px 10px; border:1px solid currentColor; white-space:nowrap; justify-self:end;
}
@media(max-width:640px){
  .tl-row{grid-template-columns:70px 1fr; }
  .tl-row .cat{grid-column:1/-1; justify-self:start;}
}

/* ---------- contatti ---------- */
.contact-grid{display:grid; grid-template-columns:1.1fr 0.9fr; gap:1px; background:var(--line); border:1px solid var(--line);}
@media(max-width:760px){ .contact-grid{grid-template-columns:1fr;} }
.contact-grid .pane{background:var(--ink); padding:40px;}
.contact-item{margin-bottom:26px;}
.contact-item .lbl{font-family:'IBM Plex Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:0.1em; color:var(--steel); margin-bottom:6px;}
.contact-item .val{font-size:16px; color:var(--paper);}
.contact-item .val a{color:var(--paper); text-decoration:none; border-bottom:1px solid var(--red);}
.social-row{display:flex; gap:14px; margin-top:8px;}
.social-row a{
  font-family:'IBM Plex Mono',monospace; font-size:11.5px; text-transform:uppercase; letter-spacing:0.06em;
  color:var(--paper); border:1px solid var(--steel-dim); padding:9px 14px; text-decoration:none;
}
.social-row a:hover{border-color:var(--red); color:var(--red);}

form.contact-form{display:flex; flex-direction:column; gap:16px;}
form.contact-form label{font-family:'IBM Plex Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:0.08em; color:var(--steel); margin-bottom:6px; display:block;}
form.contact-form input, form.contact-form textarea{
  width:100%; background:transparent; border:1px solid var(--steel-dim); color:var(--paper);
  padding:12px 14px; font-family:'Inter',sans-serif; font-size:14.5px;
}
form.contact-form input:focus, form.contact-form textarea:focus{outline:none; border-color:var(--red);}
form.contact-form textarea{min-height:120px; resize:vertical;}

/* =========================================================
   GALLERY / PHOTO GRID
   ========================================================= */
.photo{background:var(--ink); overflow:hidden;}
.photo img{width:100%; height:100%; object-fit:cover; transition:transform .4s;}
.photo:hover img{transform:scale(1.04);}
.caption{padding:14px 0 0; font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--steel); text-transform:uppercase; letter-spacing:0.05em;}

/* ---------- news pager (attivo solo oltre 15 news) ---------- */
.pager{display:flex; align-items:center; justify-content:center; gap:10px; margin-top:52px;}
.pager a, .pager span{
  font-family:'IBM Plex Mono',monospace; font-size:12.5px; text-transform:uppercase; letter-spacing:0.06em;
  padding:10px 16px; border:1px solid var(--steel-dim); color:var(--steel); text-decoration:none;
}
.pager a:hover{border-color:var(--red); color:var(--paper);}
.pager .current{border-color:var(--red); color:var(--paper);}

footer.site{padding:56px 0 0; border-top:1px solid var(--line);}
footer.site .fgrid{display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr; gap:40px; padding-bottom:40px;}
footer.site .fcol.sponsorcol{display:flex; flex-direction:column; align-items:flex-start; gap:16px;}
footer.site .fcol.sponsorcol img{height:36px; width:auto; max-width:100%; object-fit:contain; flex-shrink:0; display:block;}
@media(max-width:760px){ footer.site .fgrid{grid-template-columns:1fr; gap:32px;} }
footer.site .fcol h5{font-family:'IBM Plex Mono',monospace; font-size:11.5px; text-transform:uppercase; letter-spacing:0.1em; color:var(--paper); margin-bottom:16px;}
footer.site .fcol p, footer.site .fcol a{font-size:13.5px; color:var(--steel); text-decoration:none; line-height:1.9;}
footer.site .fcol a:hover{color:var(--paper);}
footer.site .fcol.brandcol img{height:64px; margin-bottom:20px;}
footer.site .social-icons{display:flex; gap:12px; margin-top:10px;}
footer.site .social-icons a{color:var(--steel); display:inline-flex; transition:color .2s;}
footer.site .social-icons a:hover{color:var(--paper);}
footer.site .social-icons svg{width:20px; height:20px; display:block;}
footer.site .bottom{border-top:1px solid var(--line); padding:22px 0; display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;}
footer.site .bottom p{font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--steel-dim); letter-spacing:0.08em; margin:0;}
footer.site .bottom p a{text-decoration:none;}
footer.site .bottom p a:hover{color:var(--paper);}

/* ---------- legal / privacy page ---------- */
.legal-p{color:var(--steel); font-size:15px; line-height:1.75; max-width:720px;}
.legal-p a{color:var(--paper); border-bottom:1px solid var(--red); text-decoration:none;}
footer.site .footer-sponsor{display:flex; align-items:center; gap:9px;}
footer.site .footer-sponsor .lbl{font-family:'IBM Plex Mono',monospace; font-size:10px; text-transform:uppercase; letter-spacing:0.1em; color:var(--steel-dim);}
footer.site .footer-sponsor img{height:40px; width:auto; display:block;}
@media (max-width:640px){
  footer.site .bottom{justify-content:center;}
}