/* ================================================
   FABERPACK fp11 — Light Elegant
   #F7F9FB · #1F3A5F · #8FAF9A · #E8C547
   ================================================ */

:root {
  --bg:       #F7F9FB;
  --bg-white: #FFFFFF;
  --bg-cream: #F5F6F2;
  --bg-sage:  #EEF3EF;
  --navy:     #1F3A5F;
  --navy2:    #162d4a;
  --navy3:    #0d1f35;
  --sage:     #8FAF9A;
  --sage-dk:  #4d765b;
  --gold:     #E8C547;
  --gold-dk:  #c8a530;
  --text:     #1a2a1a;
  --text2:    #4a6050;
  --text3:    #5d7163;
  --muted:    #5a7361;
  --brd:      rgba(31,58,95,0.12);
  --brd2:     rgba(31,58,95,0.06);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:'Segoe UI',system-ui,-apple-system,sans-serif;font-size:17px;line-height:1.72;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{max-width:1160px;margin:0 auto;padding:0 2.5rem}

/* ── LANGUAGE BAR ── */
.lang-bar {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 500;
  height: 36px;
  background: var(--navy3);
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0 2.5rem;
  gap: 4px;
}
.lang-btn {
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.72);
  padding: 4px 10px;
  border: 1px solid transparent;
  background: none;
  cursor: pointer;
  transition: all 0.2s;
  font-family: inherit;
  border-radius: 2px;
}
.lang-btn:hover { color: rgba(255,255,255,0.85); }
.lang-btn.active {
  color: var(--gold);
  border-color: rgba(232,197,71,0.4);
  background: rgba(232,197,71,0.08);
}

/* ── NAV ── */
#nav {
  position: fixed;
  top: 36px; left: 0; right: 0;
  z-index: 400;
  height: 68px;
  background: rgba(247,249,251,0.97);
  backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--brd);
}
.nav-inner {
  max-width: 1160px;
  margin: 0 auto;
  padding: 0 2.5rem;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.logo { display: flex; align-items: center; gap: 0.6rem; }
.logo-img { height: 42px; width: auto; object-fit: contain; }
.logo-texts { display: flex; flex-direction: column; line-height: 1; }
.logo-name { font-size: 1.2rem; font-weight: 700; color: var(--navy); letter-spacing: 0.06em; }
.logo-sub { font-size: 0.55rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--sage-dk); margin-top: 3px; }
.nav-links { display: flex; list-style: none; gap: 1.6rem; }
.nav-links a { font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text3); transition: color 0.2s; white-space: nowrap; }
.nav-links a:hover { color: var(--navy); }
.burger { display: none; flex-direction: column; gap: 5px; background: none; border: none; cursor: pointer; padding: 4px; }
.burger span { display: block; width: 22px; height: 1.5px; background: var(--navy); }

/* ── BUTTONS ── */
.btn { display: inline-block; font-size: 0.75rem; letter-spacing: 0.08em; text-transform: uppercase; padding: 0.9rem 1.85rem; transition: all 0.2s; cursor: pointer; border: none; font-family: inherit; white-space: nowrap; }
.btn-navy { background: var(--navy); color: #fff; }
.btn-navy:hover { background: var(--navy2); transform: translateY(-1px); }
.btn-gold { background: var(--gold); color: var(--navy); font-weight: 600; }
.btn-gold:hover { background: var(--gold-dk); }
.btn-outline { border: 1.5px solid var(--navy); color: var(--navy); background: transparent; }
.btn-outline:hover { background: var(--navy); color: #fff; }
.btn-ghost-dark { display: inline-block; border: 1.5px solid rgba(255,255,255,0.3); color: rgba(255,255,255,0.85); font-size: 0.75rem; letter-spacing: 0.08em; text-transform: uppercase; padding: 0.9rem 1.85rem; background: transparent; transition: all 0.2s; white-space: nowrap; }
.btn-ghost-dark:hover { border-color: rgba(255,255,255,0.7); color: #fff; }


/* ── MISC ── */
.lbl { display: inline-block; font-size: 0.7rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--sage-dk); margin-bottom: 1rem; }
.gold-bar { width: 36px; height: 2px; background: var(--gold); display: block; margin-bottom: 1.5rem; }

/* ── TYPOGRAPHY ── */
.t-display { font-size: clamp(2.4rem,4.5vw,4.2rem); font-weight: 700; line-height: 1.06; color: var(--navy); letter-spacing: -0.02em; }
.t-display em { font-style: italic; font-weight: 400; color: var(--sage-dk); }
.t-h2 { font-size: clamp(1.6rem,2.6vw,2.3rem); font-weight: 700; line-height: 1.15; color: var(--navy); letter-spacing: -0.01em; }
.t-h2 em { font-style: italic; font-weight: 400; color: var(--sage-dk); }
.t-body { color: var(--text2); font-size: 0.97rem; line-height: 1.85; }
.t-body-lg { color: var(--text2); font-size: 1.05rem; line-height: 1.85; }

/* ── SECTIONS ── */
.sec        { padding: 7rem 0; border-bottom: 1px solid var(--brd2); }
.sec-white  { padding: 7rem 0; background: var(--bg-white); border-bottom: 1px solid var(--brd2); }
.sec-cream  { padding: 7rem 0; background: var(--bg-cream); border-bottom: 1px solid var(--brd2); }
.sec-sage   { padding: 7rem 0; background: var(--bg-sage); border-bottom: 1px solid rgba(143,175,154,0.2); }
.sec-navy   { padding: 6rem 0; background: var(--navy); }

/* page top offset */
.page-top { padding-top: calc(36px + 68px + 5rem); }

/* ── HERO ── */
.hero-wrap {
  padding-top: calc(36px + 68px);
  background: var(--bg-white);
  display: grid;
  grid-template-columns: 52% 48%;
  min-height: 100vh;
}
.hero-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 5rem 4rem 5rem 2.5rem;
}
.hero-tag { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 2.5rem; }
.hero-tag-line { width: 32px; height: 2px; background: var(--gold); flex-shrink: 0; }
.hero-cta { display: flex; gap: 1rem; flex-wrap: wrap; margin-top: 2.5rem; }
.hero-visual { overflow: hidden; background: var(--bg-sage); }
.hero-visual img { width: 100%; height: 100%; object-fit: cover; object-position: center; }

/* ── TICKER ── */
.ticker { overflow: hidden; background: var(--navy); padding: 0.75rem 0; }
.ticker-track { display: flex; gap: 2.5rem; white-space: nowrap; animation: tick 55s linear infinite; font-size: 0.68rem; letter-spacing: 0.16em; text-transform: uppercase; color: rgba(255,255,255,0.7); }
.ticker-track .sep { color: var(--gold); opacity: 0.6; }
@keyframes tick { from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* ── VALUE GRID ── */
.value-grid { display: grid; grid-template-columns: repeat(4,1fr); border: 1.5px solid var(--brd); margin-top: 3rem; }
.value-item { padding: 2rem 1.75rem; border-inline-end: 1.5px solid var(--brd); transition: background 0.2s; }
.value-item:last-child { border-inline-end: none; }
.value-item:hover { background: var(--bg-cream); }
.v-icon { font-size: 1.4rem; margin-bottom: 0.85rem; display: block; }
.v-title { font-size: 0.9rem; font-weight: 700; color: var(--navy); display: block; margin-bottom: 0.4rem; }
.v-desc { font-size: 0.82rem; color: var(--text3); line-height: 1.65; }

/* ── PARTNER ROWS ── */
.p-list { border: 1.5px solid var(--brd); background: var(--bg-white); }
.p-row { display: grid; grid-template-columns: 210px 1fr 130px; gap: 2.5rem; padding: 2.5rem 2rem; border-bottom: 1.5px solid var(--brd2); background: var(--bg-white); transition: background 0.2s; position: relative; }
.p-row:last-child { border-bottom: none; }
.p-row::before { content:''; position:absolute; inset-inline-start:0; top:0; bottom:0; width:3px; background:var(--gold); transform:scaleY(0); transform-origin:top; transition:transform 0.3s; }
.p-row:hover { background: var(--bg); }
.p-row:hover::before { transform: scaleY(1); }
.p-num { font-size: 0.68rem; letter-spacing: 0.18em; color: var(--sage-dk); display: block; margin-bottom: 0.4rem; }
.p-name { font-size: 1.1rem; font-weight: 700; color: var(--navy); display: block; margin-bottom: 0.2rem; }
.p-cat { font-size: 0.68rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); display: block; }
.p-desc { font-size: 0.9rem; color: var(--text2); line-height: 1.82; }
.p-desc strong { color: var(--navy); font-weight: 600; }
.p-geo { display: flex; flex-wrap: wrap; gap: 0.35rem; font-size: 1.15rem; }
.p-geo-lbl { font-size: 0.66rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); width: 100%; margin-top: 0.25rem; }
.p-arrow { color: var(--sage-dk); width: 100%; margin-top: 0.4rem; opacity: 0; transition: opacity 0.2s; font-size: 0.85rem; }
.p-row:hover .p-arrow { opacity: 1; }

/* ── PHOTO GRID ── */
.photo-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin-top: 2.5rem; }
.photo-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 2.5rem; }
.photo-item { position: relative; overflow: hidden; border: 1px solid var(--brd2); }
.photo-item img { width: 100%; height: 280px; object-fit: cover; transition: transform 0.5s; display: block; }
.photo-item:hover img { transform: scale(1.04); }
.photo-caption { position: absolute; bottom: 0; left: 0; right: 0; padding: 1rem 1rem 0.75rem; background: linear-gradient(to top, rgba(31,58,95,0.88), transparent); font-size: 0.65rem; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(255,255,255,0.82); }
.photo-caption strong { display: block; color: var(--gold); margin-bottom: 0.15rem; font-size: 0.68rem; }

/* ── SECTOR GRID ── */
.sector-grid { display: flex; flex-wrap: wrap; border: 1.5px solid var(--brd); }
.sector-card { flex: 1 1 calc(25% - 1.2px); padding: 1.75rem 1.5rem; background: var(--bg-white); transition: background 0.2s; }
.sector-card:hover { background: var(--bg-sage); }
.s-icon { font-size: 1.4rem; display: block; margin-bottom: 0.7rem; }
.s-name { font-size: 0.92rem; font-weight: 700; color: var(--navy); display: block; margin-bottom: 0.25rem; }
.s-reps { font-size: 0.66rem; letter-spacing: 0.07em; text-transform: uppercase; color: var(--sage-dk); display: block; }

/* ── PROD CARDS ── */
.prod-grid { display: grid; grid-template-columns: repeat(3,1fr); border: 1.5px solid var(--brd); }
.prod-card { padding: 2.5rem 2rem; border-inline-end: 1.5px solid var(--brd); border-bottom: 1.5px solid var(--brd); background: var(--bg-white); transition: background 0.2s; position: relative; }
.prod-card:nth-child(3n) { border-inline-end: none; }
.prod-card:hover { background: var(--bg); }
.prod-card::after { content:''; position:absolute; bottom:0; left:0; right:0; height:2px; background:var(--gold); transform:scaleX(0); transform-origin:left; transition:transform 0.3s; }
.prod-card:hover::after { transform: scaleX(1); }
.p-icon { font-size: 1.75rem; display: block; margin-bottom: 1.25rem; }
.p-name { font-size: 1rem; font-weight: 700; color: var(--navy); display: block; margin-bottom: 0.65rem; }
.p-desc { font-size: 0.88rem; color: var(--text2); line-height: 1.75; }
.p-rep { font-size: 0.68rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--sage-dk); display: block; margin-top: 0.85rem; }

/* ── SECTOR ROWS DETAIL ── */
.sector-row { display: grid; grid-template-columns: 190px 1fr; gap: 4rem; padding: 3.5rem 0; border-bottom: 1px solid var(--brd2); align-items: start; }
.sector-row:last-child { border-bottom: none; }
.sr-num { font-size: 0.68rem; letter-spacing: 0.2em; color: var(--sage-dk); display: block; margin-bottom: 0.3rem; }
.sr-icon { font-size: 1.8rem; display: block; margin-bottom: 0.4rem; }
.sr-name { font-size: 1.2rem; font-weight: 700; color: var(--navy); display: block; }
.sector-body p { font-size: 0.93rem; color: var(--text2); line-height: 1.88; margin-bottom: 0.75rem; }

/* ── TAGS ── */
.tags { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 1.25rem; }
.tag { background: var(--bg-sage); border: 1px solid rgba(143,175,154,0.4); color: var(--sage-dk); font-size: 0.68rem; letter-spacing: 0.07em; text-transform: uppercase; padding: 0.3rem 0.75rem; }

/* ── COMPANY BLOCKS ── */
.co-block { padding: 4.5rem 0; border-bottom: 1px solid var(--brd2); }
.co-block:last-child { border-bottom: none; }
.co-num { font-size: 0.68rem; letter-spacing: 0.18em; color: var(--sage-dk); display: block; margin-bottom: 0.4rem; }
.co-name { font-size: clamp(1.8rem,3vw,2.6rem); font-weight: 700; color: var(--navy); display: block; line-height: 1.05; margin-bottom: 0.25rem; }
.co-cat { font-size: 0.7rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); display: block; margin-bottom: 1.25rem; }
.co-desc { font-size: 0.95rem; color: var(--text2); line-height: 1.9; margin-bottom: 1rem; }
.co-link { font-size: 0.75rem; color: var(--navy); border-bottom: 1px solid var(--brd); padding-bottom: 2px; display: inline-block; margin-top: 0.5rem; transition: color 0.2s; }
.co-link:hover { color: var(--sage-dk); }
.co-highlight { background: var(--bg-sage); border-inline-start: 3px solid var(--gold); padding: 1.25rem 1.5rem; margin-top: 2rem; font-size: 0.92rem; color: var(--text2); line-height: 1.8; }

/* ── GEO ── */
.geo-cols { display: grid; grid-template-columns: repeat(3,1fr); gap: 3rem; margin-top: 3rem; }
.geo-col-title { font-size: 1rem; font-weight: 700; color: var(--navy); padding-bottom: 0.85rem; border-bottom: 2px solid var(--gold); margin-bottom: 1.5rem; display: flex; align-items: center; gap: 0.6rem; }
.geo-item { display: flex; gap: 0.75rem; padding: 0.75rem 0; border-bottom: 1px solid var(--brd2); align-items: flex-start; }
.geo-item:last-child { border-bottom: none; }
.geo-flag { font-size: 1.15rem; flex-shrink: 0; }
.geo-country { font-weight: 700; font-size: 0.88rem; color: var(--navy); display: block; }
.geo-role { font-size: 0.7rem; letter-spacing: 0.06em; color: var(--muted); margin-top: 0.15rem; display: block; line-height: 1.5; }

/* ── BIO ── */
.bio-grid { display: grid; grid-template-columns: 300px 1fr; gap: 6rem; align-items: start; }
.bio-photo img { width: 100%; aspect-ratio: 3/4; object-fit: cover; object-position: center top; display: block; }
.bio-photo-caption { padding: 1rem 0 0; }
.bio-photo-caption h3, .bio-name { font-size: 1.2rem; font-weight: 700; color: var(--navy); margin-bottom: 0.2rem; }
.bio-photo-caption span { font-size: 0.7rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--sage-dk); }
.bio-content p { color: var(--text2); font-size: 0.97rem; line-height: 1.9; margin-bottom: 1.2rem; }
.bio-facts { display: grid; grid-template-columns: 1fr 1fr; border: 1.5px solid var(--brd); margin-top: 2.5rem; }
.bio-fact { padding: 1.4rem; border-inline-end: 1.5px solid var(--brd); border-bottom: 1.5px solid var(--brd); }
.bio-fact:nth-child(2n) { border-inline-end: none; }
.bio-fact:nth-last-child(-n+2) { border-bottom: none; }
.bio-fact-lbl { font-size: 0.68rem; letter-spacing: 0.15em; text-transform: uppercase; color: var(--sage-dk); display: block; margin-bottom: 0.3rem; }
.bio-fact-val { font-size: 0.92rem; font-weight: 600; color: var(--navy); display: block; }

/* ── CONTACT ── */
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6rem; }
.contact-item { padding: 1.25rem 0; border-bottom: 1px solid var(--brd2); }
.contact-item:last-child { border-bottom: none; }
.ci-lbl { font-size: 0.7rem; letter-spacing: 0.15em; text-transform: uppercase; color: var(--sage-dk); display: block; margin-bottom: 0.35rem; }
.ci-val { font-size: 1.05rem; color: var(--navy); display: block; font-weight: 600; }
.ci-val a:hover { color: var(--sage-dk); }
.form-title { font-size: 1.5rem; font-weight: 700; color: var(--navy); margin-bottom: 2rem; }
.fg { margin-bottom: 1.4rem; }
.fg label { display: block; font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--text3); margin-bottom: 0.5rem; }
.fg input,.fg textarea,.fg select { width: 100%; background: var(--bg-white); border: 1.5px solid var(--brd); color: var(--text); padding: 0.9rem 1rem; font-size: 0.97rem; font-family: inherit; outline: none; transition: border-color 0.2s; appearance: none; border-radius: 0; }
.fg input:focus,.fg textarea:focus,.fg select:focus { border-color: var(--navy); }
.fg textarea { resize: vertical; min-height: 130px; }
#form-ok { display: none; background: var(--bg-sage); border: 1.5px solid var(--sage); color: var(--sage-dk); padding: 1rem 1.25rem; font-size: 0.82rem; margin-bottom: 1.5rem; }

/* ── REQUEST BLOCKS ── */
.request-grid { display: grid; grid-template-columns: repeat(3,1fr); border: 1.5px solid var(--brd); margin-top: 2.5rem; }
.req-item { padding: 2rem 1.75rem; border-inline-end: 1.5px solid var(--brd); background: var(--bg-white); text-align: center; transition: background 0.2s; cursor: pointer; }
.req-item:last-child { border-inline-end: none; }
.req-item:hover { background: var(--bg-sage); }
.req-item a { display: block; }
.req-icon { font-size: 1.5rem; display: block; margin-bottom: 0.75rem; }
.req-title { font-size: 0.88rem; font-weight: 700; color: var(--navy); display: block; margin-bottom: 0.4rem; }
.req-desc { font-size: 0.8rem; color: var(--text3); line-height: 1.6; }

/* ── CTA BAR ── */
.cta-bar { padding: 5.5rem 0; background: var(--navy); }
.cta-inner { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 3rem; }
.cta-inner h2 { font-size: clamp(1.6rem,2.5vw,2.2rem); font-weight: 700; color: #fff; margin-bottom: 0.4rem; }
.cta-inner p { color: rgba(255,255,255,0.6); font-size: 0.95rem; }
.cta-btns { display: flex; gap: 1rem; flex-wrap: wrap; }

/* ── LINKEDIN BLOCK ── */
.li-block { padding: 5.5rem 0; background: var(--bg-sage); text-align: center; }

/* ── FOOTER ── */
footer { background: var(--navy3); padding: 5rem 0 2.5rem; color: #fff; }
.foot-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 4rem; margin-bottom: 4rem; }
.foot-logo-wrap { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.85rem; }
.foot-logo-img { height: 34px; width: auto; object-fit: contain; }
.foot-logo-name { font-size: 1.2rem; font-weight: 700; color: #fff; letter-spacing: 0.06em; }
.foot-tagline { font-size: 0.85rem; color: rgba(255,255,255,0.68); line-height: 1.72; max-width: 300px; }
.foot-col h4, .foot-h { font-size: 0.68rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gold); margin-bottom: 1.25rem; }
.foot-col a,.foot-col span { display: block; color: rgba(255,255,255,0.7); font-size: 0.88rem; margin-bottom: 0.6rem; transition: color 0.2s; }
.foot-col a:hover { color: #fff; }
.foot-bottom { display: flex; justify-content: space-between; padding-top: 2rem; border-top: 1px solid rgba(255,255,255,0.08); font-size: 0.72rem; letter-spacing: 0.06em; color: rgba(255,255,255,0.6); }

/* ── RESPONSIVE ── */
@media(max-width:1024px){
  .hero-wrap { grid-template-columns: 1fr; }
  .hero-visual { height: 50vw; min-height: 300px; }
  .hero-content { padding: 3.5rem 2.5rem; }
  .value-grid { grid-template-columns: 1fr 1fr; }
  .bio-grid { grid-template-columns: 1fr; gap: 3rem; }
  .bio-photo img { aspect-ratio: 4/3; max-height: 380px; }
  .contact-grid { grid-template-columns: 1fr; gap: 3.5rem; }
  .geo-cols { grid-template-columns: 1fr 1fr; }
  .foot-grid { grid-template-columns: 1fr 1fr; gap: 2.5rem; }
  .cta-inner { grid-template-columns: 1fr; gap: 2rem; }
  .p-row { grid-template-columns: 1fr; gap: 1rem; }
  .sector-row { grid-template-columns: 1fr; gap: 1.5rem; }
  .nav-links { display: none; flex-direction: column; position: absolute; top: 68px; left: 0; right: 0; background: var(--bg-white); border-bottom: 1px solid var(--brd); padding: 0.5rem 0; gap: 0; }
  .nav-links.open { display: flex; }
  .nav-links li { padding: 0.9rem 2.5rem; border-bottom: 1px solid var(--brd2); }
  .burger { display: flex; }
  .photo-grid { grid-template-columns: 1fr 1fr; }
}
@media(max-width:720px){
  .prod-grid { grid-template-columns: 1fr 1fr; }
  .sector-card { flex-basis: calc(50% - 1px); }
  .value-grid { grid-template-columns: 1fr 1fr; }
  .request-grid { grid-template-columns: 1fr; border: none; gap: 1px; }
  .req-item { border-inline-end: none; border: 1.5px solid var(--brd); }
  .geo-cols { grid-template-columns: 1fr; }
  .foot-grid { grid-template-columns: 1fr; gap: 2.5rem; }
  .foot-bottom { flex-direction: column; gap: 0.5rem; }
  .bio-facts { grid-template-columns: 1fr; }
  .bio-fact { border-inline-end: none !important; border-bottom: 1.5px solid var(--brd) !important; }
  .photo-grid { grid-template-columns: 1fr; }
  .photo-grid-2 { grid-template-columns: 1fr; }
}
@media(max-width:480px){
  .prod-grid,.value-grid { grid-template-columns: 1fr; }
  .sector-card { flex-basis: 100%; }
  .container { padding: 0 1.5rem; }
  .t-display { font-size: 2.2rem; }
  .sec,.sec-white,.sec-cream,.sec-sage { padding: 5rem 0; }
  .lang-bar { padding: 0 1rem; }
}


/* ── 7 LANGUAGES + PARTNER AREA (added) ── */
.lang-bar { direction: ltr; gap: 0; }
.lang-list { display: flex; align-items: center; gap: 4px; }
.lang-btn-ar { letter-spacing: 0; font-size: 0.78rem; }
.partner-link { display: inline-flex; align-items: center; gap: 7px; margin-left: 12px; padding: 4px 0 4px 14px; border-left: 1px solid rgba(255,255,255,0.22); color: rgba(255,255,255,0.88); font-size: 0.7rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; white-space: nowrap; transition: color 0.2s; }
.partner-link:hover { color: var(--gold); }
.partner-link svg { width: 14px; height: 14px; flex: 0 0 14px; }
@media(max-width:600px){
  .lang-bar { padding: 0 0.6rem; }
  .lang-list { gap: 1px; }
  .lang-btn { padding: 4px 6px; letter-spacing: 0.04em; }
  .partner-link { margin-left: 6px; padding-left: 9px; }
  .partner-label { display: none; }
  .partner-link svg { width: 16px; height: 16px; flex-basis: 16px; }
}

/* ── PHONE: no sideways scrolling (added) ── */
.hero-wrap > * { min-width: 0; }
@media(max-width:1024px){
  [data-stack] { grid-template-columns: 1fr !important; gap: 3rem !important; }
  [data-stack] > * { min-width: 0; }
}
@media(max-width:600px){
  .hero-content { padding: 3rem 1.5rem; }
  .hero-tag { flex-wrap: wrap; row-gap: 0.4rem; }
  .hero-tag .lbl { white-space: normal; }
  .t-display, .t-h2, .co-name, .cta-inner h2 { overflow-wrap: anywhere; hyphens: auto; }
  [data-box] { padding: 1.75rem !important; }
}
@media(max-width:480px){
  html[lang="de"] .t-display, html[lang="cs"] .t-display { font-size: 1.8rem; }
}

/* ── ARABIC: right to left ── */
[dir="rtl"] body { font-family: 'Segoe UI', Tahoma, 'Noto Sans Arabic', system-ui, sans-serif; }
[dir="rtl"] * { letter-spacing: 0 !important; }
[dir="rtl"] .lang-bar, [dir="rtl"] .lang-bar * { direction: ltr; }
[dir="rtl"] .partner-label { direction: rtl; }
[dir="rtl"] .logo-texts { direction: ltr; text-align: right; }
[dir="rtl"] em { font-style: normal; }
[dir="rtl"] .prod-card::after { transform-origin: right; }
[dir="rtl"] a[href^="tel:"] { direction: ltr; unicode-bidi: embed; text-align: right; }


/* ================================================
   fp12 — separate pages per language, forms, legal footer,
   usability on phone and tablet, accessibility
   ================================================ */

/* images carry width and height: keep their proportions */
img { height: auto; }
.logo-img { height: 42px; }
.foot-logo-img { height: 34px; }

/* ── keyboard: skip link and visible focus ── */
.skip-link { position: fixed; inset-inline-start: 0; top: 0; z-index: 1000; background: var(--gold); color: var(--navy3); padding: 0.7rem 1.1rem; font-size: 0.85rem; font-weight: 700; transform: translateY(-110%); }
.skip-link:focus { transform: none; }
.skip-link:focus-visible { outline: 3px solid var(--navy3); outline-offset: -5px; }
:focus-visible { outline: 3px solid var(--navy); outline-offset: 2px; }
.lang-bar :focus-visible, footer :focus-visible, .cta-bar :focus-visible { outline-color: var(--gold); }
.fg input:focus-visible, .fg textarea:focus-visible, .fg select:focus-visible { outline: 3px solid var(--navy); outline-offset: 1px; }
main { display: block; }
:root { --head: 104px; }   /* fixed header: language bar 36px + menu 68px */
html { scroll-padding-top: calc(var(--head) + 16px); scroll-padding-bottom: 4rem; }
.hero-wrap { padding-top: var(--head); }

/* ── language bar: real links, one address per language ── */
.lang-bar nav { display: flex; }
.lang-list { list-style: none; margin: 0; padding: 0; }
a.lang-btn { display: inline-flex; align-items: center; justify-content: center; min-width: 30px; min-height: 26px; text-decoration: none; }
.lang-btn[aria-current] { color: var(--gold); }

/* ── menu ── */
.burger { min-width: 44px; min-height: 44px; align-items: center; justify-content: center; margin-inline-end: -10px; }
.nav-links a { display: inline-block; padding: 0.35rem 0; }
.nav-links a[aria-current="page"] { color: var(--navy); font-weight: 700; box-shadow: inset 0 -2px 0 var(--gold); }
@media(max-width:1024px){
  .nav-links { max-height: calc(100vh - 104px); max-height: calc(100dvh - 104px); overflow-y: auto; overscroll-behavior: contain; box-shadow: 0 14px 28px rgba(13,31,53,0.12); }
  .nav-links a:focus-visible { outline-offset: -4px; }   /* the list clips what is outside its rows */
  .nav-links li { padding: 0; }
  .nav-links a { display: block; padding: 1rem 2.5rem; font-size: 0.8rem; }
  .nav-links a[aria-current="page"] { box-shadow: inset 3px 0 0 var(--gold); }
  [dir="rtl"] .nav-links a[aria-current="page"] { box-shadow: inset -3px 0 0 var(--gold); }
}

/* two identical runs side by side: moving the track by half its width loops without a jump */
.ticker-track { width: max-content; gap: 0; }
.ticker-set { display: flex; flex: none; gap: 2.5rem; padding-inline-end: 2.5rem; min-width: 100vw; justify-content: space-around; }
[dir="rtl"] .ticker-track { animation-name: tick-rtl; }
@keyframes tick-rtl { from{transform:translateX(0)} to{transform:translateX(50%)} }
.ticker:hover .ticker-track, .ticker.is-paused .ticker-track { animation-play-state: paused; }

/* ── reveal on scroll: content is visible unless the script hides what is below the screen ── */
@media (prefers-reduced-motion: no-preference) {
  .fi { transition: opacity 0.6s ease, transform 0.6s ease; }
  .fi.fi-wait { opacity: 0; transform: translateY(16px); }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
  .ticker-track, [dir="rtl"] .ticker-track { animation: none; display: block; width: auto; }
  .ticker-set { min-width: 0; flex-wrap: wrap; white-space: normal; justify-content: center; gap: 0.4rem 1.5rem; padding: 0 1.5rem; }
  .ticker-set[aria-hidden] { display: none; }
}


/* ── page heading of the inner pages ── */
.page-head { padding-top: calc(var(--head) + 5rem); padding-bottom: 4.5rem; border-bottom: 1px solid var(--brd2); background: var(--bg-white); }
.page-h1 { font-size: clamp(2rem,4vw,3.5rem); margin-bottom: 1.25rem; }
.page-lead { max-width: 640px; }
.page-head-solo { min-height: 62vh; }
.page-actions { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 2.5rem; }

/* ── grids: no empty cells, same lines at every width ──
   the lines are the gaps of the grid, so no card can be left without a border */
.value-grid, .sector-grid, .prod-grid, .request-grid, .bio-facts { gap: 1.5px; background: var(--brd); background-clip: padding-box; }
.value-item, .sector-card, .prod-card, .req-item, .bio-fact { border: none !important; background: var(--bg-white); }
.value-grid .value-item { height: 100%; }
/* products: 5 or 7 cards on a 3-column grid left a hole; the last row now shares the full width */
.prod-grid { display: flex; flex-wrap: wrap; }
.prod-card { flex: 1 1 calc(33.333% - 1px); min-width: 0; }
@media(min-width:1200px){ .prod-grid:has(> .prod-card:nth-child(7):last-child) .prod-card { flex-basis: calc(25% - 1.2px); } }
@media(min-width:901px) and (max-width:1199px){ .prod-grid:has(> .prod-card:nth-child(7):last-child) .prod-card:nth-child(n+4) { flex-basis: calc(50% - 1px); } }
@media(max-width:900px){ .prod-card { flex-basis: calc(50% - 1px); } }
.sector-card, .value-item, .req-item { min-width: 0; }
.s-name, .v-title, .p-name, .req-title { overflow-wrap: anywhere; }

/* ── photos ── */
.banner-wrap { overflow: hidden; }
.banner-img { width: 100%; height: clamp(200px, 34vw, 380px); object-fit: cover; object-position: center; display: block; }
.banner-img-lg { height: clamp(220px, 38vw, 420px); }
.banner-img-top { height: clamp(200px, 32vw, 360px); object-position: center top; }
.photo-item img { height: clamp(200px, 24vw, 280px); }
/* portrait: the picture is square; show it whole on tablet and phone instead of a wide slice */
.bio-photo img { height: auto; }

/* ── contact and appointment forms ── */
.fp-form { text-align: start; }
.hp { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.fg-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.25rem; }
.fg-row > .fg { min-width: 0; }
.fg label { color: var(--text2); line-height: 1.5; }
.fg .req { color: #a3271f; font-weight: 700; }
.fg .opt { text-transform: none; letter-spacing: 0; color: var(--text3); }
.fg input, .fg textarea, .fg select { border-color: rgba(31,58,95,0.42); min-height: 48px; font-size: 1rem; }
.fg textarea { min-height: 130px; }
.fg select { background-image: linear-gradient(45deg, transparent 50%, var(--navy) 50%), linear-gradient(135deg, var(--navy) 50%, transparent 50%); background-position: calc(100% - 20px) 50%, calc(100% - 14px) 50%; background-size: 6px 6px; background-repeat: no-repeat; padding-inline-end: 2.4rem; }
[dir="rtl"] .fg select:not([dir="ltr"]) { background-position: 14px 50%, 20px 50%; }
.fg input[type="date"] { appearance: auto; -webkit-appearance: auto; }
.fg-check { display: flex; gap: 0.75rem; align-items: flex-start; flex-wrap: wrap; }
.fg-check input { appearance: auto; -webkit-appearance: auto; width: 24px; height: 24px; min-height: 0; flex: 0 0 24px; margin-top: 0.15rem; accent-color: var(--navy); padding: 0; }
.fg-check label { flex: 1 1 0; margin: 0; font-size: 0.9rem; letter-spacing: 0; text-transform: none; color: var(--text); }
.fg-check label a, .form-alert a, .legal-text a { color: var(--navy); text-decoration: underline; text-underline-offset: 2px; }
.fg-check .field-err { flex: 1 1 100%; }
.fg.has-err input, .fg.has-err textarea, .fg.has-err select { border-color: #a3271f; }
.field-err { color: #a3271f; font-size: 0.85rem; margin-top: 0.4rem; font-weight: 600; }
.form-note, .form-hint, .form-foot { font-size: 0.82rem; color: var(--text3); line-height: 1.6; }
.form-note { margin-bottom: 1.4rem; }
.form-hint { margin: -0.6rem 0 1.4rem; }
.form-foot { margin-top: 1rem; }
.form-alert { background: #fdf1ef; border: 1.5px solid #a3271f; color: #7a1c16; padding: 1rem 1.25rem; font-size: 0.92rem; line-height: 1.6; margin-bottom: 1.5rem; }
.form-done { background: var(--bg-sage); border: 1.5px solid var(--sage); padding: 1.75rem 1.5rem; color: var(--text); font-size: 0.97rem; line-height: 1.7; }
.form-done-title { font-size: 1.15rem; font-weight: 700; color: var(--navy); margin-bottom: 0.5rem; }
[hidden] { display: none !important; }
.btn-block { display: block; width: 100%; text-align: center; min-height: 50px; }
.btn[disabled], .btn.is-sending { opacity: 0.8; cursor: progress; }
.booking-box { text-align: start; }
.booking-box .form-title { margin-bottom: 0.5rem; }
.booking-sub { margin-bottom: 2rem; }
.booking-modes { font-size: 0.78rem; letter-spacing: 0.06em; color: var(--text3); }
.req-item a { height: 100%; }

/* ── privacy notice ── */
.legal-text { max-width: 820px; }
.legal-text h2 { font-size: 1.3rem; font-weight: 700; color: var(--navy); margin: 2.75rem 0 1rem; line-height: 1.3; }
.legal-text h2:first-child { margin-top: 0; }
.legal-text h3 { font-size: 1rem; font-weight: 700; color: var(--navy); margin: 1.5rem 0 0.4rem; }
.legal-text p, .legal-text li { color: var(--text2); font-size: 0.99rem; line-height: 1.85; margin-bottom: 0.9rem; }
.legal-text ul { padding-inline-start: 1.4rem; margin-bottom: 1rem; }
.legal-updated { margin-top: 3rem; font-size: 0.85rem !important; color: var(--text3) !important; }

/* ── footer: legal data ── */
.foot-legal { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.75rem 2rem; padding: 1.75rem 0; border-top: 1px solid rgba(255,255,255,0.08); font-size: 0.8rem; line-height: 1.7; color: rgba(255,255,255,0.72); }
.foot-legal .sep { opacity: 0.5; margin: 0 0.15rem; }
.foot-legal a { color: rgba(255,255,255,0.86); text-decoration: underline; text-underline-offset: 3px; }
.foot-legal a:hover { color: #fff; }
.foot-grid { margin-bottom: 3rem; }
.foot-bottom { gap: 1rem; }
.foot-col a { padding: 0.2rem 0; }

/* ── tablet ── */
@media(max-width:1024px){
  .photo-grid { grid-template-columns: repeat(3,1fr); }
  .bio-photo { max-width: 340px; }
  .bio-photo img { aspect-ratio: 1 / 1; max-height: none; object-position: center top; }
  .page-head { padding-top: calc(var(--head) + 3.5rem); padding-bottom: 3.5rem; }
  .sec, .sec-white, .sec-cream, .sec-sage { padding: 5.5rem 0; }
}
@media(max-width:720px){
  .photo-grid { grid-template-columns: 1fr; }
  .request-grid { border: 1.5px solid var(--brd); gap: 1.5px; }
  .fg-row { grid-template-columns: 1fr; }
  .contact-grid { gap: 3rem; }
  .hero-content { padding: 3rem 2.5rem; }
  .cta-btns .btn, .cta-btns .btn-ghost-dark, .hero-cta .btn { flex: 1 1 auto; text-align: center; }
  .foot-legal { flex-direction: column; }
}
@media(max-width:480px){
  .prod-card { flex-basis: 100%; }
  .value-grid { grid-template-columns: 1fr 1fr; }
  .value-item { padding: 1.5rem 1.1rem; }
  .hero-content { padding: 2.5rem 1.5rem; }
  .nav-inner { padding: 0 1.5rem; }
  .nav-links a { padding: 1rem 1.5rem; }
  .btn, .btn-ghost-dark { white-space: normal; text-align: center; }
  .page-head { padding-top: calc(var(--head) + 2.5rem); padding-bottom: 2.75rem; }
  .p-row { padding: 2rem 1.25rem; }
  .prod-card { padding: 2rem 1.5rem; }
  .cta-bar, .li-block { padding: 4rem 0; }
  .logo-sub { display: none; }
}
@media(max-width:360px){
  .container { padding: 0 1.1rem; }
  .lang-bar { padding: 0 0.35rem; }
  .lang-btn { padding: 4px 4px; }
  .value-grid { grid-template-columns: 1fr; }
}

/* ── Arabic ── */
[dir="rtl"] .fp-form input[dir="ltr"], [dir="rtl"] .fp-form select[dir="ltr"] { text-align: right; }
[dir="rtl"] .foot-col a[dir="ltr"], [dir="rtl"] .ci-val a[dir="ltr"] { text-align: right; unicode-bidi: plaintext; }
[dir="rtl"] .partner-link { margin-left: 12px; }

/* ================================================
   fp12-ux — usability review: widths, grids, short screens, print
   ================================================ */

/* home: the four values live in half a column — two per row at every width
   (four per row left 65px of text per card: words were cut in the middle) */
.value-grid { grid-template-columns: 1fr 1fr; }
.v-desc, .p-desc, .req-desc { overflow-wrap: break-word; }
@media(max-width:360px){ .value-grid { grid-template-columns: 1fr; } }

/* tablet: no card left alone in a row */
@media(min-width:721px) and (max-width:900px){
  .sector-card { flex-basis: calc(33.333% - 1px); }
  .sector-grid:has(> .sector-card:nth-child(4):last-child) .sector-card,
  .sector-grid:has(> .sector-card:nth-child(7):last-child) .sector-card:nth-child(n+4) { flex-basis: calc(50% - 1px); }
}
@media(min-width:721px) and (max-width:1024px){
  /* areas: Italy | North Africa, then Europe on the whole width with its countries in two columns */
  .geo-cols > :last-child:nth-child(odd) { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; column-gap: 3rem; align-content: start; }
  .geo-cols > :last-child:nth-child(odd) > .geo-col-title { grid-column: 1 / -1; }
  .geo-cols > :last-child:nth-child(odd) > .geo-item:nth-last-child(2):nth-child(even) { border-bottom: none; }
  /* footer: name and description on the whole width, then pages | contacts */
  .foot-grid > :first-child { grid-column: 1 / -1; }
  .foot-tagline { max-width: 34rem; }
}

/* short screens (phone on its side, strong zoom): the header scrolls away with the page
   instead of holding a quarter of the screen */
@media (max-height: 500px) {
  .lang-bar, #nav { position: absolute; }
  html { scroll-padding-top: 12px; }
}

/* paper: everything visible, header printed once */
@media print {
  .fi.fi-wait { opacity: 1 !important; transform: none !important; }
  .lang-bar, #nav { position: absolute; }
  .burger, .skip-link, .ticker { display: none !important; }
}

/* photo captions: the navy band is opaque where the words are (the gold title sat on the transparent
   end of the gradient: 1.2:1 on light photos); the fade into the photo is above the text */
.photo-caption { padding: 2.25rem 1rem 0.75rem; background: linear-gradient(to bottom, rgba(31,58,95,0) 0, rgba(31,58,95,0.9) 2rem, rgba(31,58,95,0.93) 100%); color: rgba(255,255,255,0.9); }

/* phone and tablet have no pointer to hover with: the arrow that says "this card is a link" is always shown */
@media(max-width:1024px){ .p-arrow { opacity: 1; } }

/* Arabic: the hero text keeps the narrow margin on its outer side (right) and the wide one next to the photo */
@media(min-width:1025px){ [dir="rtl"] .hero-content { padding: 5rem 2.5rem 5rem 4rem; } }

/* German: long compound words on a phone. Smaller headings so that a word is never cut in the middle,
   and the four values one under the other (two per row left 120px per card) */
.v-title, .v-desc, .s-name, .p-name, .p-desc, .req-title, .req-desc { hyphens: auto; }
@media(max-width:480px){
  html[lang="de"] .t-display { font-size: min(1.8rem, 6.8vw); }
  html[lang="de"] .page-head h1 { font-size: min(2rem, 7vw) !important; }
  html[lang="de"] .value-grid { grid-template-columns: 1fr; }
}

/* phone: photos in one column keep the proportions of the files (3:2), so they are shown whole */
@media(max-width:720px){ .photo-item img { height: auto; aspect-ratio: 3 / 2; } }
/* contact page: three tiles in half a column — a little more room for the words */
@media(min-width:721px){ .req-item { padding: 2rem 1.1rem; } }
/* the gold button on navy: a white ring, so that the focus does not look like a thicker gold edge */
.cta-bar .btn-gold:focus-visible { outline-color: #fff; }

/* ── ticker: a button to stop the moving text (WCAG 2.2.2) ── */
.ticker { position: relative; }
.ticker-toggle { position: absolute; inset-inline-end: 0; top: 0; bottom: 0; width: 44px; display: flex; align-items: center; justify-content: center; background: var(--navy); color: rgba(255,255,255,0.82); border: 0; border-inline-start: 1px solid rgba(255,255,255,0.16); cursor: pointer; padding: 0; }
.ticker-toggle:hover { color: #fff; }
.ticker-toggle svg { width: 12px; height: 12px; }
.ticker-toggle:focus-visible { outline: 3px solid var(--gold); outline-offset: -3px; }

/* ── partner area: one card per portal ── */
.portal-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 420px)); gap: 1.5rem; }
.portal-card { background: var(--bg-white); border: 1.5px solid var(--brd); padding: 2.5rem 2rem; display: flex; flex-direction: column; align-items: flex-start; gap: 0.9rem; border-top: 3px solid var(--gold); }
.portal-card .p-rep { margin-top: 0; }
.portal-name { font-size: 1.35rem; font-weight: 700; color: var(--navy); line-height: 1.25; }
.portal-card .btn { margin-top: 0.75rem; }
.portal-help { margin-top: 2.5rem; font-size: 0.92rem; color: var(--text2); }
.portal-help a { color: var(--navy); text-decoration: underline; text-underline-offset: 2px; }
/* products page: the flat-lay photo shows its upper part in the banner */
.banner-img-studio { object-position: center 20%; }

/* ── sectors in two groups (food, non food); sustainability runs across both ── */
.sector-group-title { display: flex; align-items: center; gap: 1rem; margin: 2.5rem 0 1rem; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--navy); }
.sector-group-title::after { content: ''; flex: 1 1 auto; height: 1.5px; background: var(--brd); }
.sector-groups > .sector-group-title:first-child { margin-top: 0; }
.sector-cross { margin-top: 2.5rem; }
.sector-cross .sector-card { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem 1rem; }
.sector-cross .s-icon, .sector-cross .s-name { margin-bottom: 0; }
/* sectors page: the title of a group sits above its rows */
.sector-group + .sector-group-title { margin-top: 1rem; }
.sector-group > .sector-row:first-child { padding-top: 2.5rem; }
.sector-group-cross { border-top: 1.5px solid var(--brd); }

.art-fig { margin: 0 0 2.25rem; }
.art-fig img, .art-sheet img { width: 100%; height: auto; display: block; }
.art-sheet { margin: 0 auto; max-width: 1200px; }
.art-sheet a { display: block; }
.art-sheet figcaption { font-size: .82rem; color: var(--muted, #5b6573); margin-top: .6rem; }
/* ── pagine di approfondimento, news, FAQ (22/10/2026) ── */
.crumbs { display: flex; flex-wrap: wrap; gap: .45rem; align-items: center; font-size: .8rem; color: var(--text3); margin-bottom: 1.25rem; }
.crumbs a { color: var(--text3); text-decoration: underline; text-underline-offset: 2px; }
.crumb-sep { opacity: .6; }
.art-date { font-size: .85rem; color: var(--text3); margin-top: .5rem; }
.art-producer { margin-top: 2rem !important; padding-top: 1.25rem; border-top: 1px solid var(--brd); }
.art-table-wrap { overflow-x: auto; max-width: 100%; }
.art-table { width: 100%; min-width: 640px; border-collapse: collapse; font-size: .92rem; background: var(--bg-white); }
.art-table th, .art-table td { padding: .8rem .95rem; border-bottom: 1px solid var(--brd); text-align: start; vertical-align: top; line-height: 1.55; color: var(--text2); }
.art-table thead th { color: var(--navy); font-weight: 700; background: var(--bg-sage); }
.art-table tbody th { color: var(--navy); font-weight: 700; }
.art-note { font-size: .85rem; color: var(--text3); margin-top: .9rem; }
.faq { max-width: 820px; margin-top: 1.5rem; }
.faq details { border-bottom: 1px solid var(--brd); padding: 1.05rem 0; }
.faq summary { cursor: pointer; font-weight: 600; color: var(--navy); list-style: none; position: relative; padding-inline-end: 2rem; line-height: 1.5; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; inset-inline-end: 0; top: 0; font-weight: 400; font-size: 1.2rem; line-height: 1.2; }
.faq details[open] summary::after { content: "\2013"; }
.faq details p { margin-top: .65rem; color: var(--text2); line-height: 1.8; }
.faq summary:focus-visible { outline: 2px solid var(--navy); outline-offset: 3px; }
.rel-links { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1rem; }
.rel-link, .p-more, .geo-more { display: inline-block; color: var(--navy); font-weight: 600; text-decoration: none; }
.rel-link { padding: .7rem 1rem; border: 1px solid var(--brd); background: var(--bg-white); font-size: .92rem; }
.rel-link:hover, .rel-link:focus-visible { border-color: var(--navy); }
.p-more, .geo-more { margin-top: .9rem; font-size: .85rem; text-decoration: underline; text-underline-offset: 3px; }
.bio-more { margin: 1.5rem 0; }
.news-list { display: grid; gap: 1.5rem; max-width: 860px; }
.news-card { background: var(--bg-white); border: 1px solid var(--brd); padding: 1.75rem; }
.news-meta { font-size: .8rem; color: var(--text3); letter-spacing: .03em; margin-bottom: .5rem; }
.news-title { font-size: 1.25rem; color: var(--navy); line-height: 1.35; margin-bottom: .6rem; }
.news-title a { color: inherit; text-decoration: none; }
.news-title a:hover { text-decoration: underline; }
.news-excerpt { color: var(--text2); line-height: 1.8; margin-bottom: 1rem; }
.news-links { display: flex; flex-wrap: wrap; gap: .75rem; }
.news-follow { margin-top: .5rem; }
@media (max-width: 600px) { .news-card { padding: 1.25rem; } .art-table { font-size: .85rem; } }

/* === Palette Faberpack (22/10/2026): blu del logo, giallo tenue, oro. Sostituisce blu ardesia e verde salvia. === */
:root {
  --bg:       #FFFBF2;
  --bg-white: #FFFFFF;
  --bg-cream: #FBF1D4;   /* giallo tenue */
  --bg-sage:  #F8E7B6;   /* giallo un tono sopra: tag, evidenze, riquadri */
  --sun:      #F5DD95;   /* fascia delle schede illustrative, vicina al loro giallo */
  --navy:     #14295A;   /* blu del logo */
  --navy2:    #0F2150;
  --navy3:    #0B1A3C;
  --sage:     #D6B25A;
  --sage-dk:  #8A6114;   /* oro scuro leggibile: etichette, corsivi dei titoli */
  --gold:     #EBC25E;   /* oro del logo */
  --gold-dk:  #D9AC45;
  --text:     #13203F;
  --text2:    #3D4866;
  --text3:    #4F5A76;
  --muted:    #586282;
  --brd:      rgba(20,41,90,0.13);
  --brd2:     rgba(20,41,90,0.07);
}
.sec-sage { border-bottom-color: var(--brd2); }
.tag { border-color: rgba(138,97,20,0.28); }
.fg input, .fg textarea, .fg select { border-color: rgba(20,41,90,0.42); }
.photo-caption { background: linear-gradient(to bottom, rgba(11,26,60,0) 0, rgba(11,26,60,0.88) 2rem, rgba(11,26,60,0.93) 100%); }
.photo-item { border-color: rgba(138,97,20,0.18); }

/* home: il testo sta sul giallo tenue, la foto entra dal lato */
.hero-wrap { background: var(--bg-cream); }
.hero-visual { background: var(--bg-cream); }

/* pagine interne: testata gialla; la prima foto sta a cavallo tra il giallo e il bianco */
.page-head { background: var(--bg-cream); border-bottom: 0; }
.sec-white:has(.art-fig) { background: linear-gradient(var(--bg-cream) 0 14rem, var(--bg-white) 14rem); border-bottom-color: var(--brd2); }
.art-fig img, .art-sheet img { box-shadow: 0 22px 44px -28px rgba(11,26,60,0.45); }
.page-head + .banner-wrap { background: linear-gradient(var(--bg-cream) 0 55%, var(--bg-white) 55%); padding: 0 2.5rem; }
.page-head + .banner-wrap img { max-width: calc(1160px - 5rem); margin: 0 auto; box-shadow: 0 22px 44px -28px rgba(11,26,60,0.45); }
@media (max-width: 600px) { .page-head + .banner-wrap { padding: 0 1rem; } }

/* schede illustrative su una fascia del loro stesso giallo */
.sec-cream:has(.art-sheet) { background: var(--sun); }
.sec-cream:has(.art-sheet) .art-sheet figcaption { color: var(--text2); }

@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/fonts/figtree-latin-ext-400-normal.woff2) format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/fonts/figtree-latin-400-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(/fonts/figtree-latin-ext-500-normal.woff2) format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(/fonts/figtree-latin-500-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(/fonts/figtree-latin-ext-600-normal.woff2) format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(/fonts/figtree-latin-600-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(/fonts/figtree-latin-ext-700-normal.woff2) format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(/fonts/figtree-latin-700-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-display: swap;
  font-weight: 800;
  src: url(/fonts/figtree-latin-ext-800-normal.woff2) format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-display: swap;
  font-weight: 800;
  src: url(/fonts/figtree-latin-800-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-display: swap;
  font-weight: 500;
  src: url(/fonts/newsreader-latin-ext-500-italic.woff2) format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-display: swap;
  font-weight: 500;
  src: url(/fonts/newsreader-latin-500-italic.woff2) format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-display: swap;
  font-weight: 600;
  src: url(/fonts/newsreader-latin-ext-600-italic.woff2) format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-display: swap;
  font-weight: 600;
  src: url(/fonts/newsreader-latin-600-italic.woff2) format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

/* === Linea Faberpack 25/10/2026: blu Faberpack → blu tecnico, giallo tenue, bronzo; Figtree e Newsreader (caratteri nel sito) === */
:root {
  --navy:    #14295A;
  --navy2:   #10224B;
  --navy3:   #0B1A3C;
  --blue:    #2F6DB5;
  --blue-dk: #245A98;
  --bg:      #FFFFFF;
  --bg-white:#FFFFFF;
  --bg-cream:#FBF1D4;
  --bg-sage: #FBF1D4;
  --sun:     #F5DD95;
  --bronze:  #8A6114;
  --sage:    #8A6114;
  --sage-dk: #8A6114;
  --gold:    #8A6114;   /* l'oro resta solo nel logo: dove il sito usava l'oro, ora c'è il bronzo */
  --gold-dk: #6F4E10;
  --text:    #13203F;
  --text2:   #3A4566;
  --text3:   #4F5A76;
  --muted:   #5A6483;
  --brd:     rgba(20,41,90,0.13);
  --brd2:    rgba(20,41,90,0.07);
  --grad:    linear-gradient(120deg, #14295A 0%, #1C3F7E 52%, #2F6DB5 100%);
  --ff:      'Figtree', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --ff-em:   'Newsreader', Georgia, 'Times New Roman', serif;
}
body { font-family: var(--ff); font-size: 17px; }
[lang="ar"] body, body:lang(ar) { font-family: var(--ff), 'Segoe UI', Tahoma, 'Noto Sans Arabic', sans-serif; }
button, input, select, textarea { font-family: inherit; }
.t-display, .t-h2, .page-h1, h1, h2, h3 { font-family: var(--ff); letter-spacing: -0.015em; }
.t-display { font-weight: 800; }
h1 em, h2 em, h3 em, .t-display em, .t-h2 em {
  font-family: var(--ff-em); font-style: italic; font-weight: 500; letter-spacing: 0; color: var(--bronze);
}
:lang(ar) h1 em, :lang(ar) h2 em, :lang(ar) h3 em { font-family: inherit; font-style: normal; }
.lbl { color: var(--bronze); }
.gold-bar { background: var(--blue); }
.btn-navy { background: var(--navy); color: #fff; }
.btn-navy:hover { background: var(--blue); }

/* home: apertura dal blu Faberpack al blu tecnico, la foto entra dal lato */
.hero-wrap { background: var(--grad); min-height: min(88vh, 780px); }
.hero-visual { background: transparent; }
.hero-visual img { width: 100%; height: 100%; object-fit: cover; object-position: 30% center; display: block; }
.hero-wrap .lbl { color: var(--sun); }
.hero-wrap .hero-tag-line { background: var(--sun); }
.hero-wrap .t-display { color: #fff; }
.hero-wrap .t-display em { color: var(--sun); }
.hero-wrap .t-body-lg { color: rgba(255,255,255,0.88); }
.hero-wrap .btn-navy { background: #fff; color: var(--navy); }
.hero-wrap .btn-navy:hover { background: var(--bg-cream); }
.hero-wrap .btn-outline { border-color: rgba(255,255,255,0.7); color: #fff; background: transparent; }
.hero-wrap .btn-outline:hover { background: rgba(255,255,255,0.12); }

/* pagine interne: testata gialla tenue */
.page-head { background: var(--bg-cream); }

/* foto: proporzioni 3:2 delle immagini nuove */
.photo-item img, .p-row img { object-fit: cover; }

/* icone dei prodotti al posto delle emoji */
.p-icon { width: 52px; height: 52px; border-radius: 12px; background: var(--bg-cream); display: flex; align-items: center; justify-content: center; margin-bottom: 1.25rem; font-size: 0; }
.p-icon svg { width: 28px; height: 28px; fill: none; stroke: var(--blue); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }

/* ── calendario «Faberpack, giorno per giorno»: il foglio che si stacca ── */
.cal { position: relative; background: var(--bg-cream); border: 1px solid #EAD7A0; border-radius: 10px; margin-bottom: 10px; box-shadow: 0 10px 22px rgba(20,41,90,0.10); text-align: start; }
.cal::before, .cal::after { content: ''; position: absolute; inset-inline: 6px; bottom: -5px; height: 12px; background: #F7E8BF; border: 1px solid #EAD7A0; border-top: 0; border-radius: 0 0 9px 9px; z-index: -1; }
.cal::after { inset-inline: 12px; bottom: -10px; background: #F2DFAB; }
.cal-top { display: flex; align-items: center; justify-content: space-between; gap: 6px; height: 30px; padding: 0 9px; border-radius: 9px 9px 0 0; background: linear-gradient(90deg, var(--navy), var(--blue)); color: #fff; }
.cal-top { position: relative; justify-content: center; }
.cal-top::before, .cal-top::after { content: ''; position: absolute; top: -5px; width: 8px; height: 12px; border-radius: 4px; background: #fff; border: 1.5px solid var(--navy); }
.cal-top::before { inset-inline-start: 22px; }
.cal-top::after { inset-inline-end: 22px; }
.cal-series { margin: 0; font-size: 10.5px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
:lang(ar) .cal-series { letter-spacing: 0; font-size: 12px; }
.cal-date { display: flex; align-items: center; gap: 12px; min-height: 66px; padding: 10px 16px 4px; margin: 0; }
.cal-d { font-size: 50px; font-weight: 800; line-height: 1; color: var(--navy); font-variant-numeric: tabular-nums; letter-spacing: -0.03em; }
.cal-x { display: flex; flex-direction: column; line-height: 1.25; }
.cal-wd { font-size: 15px; font-weight: 700; color: var(--navy); }
.cal-wd::first-letter { text-transform: uppercase; }
.cal-my { font-size: 11.5px; font-weight: 700; color: var(--bronze); text-transform: uppercase; letter-spacing: 0.08em; }
:lang(ar) .cal-my { letter-spacing: 0; font-size: 13px; }
.cal-q { margin: 6px 14px 0; padding: 10px 2px 14px; border-top: 1.5px dashed rgba(138,97,20,0.35); }
.cal-phrase { margin: 0; font-family: var(--ff-em); font-style: italic; font-weight: 500; font-size: 16.5px; line-height: 1.42; color: var(--navy); }
:lang(ar) .cal-phrase { font-family: inherit; font-style: normal; font-size: 16px; line-height: 1.7; }
.cal-date:empty, .cal-date.is-empty { display: none; }

/* icone disegnate al posto delle emoji (settori, punti di forza, contatti) */
.ic { font-size: 0 !important; line-height: 0; }
.ic svg { width: 28px; height: 28px; fill: none; stroke: var(--blue); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.s-icon.ic, .sr-icon.ic, .v-icon.ic, .req-icon.ic { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 11px; background: var(--bg-cream); }
.s-icon.ic svg, .sr-icon.ic svg, .v-icon.ic svg, .req-icon.ic svg { width: 25px; height: 25px; }
.cc { display: inline-flex; align-items: center; font-family: var(--ff); font-size: 11px !important; font-weight: 700; letter-spacing: 0.06em; color: var(--blue); background: #EEF3FA; border-radius: 5px; padding: 2px 7px; white-space: nowrap; line-height: 1.6; vertical-align: middle; }
.geo-flag .cc, .geo-flag.cc { font-size: 10.5px !important; }
.btn-gold { background: #fff; color: var(--navy); }
.btn-gold:hover { background: var(--bg-cream); }
.geo-flag.ic svg { width: 18px; height: 18px; }
.skip-link { background: var(--navy); color: #fff; }
.skip-link:focus-visible { outline-color: var(--sun); }
.t-display { overflow-wrap: break-word; hyphens: auto; }
.sheet-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; margin-top: 3rem; align-items: start; }
.sheet-pair .art-sheet { max-width: none; }
@media (max-width: 720px) { .sheet-pair { grid-template-columns: 1fr; } }

/* foto: la didascalia blu sta sopra la foto, così la parte bassa resta visibile */
.photo-item { display: flex; flex-direction: column; background: var(--navy); }
.photo-item .photo-caption { position: static; order: -1; background: var(--navy); padding: 0.75rem 1rem 0.7rem; }
.photo-item .photo-caption strong { color: var(--sun); }
.banner-img-low { object-position: center 78%; }

/* ── Il dizionario del packaging ── */
.gl-tools { display: grid; grid-template-columns: 2fr 0.8fr 1.4fr auto; gap: 12px; align-items: end; padding: 18px; border-radius: 14px; background: var(--bg-cream); margin-bottom: 14px; }
.gl-sec { padding-top: 2.5rem !important; }
.gl-f input, .gl-f select, .gl-reset { height: 46px; box-sizing: border-box; }
.gl-f { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 700; color: var(--navy); }
.gl-f input, .gl-f select { font: inherit; font-weight: 500; font-size: 15.5px; padding: 10px 12px; border: 1.5px solid rgba(20,41,90,0.25); border-radius: 9px; background: #fff; color: var(--text); width: 100%; min-width: 0; }
.gl-f input:focus, .gl-f select:focus { outline: 2px solid var(--blue); outline-offset: 1px; }
.gl-reset { font: inherit; font-weight: 700; font-size: 14px; padding: 11px 14px; border-radius: 9px; border: 1.5px solid var(--navy); background: #fff; color: var(--navy); cursor: pointer; }
.gl-az { display: flex; flex-wrap: wrap; gap: 4px; margin: 10px 0 8px; }
.gl-az a, .gl-az span { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 7px; font-size: 14px; font-weight: 700; }
.gl-az a { color: var(--navy); background: #F3F6FB; text-decoration: none; }
.gl-az a:hover { background: var(--navy); color: #fff; }
.gl-az span { color: rgba(20,41,90,0.25); }
.gl-count { font-size: 14px; color: var(--muted); margin: 6px 0 18px; }
.gl-letter { scroll-margin-top: calc(var(--head) + 16px); }
.gl-h { font-size: 30px; font-weight: 800; color: var(--blue); border-bottom: 2px solid var(--bg-cream); padding-bottom: 4px; margin: 26px 0 14px; }
.gl-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.gl-item { border: 1px solid var(--brd); border-radius: 12px; padding: 14px 16px 12px; background: #fff; scroll-margin-top: calc(var(--head) + 16px); }
.gl-item:target { box-shadow: 0 0 0 3px var(--sun); }
.gl-item h3 { font-size: 17px; font-weight: 800; color: var(--navy); line-height: 1.3; margin: 0 0 6px; }
.gl-num { font-size: 12.5px; font-weight: 800; color: var(--bronze); margin-inline-end: 4px; font-variant-numeric: tabular-nums; }
.gl-def { font-size: 15px; line-height: 1.55; color: var(--text2); margin: 0 0 8px; }
.gl-meta { font-size: 12px; color: var(--muted); margin: 0; }
.gl-empty { padding: 20px; background: var(--bg-cream); border-radius: 12px; }
@media (max-width: 900px) { .gl-tools { grid-template-columns: 1fr 1fr; } .gl-f-q { grid-column: 1 / -1; } .gl-grid { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .gl-tools { grid-template-columns: 1fr; } .gl-reset { width: 100%; } }

.cal-wrap { position: relative; isolation: isolate; }

/* === Variante A: colonna a sinistra (a destra in arabo), sul telefono le tre lineette === */
:root { --side: 272px; }
.side { background: #fff; z-index: 60; }
.side a { text-decoration: none; }
.side-logo { display: flex; align-items: center; gap: 10px; color: var(--navy); }
.side-logo img { width: 46px; height: auto; flex: none; }
.side-logo-t { display: flex; flex-direction: column; min-width: 0; }
.side-name { font-weight: 800; font-size: 18px; letter-spacing: 0.14em; color: var(--navy); line-height: 1.1; }
.side-sub { font-size: 10.5px; color: var(--muted); line-height: 1.3; margin-top: 2px; }
.side-body { display: flex; flex-direction: column; gap: 16px; }
.side-lang ul, .side-nav ul { list-style: none; margin: 0; padding: 0; }
.side-lang ul { display: flex; flex-wrap: wrap; gap: 3px; }
.side-lang a { display: inline-flex; align-items: center; justify-content: center; min-width: 28px; height: 28px; padding: 0 5px; border-radius: 6px; border: 1px solid var(--brd); font-size: 11.5px; font-weight: 700; color: var(--text2); }
.side-lang a:hover { border-color: var(--blue); color: var(--blue); }
.side-lang a[aria-current="true"] { background: var(--navy); border-color: var(--navy); color: #fff; }
.side-nav a { display: block; padding: 7px 12px; border-radius: 8px; color: var(--text); font-size: 15.5px; font-weight: 600; line-height: 1.35; }
.side-nav a:hover { background: #F3F6FB; color: var(--navy); }
.side-nav a[aria-current="page"], .side-nav .is-on > a { background: var(--bg-cream); color: var(--navy); box-shadow: inset 3px 0 0 var(--blue); }
[dir="rtl"] .side-nav a[aria-current="page"], [dir="rtl"] .side-nav .is-on > a { box-shadow: inset -3px 0 0 var(--blue); }
.side-nav .side-subl { margin: 2px 0 6px; }
.side-nav .side-subl a { font-size: 14px; font-weight: 500; color: var(--text2); padding: 5px 12px; padding-inline-start: 26px; }
.side-nav .side-subl a[aria-current="page"] { background: transparent; box-shadow: none; color: var(--blue); font-weight: 700; }
.side-mk { padding: 7px 12px; }
.side-mk-h { display: block; font-size: 15.5px; font-weight: 600; color: var(--text); line-height: 1.35; }
.side-mk-l { display: flex; flex-wrap: wrap; gap: 2px 10px; margin-top: 3px; }
.side-nav .side-mk-l a { display: inline; padding: 0; font-size: 13.5px; font-weight: 500; color: var(--blue); border-radius: 0; background: none; box-shadow: none; }
.side-nav .side-mk-l a:hover { text-decoration: underline; background: none; }
.side-nav .side-mk-l a[aria-current="page"] { color: var(--navy); font-weight: 800; background: none; box-shadow: none; }
.side-cta { display: block; text-align: center; padding: 11px 14px; border-radius: 10px; background: linear-gradient(90deg, var(--navy), var(--blue)); color: #fff; font-weight: 700; font-size: 15px; }
.side-cta:hover { filter: brightness(1.08); }
.side-cta[aria-current="page"] { outline: 2px solid var(--sun); outline-offset: 2px; }
.side-partner { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 600; color: var(--muted); padding: 4px 2px; }
.side-partner svg { width: 14px; height: 14px; }
.side-partner:hover { color: var(--navy); }
.side-mail { font-size: 12.5px; color: var(--muted); word-break: break-all; }
.burger { display: none; }

@media (min-width: 1100px) {
  :root { --head: 0px; }
  body { padding-inline-start: var(--side); }
  .side { position: fixed; inset-block: 0; inset-inline-start: 0; width: var(--side); border-inline-end: 1px solid var(--brd); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; padding: 22px 20px 18px; display: flex; flex-direction: column; gap: 18px; }
  .side-body { flex: 1; }
  .side-foot { margin-top: auto; display: flex; flex-direction: column; gap: 4px; padding-top: 6px; border-top: 1px solid var(--brd2); }
  .hero-wrap { padding-top: 0; }
  .hero-wrap .t-display { font-size: clamp(2.3rem, 3.7vw, 3.9rem); }
  .cal-home { display: none; }
}

@media (max-width: 1099px) {
  :root { --head: 64px; }
  .side { position: fixed; top: 0; inset-inline: 0; height: 64px; border-bottom: 1px solid var(--brd); }
  .side-bar { height: 64px; display: flex; align-items: center; justify-content: space-between; padding: 0 16px; }
  .side-logo img { width: 40px; }
  .side-name { font-size: 16px; }
  .burger { display: inline-flex; flex-direction: column; justify-content: center; gap: 5px; width: 44px; height: 44px; padding: 0 10px; border: 0; border-radius: 8px; background: transparent; cursor: pointer; }
  .burger span { display: block; height: 2px; border-radius: 2px; background: var(--navy); transition: transform .2s, opacity .2s; }
  .side.open .burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .side.open .burger span:nth-child(2) { opacity: 0; }
  .side.open .burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .side-body { position: fixed; top: 64px; bottom: 0; inset-inline-start: 0; width: min(340px, 88vw); overflow-y: auto; overscroll-behavior: contain; background: #fff; padding: 18px 18px 28px; box-shadow: 0 18px 40px rgba(11,26,60,0.22); transform: translateX(-102%); visibility: hidden; transition: transform .25s ease, visibility 0s linear .25s; }
  [dir="rtl"] .side-body { transform: translateX(102%); }
  .side.open .side-body { transform: none; visibility: visible; transition: transform .25s ease, visibility 0s; }
  .side.open::after { content: ''; position: fixed; inset: 64px 0 0 0; background: rgba(11,26,60,0.38); z-index: -1; }
  .side-foot { display: flex; flex-direction: column; gap: 4px; }
  .hero-wrap { padding-top: var(--head); }
  .cal-home { margin: 2rem 0 0; max-width: 380px; }
}
@media (prefers-reduced-motion: reduce) { .side-body { transition: none !important; } }
@media print { .side { display: none; } body { padding: 0 !important; } }

/* 25/10 pomeriggio: «Area partner» è un tasto come «Prenota una call» */
.side-btns { display: flex; flex-direction: column; gap: 8px; }
.side-partner-btn { display: flex; justify-content: center; align-items: center; gap: 8px; padding: 10px 14px; border-radius: 10px; border: 1.5px solid var(--navy); color: var(--navy); font-size: 15px; font-weight: 700; background: #fff; }
.side-partner-btn:hover { background: var(--bg-cream); color: var(--navy); }
.side-partner-btn svg { width: 15px; height: 15px; }
