:root{
  --bg:#F7F5EF; --panel:#FFFFFF; --ink:#1C1A16; --dim:#726C60; --line:#DDD7C8;
  --acc:#1F4A44; --acc-bright:#33B88E; --on-acc:#F2F6F4; --card-wash:#EEF3F1;
  --dark1:#0E2723; --dark2:#134A3F; --dark3:#1C7A63;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){ --bg:#15140F; --panel:#1B1912; --ink:#F2EDE2; --dim:#A79D8A; --line:#332E22; --card-wash:#1B2420; }
}
:root[data-theme="dark"]{ --bg:#15140F; --panel:#1B1912; --ink:#F2EDE2; --dim:#A79D8A; --line:#332E22; --card-wash:#1B2420; }

*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Public Sans",sans-serif;-webkit-font-smoothing:antialiased}
.wrap{max-width:1180px;margin:0 auto;padding:0 30px}
a{color:inherit}

/* ===== HEADER ===== */
header.top{border-bottom:1px solid var(--line)}
header.top .wrap{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding:14px 30px}
.brand{display:flex;flex-direction:column;gap:2px;text-decoration:none;color:inherit}
.brand .ak{font:700 18px "Piazzolla",serif}
.brand .s{color:var(--acc);font-weight:700}
.brand .full{font-size:10.5px;color:var(--dim);letter-spacing:.02em}
nav.hnav{display:flex;gap:30px;font:700 11.5px "Public Sans"}
nav.hnav a{position:relative;color:var(--dim);text-decoration:none;letter-spacing:.06em;text-transform:uppercase;padding-bottom:5px;transition:color .2s ease}
nav.hnav a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:2px;background:linear-gradient(90deg,var(--acc),var(--acc-bright));transition:right .25s ease}
nav.hnav a:hover{color:var(--ink)}
nav.hnav a:hover::after{right:0}
nav.hnav a.on{color:var(--ink)}
nav.hnav a.on::after{right:0;background:var(--acc)}
.hcta{font:700 13px "Public Sans";border:1px solid var(--ink);background:none;color:var(--ink);padding:10px 18px;cursor:pointer;border-radius:5px;text-decoration:none;display:inline-block}

/* ===== HERO — dark, alive, animated gradient (energy over austerity) ===== */
@keyframes hero-drift{
  0%{background-position:0% 50%, 100% 20%, 50% 100%}
  50%{background-position:100% 50%, 0% 80%, 20% 0%}
  100%{background-position:0% 50%, 100% 20%, 50% 100%}
}
.hero-dark{
  position:relative;padding:48px 0 52px;overflow:hidden;color:#F3F6F4;
  background-color:var(--dark1);
  background-image:
    radial-gradient(60% 90% at 15% 15%, rgba(51,184,142,.55), transparent 60%),
    radial-gradient(55% 80% at 90% 25%, rgba(28,122,99,.55), transparent 60%),
    radial-gradient(70% 90% at 40% 100%, rgba(19,74,63,.85), transparent 65%);
  background-size:180% 180%, 160% 160%, 200% 200%;
  animation:hero-drift 22s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce){ .hero-dark{animation:none} }
.hero-dark--compact{padding:18px 0 18px}
.hero-dark--compact .svc-hero{max-width:none}
.hero-dark--compact .svc-hero .sec-eyebrow{margin-bottom:4px}
.hero-dark--compact .svc-hero h1{font-size:clamp(22px,2.6vw,28px);margin:6px 0 6px;line-height:1.15}
.hero-dark--compact .svc-hero p{font-size:13.5px;line-height:1.45;margin:0 0 6px;max-width:80ch}
.hero-dark--compact .svc-hero .svc-law{font-size:11.5px}
.hero{display:grid;grid-template-columns:1.3fr .9fr;gap:60px;position:relative;z-index:1}
.hero-l .eyebrow{font:700 11.5px "Public Sans";letter-spacing:.14em;text-transform:uppercase;color:var(--acc-bright);margin-bottom:18px}
.hero-l h1{font:600 clamp(34px,4.4vw,54px)/1.12 "Piazzolla",serif;margin:0 0 22px;text-wrap:balance;max-width:15ch;color:#fff}
.hero-l p{font-size:16.5px;line-height:1.65;color:rgba(243,246,244,.75);max-width:48ch;margin:0 0 28px}
.hero-l .htas{display:flex;gap:14px;flex-wrap:wrap}
.hero-l .htas button, .hero-l .htas a{font:700 13.5px "Public Sans";padding:14px 24px;cursor:pointer;border:none;border-radius:8px;text-decoration:none;display:inline-block;transition:transform .15s ease, box-shadow .15s ease}
.hero-l .htas .p1{background:var(--acc-bright);color:#062017;box-shadow:0 0 0 rgba(51,184,142,.5)}
.hero-l .htas .p1:hover{transform:translateY(-2px);box-shadow:0 10px 26px -10px rgba(51,184,142,.65)}
.hero-l .htas .p2{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.35);color:#fff;border-radius:8px}
.hero-l .htas .p2:hover{background:rgba(255,255,255,.12)}

.hero-r{display:flex;flex-direction:column;justify-content:space-between;gap:0}
.stat{padding:20px 0;border-top:1px solid rgba(255,255,255,.15)}
.stat:last-child{border-bottom:1px solid rgba(255,255,255,.15)}
.stat .n{font:700 34px "JetBrains Mono",monospace;color:var(--acc-bright);line-height:1}
.stat .l{font-size:12.5px;color:rgba(243,246,244,.65);margin-top:8px;max-width:32ch;line-height:1.4}

.hero-narrow{grid-template-columns:1fr;padding-bottom:8px}
.hero-narrow .hero-l{max-width:62ch}
.hero-narrow .hero-l h1{max-width:20ch}

/* ===== OFFER (landing grid of boxed products) ===== */
.offer{padding:60px 0 40px}

.webinar-teaser{padding:0 0 90px}
.webinar-card{
  display:block;text-decoration:none;color:#F3F6F4;padding:32px 34px;border-radius:12px;position:relative;overflow:hidden;
  background:linear-gradient(120deg,var(--dark1),var(--dark2));
  transition:transform .2s ease, box-shadow .2s ease;
}
.webinar-card:hover{transform:translateY(-4px);box-shadow:0 24px 46px -22px rgba(14,39,35,.6)}
.wt-eyebrow{font:700 11px "Public Sans";letter-spacing:.1em;text-transform:uppercase;color:var(--acc-bright);margin-bottom:10px}
.webinar-card h3{font:600 24px "Piazzolla",serif;margin:0 0 10px;color:#fff}
.webinar-card p{font-size:14.5px;line-height:1.6;color:rgba(243,246,244,.78);margin:0 0 16px;max-width:64ch}
.wt-cta{font:700 12.5px "Public Sans";color:var(--acc-bright);display:inline-flex;align-items:center;gap:6px;transition:transform .2s ease}
.webinar-card:hover .wt-cta{transform:translateX(4px)}
.offer-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.offer-card{
  display:block;border:1px solid var(--line);border-radius:12px;padding:30px 28px 26px;text-decoration:none;color:inherit;
  background:linear-gradient(160deg, color-mix(in srgb, var(--acc) 5%, var(--panel)), var(--panel) 55%);
  position:relative;overflow:hidden;box-shadow:0 10px 26px -20px rgba(31,74,68,.35);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.offer-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--acc),var(--acc-bright))}
.offer-card:hover{border-color:var(--acc);transform:translateY(-6px);box-shadow:0 26px 48px -22px rgba(31,74,68,.5)}
.oc-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:14px}
.oc-top h3{margin:0}
.offer-card h3{font:600 28px "Piazzolla",serif;margin:0;color:var(--acc);letter-spacing:-.01em}
.offer-card:hover h3{color:var(--acc-bright)}
.oc-from{text-align:right;white-space:nowrap;color:var(--dim);font-size:12px;padding-top:2px}
.oc-from .fp{display:block;font:700 19px "Public Sans";color:var(--ink)}
.offer-card p{font-size:14px;line-height:1.6;color:var(--dim);margin:0 0 14px}
.oc-law{font-size:11.5px;color:var(--acc);font-weight:600;margin-bottom:18px}
.oc-cta{font:700 12.5px "Public Sans";color:var(--ink);border-top:1px solid var(--line);padding-top:14px;transition:color .2s ease, transform .2s ease;display:inline-block}
.offer-card:hover .oc-cta{color:var(--acc);transform:translateX(4px)}

/* ===== TESTIMONIALS (light section, framed panel with animated border) ===== */
.testimonials{padding:20px 0 90px}
.testimonials .sec-h{margin:0 0 28px}
.t-panel{
  position:relative;border-radius:18px;padding:38px 0 44px;border:2px solid transparent;
  background:
    linear-gradient(var(--panel),var(--panel)) padding-box,
    repeating-linear-gradient(90deg,var(--line) 0 60px,var(--acc) 60px 100px,var(--acc-bright) 100px 140px,var(--line) 140px 200px) border-box;
  background-size:100% 100%, 200px 100%;
  animation:t-border-shimmer 7s linear infinite;
}
@keyframes t-border-shimmer{to{background-position:0 0, 200px 0}}
.t-frame{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 40px,#000 calc(100% - 40px),transparent);mask-image:linear-gradient(90deg,transparent,#000 40px,#000 calc(100% - 40px),transparent);padding:0 30px}
.t-track{display:flex;gap:16px;width:max-content;animation:t-scroll 42s linear infinite}
.t-frame:hover .t-track{animation-play-state:paused}
@keyframes t-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.t-card{flex:0 0 300px;position:relative;background:var(--wash,var(--card-wash));border:1px solid var(--line);border-radius:12px;padding:22px 22px 18px;overflow:hidden}
.t-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(180deg,var(--acc),var(--acc-bright))}
.t-mark{font:700 36px/1 "Piazzolla",serif;color:var(--acc);opacity:.18;margin:0 0 -6px;display:block}
.t-card blockquote{margin:0 0 16px;font-size:13.5px;line-height:1.55;color:var(--ink);min-height:78px}
.t-card figcaption{display:flex;align-items:center;gap:10px;border-top:1px solid var(--line);padding-top:12px}
.t-avatar{flex:none;width:30px;height:30px;border-radius:50%;background:var(--acc);color:var(--on-acc);display:flex;align-items:center;justify-content:center;font:700 11px "Public Sans"}
.t-name{font:600 12.5px "Public Sans";color:var(--ink)}
.t-role{font-size:11px;color:var(--dim)}
@media (prefers-reduced-motion: reduce){ .t-track{animation:none} .t-panel{animation:none} }

/* ===== SINGLE SERVICE PAGE ===== */
.svc-hero{max-width:70ch;position:relative;z-index:1}
.svc-hero .back{color:rgba(243,246,244,.65);text-decoration:none;font:600 11.5px "Public Sans";letter-spacing:.06em;text-transform:uppercase;border-bottom:1px solid transparent;transition:border-color .15s ease, color .15s ease}
.svc-hero .back:hover{color:#fff;border-color:rgba(255,255,255,.5)}
.svc-hero h1{font:600 clamp(28px,3.6vw,40px)/1.15 "Piazzolla",serif;margin:14px 0 16px;color:#fff}
.svc-hero p{font-size:16px;line-height:1.65;color:rgba(243,246,244,.78);margin:0 0 12px}
.svc-hero .svc-law{font-size:12px;color:rgba(243,246,244,.6)}
.svc-hero .svc-alert{
  display:inline-flex;align-items:center;gap:8px;margin-top:10px;
  font:700 13px "Public Sans";color:#4A2E0A;background:#F0B94D;
  padding:8px 14px;border-radius:6px;box-shadow:0 6px 16px -8px rgba(0,0,0,.5);
}
.svc-hero .svc-alert::before{content:"!";display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;background:#4A2E0A;color:#F0B94D;font-size:11px;flex:none}
.cfg-standalone{padding:20px 0 18px}

/* ===== SERVICES ===== */
.services{padding:60px 0 10px}
.sec-eyebrow{font:700 11.5px "Public Sans";letter-spacing:.12em;text-transform:uppercase;color:var(--acc);margin-bottom:8px}
.sec-h{font:600 27px "Piazzolla",serif;margin:0 0 40px}
.svc-row{border-top:1px solid var(--line);display:grid;grid-template-columns:220px 1fr auto;gap:36px;padding:28px 0;align-items:start;cursor:pointer;background:none;border-left:none;border-right:none;width:100%;text-align:left;font:inherit;color:inherit}
.svc-row:last-of-type{border-bottom:1px solid var(--line)}
.svc-row .idx b{color:var(--ink);display:block;font:600 19px "Piazzolla",serif}
.svc-row .body p{margin:0;font-size:14.5px;line-height:1.65;color:var(--dim);max-width:60ch}
.svc-row .body .law{font-size:12px;color:var(--acc);margin-top:8px;font-weight:600}
.svc-row .from{text-align:right;white-space:nowrap}
.svc-row .from .fl{font-size:11px;color:var(--dim)}
.svc-row .from .fp{font:700 20px "Public Sans"}
.svc-row.open{background:var(--panel)}

.cfg{padding:30px 0 0 0;display:none}
.cfg.open{display:block}
.cfg-inner{border:1px solid var(--line);background:var(--panel);border-radius:8px}

.cards{display:grid;grid-template-columns:repeat(3,1fr);align-items:stretch;gap:0;padding:6px}
.card{display:flex;flex-direction:column;padding:20px 20px;border-right:1px solid var(--line);border-radius:8px;transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;cursor:pointer}
.card:last-child{border-right:none}
.card:hover{transform:translateY(-4px);box-shadow:0 14px 28px -18px rgba(31,74,68,.4), 0 0 0 1px var(--acc);z-index:2}
.card.pop{
  background:var(--panel);position:relative;z-index:1;transform:scale(1.025);
  border-right:1px solid var(--line);
  box-shadow:0 14px 32px -18px rgba(31,74,68,.55), 0 0 0 1px var(--acc);
}
/* While hovering elsewhere in the grid, the recommended card's own ring steps
   aside so only one card is highlighted at a time — it returns once the mouse
   leaves the whole cards area, or comes back to rest on this card itself. */
.cards:hover .card.pop:not(:hover){
  box-shadow:0 14px 32px -18px rgba(31,74,68,.55);
}
.card.pop:hover{transform:scale(1.025) translateY(-4px);box-shadow:0 20px 40px -16px rgba(31,74,68,.7), 0 0 0 1px var(--acc-bright);z-index:3}
.card.pop .tag, .card.reco .tag{color:var(--acc)}
.card.pop .tag .star, .card.reco .tag .star{color:var(--acc-bright)}
.card .tag{display:flex;align-items:flex-start;min-height:28px;font:700 10.5px "Public Sans";line-height:1.35;letter-spacing:.07em;text-transform:uppercase;color:var(--dim);margin-bottom:8px}
.card h4{font:600 20px "Piazzolla",serif;margin:0 0 6px}
.card .desc{font-size:12.5px;color:var(--dim);line-height:1.5;margin:0 0 12px;min-height:32px}
.card .price{display:flex;align-items:baseline;gap:5px;margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.card .price b{font:700 32px "Public Sans"}
.card.pop .price b{color:var(--acc)}
.card .price span{font-size:12px;color:var(--dim)}
.card ul{list-style:none;margin:0 0 14px;padding:0}
.card li{font-size:12.5px;line-height:1.4;padding:6px 0 6px 26px;border-bottom:1px solid var(--line);position:relative}
.card li:last-child{border-bottom:none}
.card li::before{
  content:"✓";position:absolute;left:0;top:8px;width:16px;height:16px;border-radius:50%;
  background:var(--line);color:var(--panel);font-size:10px;font-weight:700;line-height:16px;text-align:center;
  transition:background .2s ease, color .2s ease;
}
.card.pop li::before, .card.selected li::before{background:var(--acc-bright);color:#062017}
.card button{
  box-sizing:border-box;font:700 13px "Public Sans";width:100%;height:46px;text-align:center;padding:0 16px;
  border-radius:6px;cursor:pointer;border:1.5px solid var(--line);background:none;color:var(--ink);
  transition:transform .15s ease, background .15s ease, border-color .15s ease, color .15s ease;
  margin-top:auto;
}
.card button:hover{border-color:var(--acc);color:var(--acc)}
.card.pop button, .card.selected button{background:var(--acc);border-color:var(--acc);color:var(--on-acc)}
.card.pop button:hover, .card.selected button:hover{background:var(--acc-bright);border-color:var(--acc-bright);color:#062017}

.extras{padding:16px 20px;border-top:1px solid var(--line);border-radius:0 0 8px 8px;overflow:hidden}
.extras .lbl{font:700 11px "Public Sans";letter-spacing:.05em;text-transform:uppercase;color:var(--dim);margin-bottom:12px}
.chips{display:flex;gap:12px;flex-wrap:wrap}
.chip{
  box-sizing:border-box;font:600 13px "Public Sans";height:46px;padding:0 16px;
  display:flex;align-items:center;justify-content:center;
  color:var(--ink);cursor:pointer;border:1.5px solid var(--line);border-radius:6px;background:none;
  flex:1;min-width:180px;text-align:center;
  transition:background .15s ease, border-color .15s ease, color .15s ease;
}
.chip:hover{border-color:var(--acc);color:var(--acc)}
.chip.on{background:var(--acc);border-color:var(--acc);color:var(--on-acc)}
.chip.on:hover{background:var(--acc-bright);border-color:var(--acc-bright);color:#062017}
.chip span{opacity:.7;font-weight:400;margin-left:4px}
.chip.on span{opacity:.85}

/* ===== STICKY SUMMARY BAR ===== */
/* Deliberately static, not sticky — sticky was overlapping card content on short
   viewports (e.g. 1280x551) since the page's total height barely exceeded the
   viewport, leaving no clearance for the "stuck" bar to rest without covering
   the tier cards above it. A normal in-flow bar never overlaps anything. */
.bar{margin:28px 0 44px;background:linear-gradient(120deg,var(--dark1),var(--dark2));color:var(--bg);padding:18px 22px;display:flex;flex-direction:column;gap:14px;border-radius:8px;box-shadow:0 20px 40px -20px rgba(0,0,0,.5)}
.bar .sel{font:600 12px "Public Sans";color:rgba(255,255,255,.6);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bar .sel b{color:#fff;font-weight:600}
.bar-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px}
.bar .price{display:flex;align-items:center;gap:16px;flex:none}
.bar .price .vat{font-size:11px;color:rgba(255,255,255,.5)}
.bar .price b{font:700 22px "JetBrains Mono",monospace}
.bar-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.bar button{font:700 13px "Public Sans";background:var(--acc-bright);color:#062017;border:none;padding:13px 22px;cursor:pointer;border-radius:6px;transition:transform .15s ease, box-shadow .15s ease}
.bar button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 24px -10px rgba(51,184,142,.6)}
.bar button:disabled{opacity:.4;cursor:not-allowed}
.bar button.ghost{background:none;border:1px solid rgba(255,255,255,.3);color:#fff}
.bar button.ghost:hover{background:rgba(255,255,255,.1);box-shadow:none}
.cart-note-box{font-size:13px;color:var(--dim);background:var(--panel);border:1px solid var(--line);border-left:2px solid var(--acc);padding:12px 16px;border-radius:0 6px 6px 0;margin-top:20px}

/* ===== CHECKOUT ===== */
.checkout{padding:70px 0 90px}
.co-top{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:36px}
.co-top h2{font:600 26px "Piazzolla",serif;margin:0}
.steps3{display:flex;gap:0;border:1px solid var(--line);border-radius:6px;overflow:hidden}
.steps3 .s{padding:9px 18px;font:600 12px "Public Sans";color:var(--dim);border-right:1px solid var(--line)}
.steps3 .s:last-child{border-right:none}
.steps3 .s.on{color:var(--on-acc);background:var(--acc)}
.steps3 .s.done{color:var(--acc)}
.co-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:0;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.co-form, .co-summary{min-width:0}
.co-form{padding:32px 34px;border-right:1px solid var(--line)}
.co-form .fh{font:700 12px "Public Sans";letter-spacing:.05em;text-transform:uppercase;color:var(--dim);margin-bottom:6px}
.co-form .fnote{font-size:13px;color:var(--ink);line-height:1.6;margin:0 0 26px;padding:14px 16px;background:var(--panel);border-left:2px solid var(--acc)}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font:600 11.5px "Public Sans";color:var(--dim)}
.field input{border:1px solid var(--line);background:var(--panel);color:var(--ink);padding:11px 12px;font:500 14px "Public Sans";border-radius:5px}
.field.full{grid-column:1/-1}
.co-summary{padding:32px 30px;background:var(--panel)}
.co-summary h3{font:700 15px "Public Sans";margin:0 0 18px}
.co-line{display:flex;justify-content:space-between;font-size:13px;padding:11px 0;border-bottom:1px solid var(--line);color:var(--dim)}
.co-remove{border:none;background:none;color:var(--dim);cursor:pointer;font-size:15px;line-height:1;margin-left:8px;padding:0}
.co-remove:hover{color:#B23B3B}
.co-line b{color:var(--ink);font-weight:600}
.co-line.total{border-bottom:none;padding-top:16px;margin-top:6px;border-top:1px solid var(--ink)}
.co-line.total b{font:700 22px "JetBrains Mono",monospace}
.co-summary > button{width:100%;margin-top:20px;font:700 13.5px "Public Sans";background:var(--acc);color:var(--on-acc);border:none;padding:15px;cursor:pointer;border-radius:5px}
.co-summary > button:disabled{opacity:.4;cursor:not-allowed}
.co-remove{width:auto!important;margin:0!important;padding:0!important;background:none!important}
.err{color:#B23B3B;font-size:13px;margin-top:10px}
.confirm{text-align:center;padding:50px 20px}
.confirm h2{font:600 30px "Piazzolla",serif;margin:0 0 14px}
.confirm p{color:var(--dim);font-size:15px;line-height:1.6;max-width:52ch;margin:0 auto 8px}
.pay-box{max-width:440px;margin:28px auto;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--panel);text-align:left}
.pay-row{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 20px;border-bottom:1px solid var(--line);font-size:14px}
.pay-row:last-child{border-bottom:none}
.pay-row span{color:var(--dim)}
.pay-row b{font:700 15px "JetBrains Mono",monospace;color:var(--ink)}
.pay-row.total{background:var(--wash,var(--card-wash))}
.pay-row.total b{font-size:20px;color:var(--acc)}
.pay-next{font-weight:600;color:var(--ink)!important}

/* ===== RICH FOOTER: legal block + contact form ===== */
footer.site{background:linear-gradient(135deg,var(--dark1),var(--dark2));color:#EDEFEC;position:relative;overflow:hidden}
footer.site::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:radial-gradient(1px 1px at 20% 30%, rgba(255,255,255,.12) 1px, transparent 0),
    radial-gradient(1px 1px at 70% 60%, rgba(255,255,255,.1) 1px, transparent 0),
    radial-gradient(1px 1px at 40% 80%, rgba(255,255,255,.08) 1px, transparent 0);
  background-size:220px 220px;
}
footer.site .fgrid{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:60px;padding:64px 30px 40px}
footer.site h4{font:600 20px "Piazzolla",serif;margin:0 0 20px;color:#fff}
footer.site .legal-lines{font-size:14px;line-height:2;color:rgba(237,239,236,.8)}
footer.site .legal-lines b{color:#fff}
footer.site .legal-lines .div{height:1px;background:rgba(255,255,255,.14);margin:14px 0}
.mail-badge{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;background:var(--acc-bright);color:#062017;margin-top:18px;text-decoration:none;font-size:16px;transition:transform .15s ease}
.mail-badge:hover{transform:translateY(-2px) scale(1.05)}

.privacy-note{font-size:11px;line-height:1.6;color:rgba(237,239,236,.45);max-width:56ch;margin-top:22px}
.privacy-note a{color:rgba(237,239,236,.65)}

.contact-form-box{position:relative;z-index:1}
#contact-form{display:flex;flex-direction:column;gap:12px}
#contact-form .frow2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
#contact-form label{font:600 11.5px "Public Sans";color:rgba(237,239,236,.65);margin-bottom:5px;display:block}
#contact-form input, #contact-form select, #contact-form textarea{
  width:100%;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);color:#fff;
  padding:10px 12px;font:500 14px "Public Sans";border-radius:6px;
}
#contact-form input::placeholder, #contact-form textarea::placeholder{color:rgba(237,239,236,.4)}
#contact-form select option{color:#111}
#contact-form textarea{resize:vertical;min-height:80px}
#contact-form button{
  align-self:flex-start;font:700 13px "Public Sans";background:var(--acc-bright);color:#062017;border:none;
  padding:13px 24px;border-radius:6px;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease;
}
#contact-form button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 24px -10px rgba(51,184,142,.6)}
#contact-form button:disabled{opacity:.6;cursor:not-allowed}
.contact-note{font-size:13.5px;margin-top:6px}
.contact-note.ok{color:var(--acc-bright)}
.contact-note.err{color:#F0A0A0}

footer.site .fbottom{position:relative;z-index:1;border-top:1px solid rgba(255,255,255,.12);padding:20px 30px;font-size:12px;color:rgba(237,239,236,.55)}

@media(max-width:820px){
  footer.site .fgrid{grid-template-columns:1fr;gap:36px;padding:48px 24px 32px}
  #contact-form .frow2{grid-template-columns:1fr}
}

/* ===== HEADER CART BADGE ===== */
#cart-badge{display:none;font:700 12.5px "Public Sans";background:var(--acc);color:var(--on-acc);padding:8px 14px;border-radius:20px;text-decoration:none}
#cart-badge:hover{background:var(--acc-bright);color:#062017}

/* ===== OLD (minimal) FOOTER — kept for any page not yet migrated ===== */

@media(max-width:900px){
  .hero{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr}
  .card{border-right:none;border-bottom:1px solid var(--line)}
  .card.pop{transform:none}
  .card.pop:hover{transform:translateY(-4px)}
  .co-grid{grid-template-columns:1fr}
  .co-form{border-right:none;border-bottom:1px solid var(--line)}
  .svc-row{grid-template-columns:1fr}
  .offer-grid{grid-template-columns:1fr}
  .frow{grid-template-columns:1fr}
}

@media(max-width:620px){
  .t-head{flex-direction:column;align-items:flex-start;gap:12px}
  .t-card{flex-basis:78vw}
}

/* ===== SMALL PHONES ===== */
@media(max-width:560px){
  .wrap{padding:0 18px}
  header.top .wrap{padding:18px}
  .brand .full{display:none}
  nav.hnav{gap:16px;font-size:12.5px}

  .hero-dark{padding:34px 0 36px}
  .hero-l .eyebrow{margin-bottom:12px}
  .hero-l h1{font-size:30px;max-width:none}
  .hero-l p{font-size:15px}
  .hero-l .htas{gap:10px}
  .hero-l .htas button, .hero-l .htas a{padding:12px 18px;font-size:13px;flex:1;text-align:center}

  .offer{padding:36px 0 60px}
  .sec-h{font-size:22px;margin-bottom:24px}
  .offer-card{padding:22px 20px}
  .offer-card h3{font-size:22px}
  .oc-top{flex-wrap:wrap;gap:8px}

  .svc-hero h1{font-size:26px}
  .card{padding:16px 16px}
  .card .price b{font-size:26px}

  .chip{min-width:0;flex:1 1 100%}

  .bar{flex-direction:column;align-items:stretch;gap:10px;padding:16px 18px;position:static;margin-top:16px}
  .bar .price{flex-direction:column;align-items:stretch;gap:10px}
  .bar .price .vat{width:100%}
  .bar button{width:100%;text-align:center}

  .co-top{align-items:flex-start}
  .steps3{width:100%}
  .steps3 .s{flex:1;text-align:center;padding:9px 4px;font-size:11px}
  .co-form{padding:22px 20px}
  .co-summary{padding:22px 20px}

  footer.site .fgrid{padding:36px 18px 24px;gap:28px}
  footer.site .fbottom{padding:16px 18px}
  #contact-form .frow2{gap:10px}
}