/* ══════════════════════════════════════════════
   THE CASTLE SERVICE SRL — Shared Stylesheet
   Breakpoints: mobile <600 · tablet <960 · desktop ≥960
   ══════════════════════════════════════════════ */

:root {
  --navy:#ffffff; --navy-mid:#cde3ee; --navy-light:#b3d8e8;
  --red:#095e80;  --red-light:#0d86ab;
  --white:#071c31; --grey:#4e6d86; --grey-light:#345571;
  --ink:#071c31; --aqua:#0d86ab; --aqua-deep:#095e80; --aqua-mist:#cde3ee;
  --pad-x: 4rem;
  --pad-x-md: 2rem;
  --pad-x-sm: 1.25rem;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: 'Barlow', sans-serif; background: var(--navy); color: var(--white); overflow-x: hidden; }
img { display: block; max-width: 100%; }

/* ══ NAV ══ */
nav {
  position: fixed; top: 0; left: 0; width: 100%; z-index: 200;
  display: flex; align-items: center; justify-content: space-between;
  padding: 1rem var(--pad-x);
  background: rgba(255,255,255,.82); backdrop-filter: blur(16px) saturate(1.4);
  border-bottom: 1px solid rgba(7,28,49,.07);
}
.nav-logo {
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 900; font-size: 1.25rem; letter-spacing: .08em;
  color: var(--white); text-decoration: none; z-index: 201;
}
.nav-logo span { color: var(--red); }
.nav-links { display: flex; gap: 0; list-style: none; flex-wrap: nowrap; }
.nav-links a {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: .78rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--grey-light); text-decoration: none; white-space: nowrap;
  padding: .4rem .85rem; position: relative; transition: color .2s;
}
.nav-links a::after {
  content: ''; position: absolute; bottom: -2px; left: .85rem; right: .85rem;
  height: 2px; background: var(--red); transform: scaleX(0); transition: transform .2s;
}
.nav-links a:hover { color: var(--white); }
.nav-links a:hover::after, .nav-links a.active::after { transform: scaleX(1); }
.nav-links a.active { color: var(--white); }

/* ── Hamburger button ── */
.nav-toggle {
  display: none; flex-direction: column; justify-content: center; gap: 5px;
  width: 36px; height: 36px; background: none; border: none; cursor: pointer;
  padding: 4px; z-index: 201; flex-shrink: 0;
}
.nav-toggle span {
  display: block; width: 100%; height: 2px; background: var(--white);
  border-radius: 2px; transition: transform .3s, opacity .3s, width .3s;
  transform-origin: center;
}
.nav-toggle.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle.open span:nth-child(2) { opacity: 0; width: 0; }
.nav-toggle.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ── Mobile drawer ── */
.nav-drawer {
  display: none; position: fixed; inset: 0; z-index: 199;
  background: rgba(244,251,253,.97); backdrop-filter: blur(18px) saturate(1.3);
  flex-direction: column; align-items: center; justify-content: center; gap: 0;
  opacity: 0; transition: opacity .3s;
}
.nav-drawer.open { opacity: 1; }
.nav-drawer ul { list-style: none; display: flex; flex-direction: column; align-items: center; gap: 0; width: 100%; }
.nav-drawer ul a {
  display: block; width: 100%; text-align: center;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 1.8rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase;
  color: var(--grey-light); text-decoration: none;
  padding: 1rem 2rem; border-bottom: 1px solid rgba(7,28,49,.07);
  transition: color .2s, background .2s;
}
.nav-drawer ul a:hover, .nav-drawer ul a.active { color: var(--red); background: rgba(13,134,171,.05); }
.nav-drawer-footer {
  margin-top: 2.5rem; text-align: center;
  font-family: 'Barlow Condensed', sans-serif; font-size: .72rem;
  font-weight: 700; letter-spacing: .15em; text-transform: uppercase; color: var(--grey);
}

/* ══ PAGE HERO ══ */
.page-hero {
  padding: 9rem var(--pad-x) 5rem;
  background: linear-gradient(160deg, #dcebf3 0%, #bedeeb 55%, #a8d4e5 100%);
  position: relative; overflow: hidden;
  border-bottom: 1px solid rgba(7,28,49,.07);
}
.page-hero-bg { position: absolute; inset: 0; pointer-events: none; }
.page-hero-bg::before {
  content: ''; position: absolute; top: -60px; right: 0; width: 0; height: 0;
  border-style: solid; border-width: 0 320px 540px 0;
  border-color: transparent rgba(13,134,171,.10) transparent transparent;
}
.page-hero-bg::after {
  content: ''; position: absolute; bottom: 0; right: 200px; width: 0; height: 0;
  border-style: solid; border-width: 0 0 300px 200px;
  border-color: transparent transparent rgba(95,170,200,.22) transparent;
}
.page-hero-content { position: relative; z-index: 2; max-width: 800px; }
.breadcrumb {
  display: flex; align-items: center; gap: .6rem; margin-bottom: 1.5rem;
  font-family: 'Barlow Condensed', sans-serif; font-size: .72rem;
  font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--grey);
  flex-wrap: wrap;
}
.breadcrumb a { color: var(--grey); text-decoration: none; transition: color .2s; }
.breadcrumb a:hover { color: var(--red-light); }
.breadcrumb-sep { color: var(--red); opacity: .6; }
.breadcrumb-current { color: var(--red); }
.page-eyebrow {
  display: inline-flex; align-items: center; gap: .8rem; margin-bottom: 1.2rem;
  font-family: 'Barlow Condensed', sans-serif; font-size: .76rem;
  font-weight: 700; letter-spacing: .22em; text-transform: uppercase; color: var(--red);
}
.page-eyebrow::before { content: ''; width: 26px; height: 2px; background: var(--red); }
.page-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: clamp(2.4rem, 6vw, 5.5rem); font-weight: 900;
  line-height: .95; letter-spacing: -.01em; margin-bottom: 1.2rem;
}
.page-title em { color: var(--red); font-style: normal; }
.page-lead { font-size: clamp(.9rem, 2vw, 1rem); font-weight: 300; line-height: 1.8; color: var(--grey-light); max-width: 560px; }

/* ══ SECTIONS ══ */
section { padding: 6rem var(--pad-x); }
.section-label {
  display: inline-flex; align-items: center; gap: .8rem; margin-bottom: 1.1rem;
  font-family: 'Barlow Condensed', sans-serif; font-size: .74rem;
  font-weight: 700; letter-spacing: .22em; text-transform: uppercase; color: var(--red);
}
.section-label::before { content: ''; width: 26px; height: 2px; background: var(--red); }
.section-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: clamp(1.9rem, 4vw, 3.4rem); font-weight: 900;
  line-height: 1; margin-bottom: 1.4rem; letter-spacing: -.01em;
}
.section-lead { font-size: .97rem; font-weight: 300; line-height: 1.8; color: var(--grey-light); max-width: 600px; }
.divider { width: 100%; height: 1px; background: linear-gradient(90deg, var(--red), transparent); opacity: .2; }

/* ══ BUTTONS ══ */
.btn-primary {
  display: inline-flex; align-items: center; gap: .7rem;
  padding: .95rem 2.2rem; background: var(--red); color: #fff;
  font-family: 'Barlow Condensed', sans-serif; font-size: .88rem;
  font-weight: 700; letter-spacing: .12em; text-transform: uppercase; text-decoration: none;
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px));
  transition: background .2s, transform .2s; white-space: nowrap;
}
.btn-primary:hover { background: var(--red-light); transform: translateY(-2px); }
.btn-secondary {
  display: inline-flex; align-items: center; gap: .7rem;
  padding: .85rem 2rem; background: transparent; color: var(--grey-light);
  border: 1px solid rgba(7,28,49,.14);
  font-family: 'Barlow Condensed', sans-serif; font-size: .85rem;
  font-weight: 700; letter-spacing: .12em; text-transform: uppercase; text-decoration: none;
  transition: all .2s; white-space: nowrap;
}
.btn-secondary:hover { border-color: var(--red); color: var(--white); }
.btn-group { display: flex; gap: 1rem; flex-wrap: wrap; align-items: center; }

/* ══ IMAGE BLOCK ══ */
.img-block { overflow: hidden; position: relative; border: 1px solid rgba(7,28,49,.08); }
.img-block img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; filter: saturate(1.04) contrast(1.02); }
.img-block:hover img { transform: scale(1.04); }
.img-caption {
  position: absolute; bottom: 0; left: 0; right: 0; padding: .8rem 1.2rem;
  background: linear-gradient(0deg, rgba(255,255,255,.95) 10%, rgba(255,255,255,0) 100%);
  font-family: 'Barlow Condensed', sans-serif; font-size: .68rem;
  font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--grey-light);
}

/* ══ BANNER ══ */
.img-banner { width: 100%; height: 300px; overflow: hidden; position: relative; }
.img-banner img { width: 100%; height: 100%; object-fit: cover; object-position: center 35%; filter: saturate(1.04); }
.img-banner-overlay {
  position: absolute; inset: 0; display: flex; align-items: center;
  padding: 0 var(--pad-x);
  background: linear-gradient(90deg, rgba(244,251,253,.95) 36%, rgba(244,251,253,.55) 62%, rgba(244,251,253,0) 100%);
}
.img-banner-text h2 { font-family: 'Barlow Condensed', sans-serif; font-size: clamp(1.5rem, 3vw, 2.2rem); font-weight: 900; margin-bottom: .7rem; }
.img-banner-text p { font-size: .88rem; color: var(--grey-light); line-height: 1.7; max-width: 460px; }

/* ══ GRID HELPERS ══ */
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; background: rgba(7,28,49,.07); }
.grid-3 { display: grid; grid-template-columns: repeat(3,1fr); gap: 2px; background: rgba(7,28,49,.07); }
.grid-4 { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; background: rgba(7,28,49,.07); border: 1px solid rgba(7,28,49,.07); }
.gap-xl  { gap: 5rem; background: none; }
.gap-lg  { gap: 4rem; background: none; }
.gap-md  { gap: 3rem; background: none; }

/* ══ CARDS ══ */
.card { background: var(--navy); padding: 2.5rem; transition: background .2s; }
.card:hover { background: var(--navy-light); }
.card-mid { background: var(--navy-mid); padding: 2.5rem; transition: background .2s; }
.card-mid:hover { background: var(--navy-light); }
.card-red { background: var(--navy-mid); padding: 2.5rem; border-top: 2px solid transparent; transition: all .2s; }
.card-red:hover { border-top-color: var(--red); background: var(--navy-light); }
.card-title { font-family: 'Barlow Condensed', sans-serif; font-size: 1.05rem; font-weight: 800; text-transform: uppercase; letter-spacing: .09em; margin-bottom: .75rem; }
.card-desc { font-size: .84rem; color: var(--grey-light); line-height: 1.65; }

/* ══ CHECK LIST ══ */
.check-list { display: flex; flex-direction: column; }
.check-item { display: flex; gap: 1.4rem; align-items: flex-start; padding: 1.6rem 0; border-bottom: 1px solid rgba(7,28,49,.07); transition: padding-left .2s; }
.check-item:hover { padding-left: .5rem; }
.check-item:last-child { border-bottom: none; }
.check-icon { width: 40px; height: 40px; background: rgba(13,134,171,.12); display: flex; align-items: center; justify-content: center; font-size: 1rem; flex-shrink: 0; }
.check-title { font-family: 'Barlow Condensed', sans-serif; font-size: 1rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; margin-bottom: .4rem; }
.check-desc { font-size: .83rem; color: var(--grey-light); line-height: 1.65; }

/* ══ ARROW LIST ══ */
.arrow-list { display: flex; flex-direction: column; }
.arrow-item { display: flex; gap: 1.4rem; align-items: flex-start; padding: 1.6rem 0; border-bottom: 1px solid rgba(7,28,49,.07); }
.arrow-item:last-child { border-bottom: none; }
.arrow { width: 0; height: 0; flex-shrink: 0; border-style: solid; border-width: 6px 0 6px 10px; border-color: transparent transparent transparent var(--red); margin-top: .46rem; }
.arrow-text { font-size: .88rem; color: var(--grey-light); line-height: 1.7; }

/* ══ PILLAR ══ */
.pillar { display: flex; gap: 1.4rem; align-items: flex-start; padding: 1.6rem; background: var(--navy-light); border-left: 3px solid var(--red); transition: transform .2s; }
.pillar:hover { transform: translateX(8px); }
.pillar-icon { width: 42px; height: 42px; flex-shrink: 0; background: var(--red); display: flex; align-items: center; justify-content: center; clip-path: polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%); font-size: 1.1rem; }
.pillar-name { font-family: 'Barlow Condensed', sans-serif; font-size: 1.1rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; margin-bottom: .35rem; }
.pillar-desc { font-size: .87rem; color: var(--grey-light); line-height: 1.65; }
.pillars { display: flex; flex-direction: column; gap: 1.8rem; }

/* ══ CERT BOX ══ */
.cert-box { background: var(--navy-mid); padding: 2.8rem; border: 1px solid rgba(7,28,49,.09); position: relative; }
.cert-box::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, var(--red), transparent); }
.cert-name { font-family: 'Barlow Condensed', sans-serif; font-size: 2.4rem; font-weight: 900; color: var(--red); margin-bottom: .4rem; }
.cert-full { font-size: .8rem; font-weight: 600; letter-spacing: .08em; color: var(--grey-light); margin-bottom: 1.3rem; }
.cert-desc { font-size: .87rem; color: var(--grey-light); line-height: 1.75; }
.cert-year { display: inline-block; margin-top: 1.3rem; padding: .35rem .85rem; background: rgba(13,134,171,.12); font-size: .7rem; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; color: var(--red); }

/* ══ BOXES ══ */
.highlight-box { padding: 1.8rem; background: rgba(13,134,171,.08); border: 1px solid rgba(13,134,171,.2); font-size: .87rem; color: var(--grey-light); line-height: 1.7; }
.note-box { padding: 2rem; background: var(--navy-mid); border-left: 3px solid var(--red); font-size: .88rem; color: var(--grey-light); line-height: 1.7; }

/* ══ SOLIDITA ══ */
.solidita { background: var(--navy); padding: 2.5rem; border: 1px solid rgba(7,28,49,.08); }
.solidita-title { font-family: 'Barlow Condensed', sans-serif; font-size: .76rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--grey); margin-bottom: 1.6rem; }
.solidita-row { display: flex; align-items: baseline; gap: 1.2rem; padding: 1.1rem 0; border-bottom: 1px solid rgba(7,28,49,.08); }
.solidita-row:last-child { border-bottom: none; }
.solidita-num { font-family: 'Barlow Condensed', sans-serif; font-size: 2.7rem; font-weight: 900; color: var(--red); line-height: 1; min-width: 88px; }
.solidita-txt { font-size: .76rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--grey-light); }

/* ══ CONTACT ══ */
.contact-item { display: flex; gap: 2rem; align-items: flex-start; padding: 1.5rem 0; border-bottom: 1px solid rgba(7,28,49,.07); }
.contact-item:last-child { border-bottom: none; }
.contact-label { font-family: 'Barlow Condensed', sans-serif; font-size: .7rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--red); min-width: 130px; padding-top: .15rem; }
.contact-val { font-size: .9rem; color: var(--white); font-weight: 300; }
.contact-val a { color: var(--grey-light); text-decoration: none; transition: color .2s; }
.contact-val a:hover { color: var(--red-light); }

/* ══ FOOTER ══ */
footer { background: var(--navy); padding: 2rem var(--pad-x); display: flex; align-items: flex-start; justify-content: space-between; gap: 2rem; border-top: 1px solid rgba(7,28,49,.08); flex-wrap: wrap; }
.footer-logo { font-family: 'Barlow Condensed', sans-serif; font-size: 1.05rem; font-weight: 900; letter-spacing: .06em; }
.footer-logo span { color: var(--red); }
.footer-info { font-size: .74rem; color: var(--grey); }
.footer-info a { color: inherit; text-decoration: none; }
.footer-cert { display: flex; gap: .8rem; align-self: center; }
.cert-badge { padding: .28rem .75rem; background: rgba(13,134,171,.1); border: 1px solid rgba(13,134,171,.25); font-size: .65rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--red); }
.footer-nav { display: flex; gap: 1.5rem; margin-top: .4rem; flex-wrap: wrap; }
.footer-nav a { font-family: 'Barlow Condensed', sans-serif; font-size: .7rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--grey); text-decoration: none; transition: color .2s; }
.footer-nav a:hover { color: var(--red-light); }

/* ══ ANIMATIONS ══ */
@keyframes fadeUp { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: none; } }
.reveal { opacity: 0; transform: translateY(26px); transition: opacity .65s ease, transform .65s ease; }
.reveal.visible { opacity: 1; transform: none; }
.hero-anim > * { animation: fadeUp .8s ease both; }
.hero-anim > *:nth-child(1) { animation-delay: .05s; }
.hero-anim > *:nth-child(2) { animation-delay: .18s; }
.hero-anim > *:nth-child(3) { animation-delay: .32s; }
.hero-anim > *:nth-child(4) { animation-delay: .46s; }
.hero-anim > *:nth-child(5) { animation-delay: .58s; }

/* ════════════════════════════════
   TABLET  — max-width: 960px
   ════════════════════════════════ */
@media (max-width: 960px) {
  :root { --pad-x: var(--pad-x-md); }

  /* Nav → hamburger */
  .nav-links { display: none; }
  .nav-toggle { display: flex; }
  .nav-drawer { display: flex; }

  nav { padding: .9rem var(--pad-x-md); }

  /* Sections */
  section { padding: 5rem var(--pad-x-md); }
  .page-hero { padding: 7.5rem var(--pad-x-md) 4rem; }

  /* Grids → 2 cols then 1 */
  .grid-3 { grid-template-columns: 1fr 1fr; }
  .grid-4 { grid-template-columns: 1fr 1fr; }

  /* Gap layouts → stack */
  .layout-2col { display: grid; grid-template-columns: 1fr; gap: 3rem; }

  /* Banner */
  .img-banner { height: 240px; }
  .img-banner-overlay { padding: 0 var(--pad-x-md); }

  /* Footer */
  footer { flex-direction: column; align-items: flex-start; padding: 2rem var(--pad-x-md); }
  .footer-cert { align-self: flex-start; }
}

/* ════════════════════════════════
   MOBILE  — max-width: 600px
   ════════════════════════════════ */
@media (max-width: 600px) {
  :root { --pad-x: var(--pad-x-sm); }

  nav { padding: .8rem var(--pad-x-sm); }
  .nav-logo { font-size: 1.1rem; }

  /* Page hero */
  .page-hero { padding: 6.5rem var(--pad-x-sm) 3rem; }
  .page-title { font-size: clamp(2rem, 10vw, 2.8rem); }
  .page-lead { font-size: .92rem; }

  /* Sections */
  section { padding: 4rem var(--pad-x-sm); }
  .section-title { font-size: clamp(1.7rem, 7vw, 2.4rem); }

  /* All grids → single column */
  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }

  /* Buttons full width on tiny screens */
  .btn-group { flex-direction: column; width: 100%; }
  .btn-group .btn-primary, .btn-group .btn-secondary { width: 100%; justify-content: center; }

  /* Pillar */
  .pillar { flex-direction: column; gap: 1rem; }
  .pillar:hover { transform: none; }

  /* Check item */
  .check-item:hover { padding-left: 0; }

  /* Solidita num */
  .solidita-num { font-size: 2.2rem; min-width: 72px; }

  /* Contact label stacks */
  .contact-item { flex-direction: column; gap: .35rem; }
  .contact-label { min-width: auto; }

  /* Banner */
  .img-banner { height: 200px; }
  .img-banner-overlay { background: rgba(244,251,253,.9); padding: 0 var(--pad-x-sm); }
  .img-banner-text h2 { font-size: 1.3rem; }
  .img-banner-text p { font-size: .82rem; }

  /* Card padding */
  .card, .card-mid, .card-red { padding: 1.6rem; }
  .cert-box { padding: 1.8rem; }
  .solidita { padding: 1.6rem; }
  .note-box, .highlight-box { padding: 1.4rem; }

  /* Footer */
  footer { padding: 1.8rem var(--pad-x-sm); gap: 1.5rem; }
  .footer-nav { gap: 1rem; }
  .footer-cert { flex-wrap: wrap; }
}


/* ════════════════════════════════════════════════
   WATER THEME LAYER — white base · deep-blue ink · aqua
   ════════════════════════════════════════════════ */

/* Subtle water wash across the whole page */
body {
  background-color: #ffffff;
  background-image:
    radial-gradient(900px 520px at 10% -6%, rgba(13,134,171,.07), transparent 60%),
    radial-gradient(820px 500px at 102% 6%, rgba(9,94,128,.05), transparent 55%),
    radial-gradient(700px 600px at 50% 120%, rgba(13,134,171,.05), transparent 60%);
  background-attachment: fixed;
  background-repeat: no-repeat;
}

/* Floating, glassy cards with soft aqua shadow */
.card, .card-mid, .card-red, .csi, .sh-card, .cert-box, .solidita,
.note-box, .highlight-box, .pillar, .region-pill {
  box-shadow: 0 6px 22px rgba(9,66,94,.07);
}
.card, .csi, .sh-card { border: 1px solid rgba(7,28,49,.05); }
.card:hover, .card-mid:hover, .card-red:hover, .sh-card:hover {
  box-shadow: 0 12px 30px rgba(9,66,94,.12);
}
.pillar:hover { box-shadow: 0 12px 28px rgba(9,66,94,.13); }

/* Captions read as dark ink on the new light gradient */
.img-caption { color: #071c31; }

/* Wave dividers between sections */
.divider {
  height: 22px; opacity: 1; border: 0;
  background: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'150'%20height%3D'22'%20viewBox%3D'0%200%20150%2022'%3E%3Cpath%20d%3D'M0%2012%20C%2025%203%2050%203%2075%2012%20S%20125%2021%20150%2012'%20fill%3D'none'%20stroke%3D'%230d86ab'%20stroke-width%3D'1.7'%20opacity%3D'.5'%2F%3E%3Cpath%20d%3D'M0%2016%20C%2025%208%2050%208%2075%2016%20S%20125%2024%20150%2016'%20fill%3D'none'%20stroke%3D'%23095e80'%20stroke-width%3D'1.2'%20opacity%3D'.28'%2F%3E%3C%2Fsvg%3E") repeat-x center / 150px 22px;
}

/* Aqua water buttons (replace the angular clip with soft rounded + gradient sheen) */
.btn-primary {
  clip-path: none;
  border-radius: 4px 16px 4px 16px;
  background: linear-gradient(135deg, #095e80 0%, #0d86ab 100%);
  box-shadow: 0 8px 20px rgba(9,94,128,.30);
  position: relative; overflow: hidden;
}
.btn-primary::after {
  content: ''; position: absolute; top: 0; left: -60%; width: 45%; height: 100%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,.45), transparent);
  transform: skewX(-18deg); animation: sheen 4.5s ease-in-out infinite;
}
.btn-primary:hover {
  background: linear-gradient(135deg, #0a6f95 0%, #199abf 100%);
  box-shadow: 0 12px 26px rgba(9,94,128,.40); transform: translateY(-2px);
}
@keyframes sheen { 0%,60% { left: -60%; } 100% { left: 130%; } }

/* Hero water waves — the white base section rises beneath the hero */
.page-hero { border-bottom: 0; }
.page-hero::before, #hero::before {
  content: ''; position: absolute; left: 0; bottom: -1px; width: 100%; height: 70px;
  background: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%201440%2080'%20preserveAspectRatio%3D'none'%3E%3Cpath%20d%3D'M0%2040%20C%20250%208%20470%2070%20720%2044%20C%201000%2014%201210%2072%201440%2046%20L1440%2080%20L0%2080%20Z'%20fill%3D'%2396cde0'%2F%3E%3C%2Fsvg%3E") no-repeat bottom / 100% 70px;
  z-index: 1; pointer-events: none; opacity: .85;
}
.page-hero::after, #hero::after {
  content: ''; position: absolute; left: 0; bottom: -1px; width: 100%; height: 64px;
  background: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%201440%2080'%20preserveAspectRatio%3D'none'%3E%3Cpath%20d%3D'M0%2046%20C%20220%2084%20430%206%20720%2034%20C%20980%2060%201230%2014%201440%2040%20L1440%2080%20L0%2080%20Z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E") no-repeat bottom / 100% 64px;
  z-index: 1; pointer-events: none;
}
/* avoid double separators right after the home hero */
#hero + .divider { display: none; }

/* Decorative aqua "droplet" glints in the page-hero backdrop */
.page-hero-bg::before { filter: blur(2px); }

@media (prefers-reduced-motion: reduce) {
  .btn-primary::after { animation: none; display: none; }
}

@media (max-width: 600px) {
  .divider { height: 16px; background-size: 110px 16px; }
  .page-hero::after, #hero::after { height: 44px; background-size: 100% 44px; }
  .page-hero::before, #hero::before { height: 48px; background-size: 100% 48px; }
}


/* Menu compatto tra 960px e 1200px (10 voci su una sola riga) */
@media (min-width: 961px) and (max-width: 1200px) {
  .nav-links a { font-size: .72rem; letter-spacing: .05em; padding: .4rem .5rem; }
  .nav-links a::after { left: .5rem; right: .5rem; }
}