/* =========================================================
   CIAO Travels · privacy.html  (page-scoped, prefix .pv-)
   Notice (art. 13 GDPR) for the website and the Captain's Club:
   yellow hero with the "in breve" ink card and the controller
   card, then a sub-nav over four chapters (sito · club · cookie ·
   diritti). Text pages read best narrow: prose ≤ 70ch, tables
   scroll sideways inside their own box on phones.
   ========================================================= */

/* ---------- hero ---------- */
.pv-hero{position:relative;isolation:isolate;background:var(--y);color:var(--ink);padding:calc(var(--hdr) + clamp(26px,5vw,72px)) 0 clamp(52px,6vw,88px)}
.pv-hero::before{content:"";position:absolute;inset:0;z-index:-1;background-image:radial-gradient(rgba(11,11,12,.13) 1.4px,transparent 1.6px);background-size:14px 14px;-webkit-mask-image:linear-gradient(115deg,transparent 40%,#000 85%);mask-image:linear-gradient(115deg,transparent 40%,#000 85%)}
.pv-hero__grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.9fr);gap:clamp(28px,5vw,80px);align-items:end}
.pv-hero__k{font-size:.72rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--y-ink)}
.pv-title{font-weight:900;text-transform:uppercase;letter-spacing:-.05em;line-height:.86;font-size:clamp(3.2rem,8.4vw,7.6rem);margin:.18em 0 .28em}
.pv-title .script{display:block;color:var(--ink);font-size:.58em;line-height:1.05;margin-top:.02em;transform:rotate(-3deg);transform-origin:0 50%}
.pv-hero .pv-hero__lead{color:var(--y-ink);max-width:44ch}
.pv-upd{margin-top:18px;display:inline-block;padding:.4rem .85rem;border-radius:999px;background:var(--ink);color:var(--y);font-size:.8rem;font-weight:700}
.pv-upd time{color:var(--white)}

.pv-brief{position:relative;background:var(--ink);color:var(--white);border:3px solid var(--ink);border-radius:var(--r);padding:clamp(22px,2.6vw,32px);box-shadow:10px 10px 0 var(--white);rotate:1deg}
.pv-brief__h{font-weight:900;text-transform:uppercase;letter-spacing:-.03em;font-size:clamp(1.5rem,2.4vw,2rem);line-height:1;color:var(--y);margin-bottom:14px}
.pv-brief__l{list-style:none;display:grid;gap:12px}
.pv-brief__l li{position:relative;padding-left:30px;font-size:.95rem;line-height:1.5;color:#e4e4e8}
.pv-brief__l li::before{content:"";position:absolute;left:0;top:.28em;width:18px;height:18px;border-radius:50%;background:var(--y);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='12'/%3E%3C/svg%3E") center/contain no-repeat}
.pv-brief__l li::after{content:"";position:absolute;left:5px;top:calc(.28em + 5px);width:8px;height:5px;border-left:2.5px solid var(--ink);border-bottom:2.5px solid var(--ink);rotate:-45deg}

/* the controller: a paper card with the comic hard shadow */
.pv-who{margin-top:clamp(36px,5vw,64px);background:var(--paper);border:3px solid var(--ink);border-radius:var(--r);box-shadow:8px 8px 0 var(--ink);padding:clamp(22px,3vw,36px);display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.6fr);gap:10px clamp(20px,4vw,56px);scroll-margin-top:calc(var(--hdr) + 20px)}
.pv-who__h{grid-column:1/-1;font-weight:900;text-transform:uppercase;letter-spacing:-.03em;font-size:clamp(1.35rem,2.4vw,1.9rem);line-height:1}
.pv-who>p{color:var(--steel);max-width:40ch}
.pv-who__dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 28px}
.pv-who__dl dt{font-size:.68rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--steel)}
.pv-who__dl dd{font-weight:700;font-size:.98rem;overflow-wrap:anywhere}
.pv-who__dl a{display:inline-flex;align-items:center;min-height:32px;text-decoration:underline;text-decoration-color:rgba(11,11,12,.3);text-underline-offset:3px}
.pv-who__dl a:hover{text-decoration-color:currentColor}

/* ---------- sub-nav + chapters ---------- */
.pv-body{position:relative}
.p-privacy .pv-sub{margin-block:calc(var(--subnav-h,66px) / -2)}
.pv-sub .chip{gap:7px}
.pv-sub__n{font-size:.66rem;font-weight:900;letter-spacing:.06em;opacity:.55}
.pv-sub .chip.is-on .pv-sub__n{opacity:1}
.pv-sec{overflow:hidden;overflow:clip}
.pv-sec:first-of-type{padding-top:clamp(96px,11vw,170px)}

/* ---------- text ---------- */
.pv-prose{max-width:70ch}
.pv-prose--wide{max-width:84ch}
.pv-prose>.h2{margin-bottom:.5em}
.pv-prose .h3{margin:clamp(30px,3.4vw,44px) 0 12px}
.pv-prose p{margin-bottom:12px;line-height:1.65}
.pv-prose a:not(.btn){text-decoration:underline;text-decoration-color:currentColor;text-decoration-thickness:1px;text-underline-offset:3px;font-weight:600}
.pv-lede{font-size:clamp(1.05rem,1.3vw,1.2rem);font-weight:500}
.sec--paper .pv-prose p,.sec--white .pv-prose p,.sec--paper .pv-list li,.sec--white .pv-list li{color:#33363d}
.pv-list{list-style:none;display:grid;gap:14px;margin:8px 0 14px}
.pv-list li{position:relative;padding-left:24px;line-height:1.62}
.pv-list li::before{content:"";position:absolute;left:2px;top:.62em;width:10px;height:10px;background:var(--y);border:2px solid var(--ink);rotate:45deg}
.pv-list b{color:var(--ink)}
.pv-list--cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 36px}
.pv-note{padding:12px 16px;border-left:4px solid var(--y);background:rgba(253,182,28,.12);border-radius:0 var(--r-s) var(--r-s) 0;font-size:.94rem}
.pv-cap{margin-bottom:clamp(26px,3.4vw,44px)}

/* tables: one box with its own sideways scroll on phones */
.pv-tbl{margin:14px 0 18px;max-width:100%;overflow-x:auto;border:2px solid var(--ink);border-radius:var(--r-s);background:var(--white);box-shadow:5px 5px 0 var(--ink)}
.pv-tbl:focus-visible{outline:3px solid var(--ink);outline-offset:4px}
.pv-tbl table{width:100%;border-collapse:collapse;font-size:.92rem;min-width:520px}
.pv-tbl caption{text-align:left;padding:12px 14px 8px;font-size:.7rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--steel)}
.pv-tbl th{background:var(--ink);color:var(--y);text-align:left;font-size:.74rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:10px 14px}
.pv-tbl td{padding:11px 14px;vertical-align:top;border-top:1px solid var(--line);line-height:1.5;color:#33363d}
.pv-tbl td:first-child{font-weight:700;color:var(--ink)}
.pv-tbl code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.86em;background:var(--y-100);padding:.1em .4em;border-radius:6px;white-space:nowrap}

/* ---------- rights (ink) ---------- */
.sec--ink .pv-prose p{color:#cfcfd6}
.sec--ink .pv-prose a:not(.btn){color:var(--y)}
.pv-rights{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 18px;margin:14px 0 26px;counter-reset:pv}
.pv-rights li{counter-increment:pv;position:relative;padding:14px 16px 14px 56px;border:1.5px solid var(--ink-4);border-radius:var(--r-s);background:var(--ink-2);color:#cfcfd6;line-height:1.5}
.pv-rights li::before{content:counter(pv,decimal-leading-zero);position:absolute;left:14px;top:13px;font-weight:900;font-size:.9rem;color:var(--ink);background:var(--y);border-radius:8px;padding:2px 6px}
.pv-rights b{color:var(--white)}
.pv-how{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-bottom:24px}
.pv-how__c{padding:20px 22px;border-radius:var(--r);background:var(--y);color:var(--ink);border:3px solid var(--ink);box-shadow:6px 6px 0 var(--y-600)}
.pv-how__c .h3{margin:0 0 8px;color:var(--ink)}
.sec--ink .pv-how__c p{color:var(--y-ink);margin:0}
.sec--ink .pv-how__c a:not(.btn){color:var(--ink)}
.sec--ink .pv-note{background:rgba(253,182,28,.1);color:#cfcfd6}

/* ---------- responsive ---------- */
@media (max-width:1024px){
  .pv-hero__grid{grid-template-columns:1fr;align-items:start}
  .pv-brief{rotate:0deg;max-width:640px}
  .pv-who{grid-template-columns:1fr}
}
@media (max-width:760px){
  .pv-list--cols,.pv-rights,.pv-how{grid-template-columns:1fr}
  .pv-who__dl{grid-template-columns:1fr}
}
@media (max-width:640px){
  .pv-title{font-size:clamp(2.9rem,15vw,4.4rem)}
  .pv-brief{box-shadow:7px 7px 0 var(--white)}
  .pv-who{box-shadow:6px 6px 0 var(--ink)}
  .pv-tbl table{min-width:480px}
}

/* ---------- print (LB-02): the notice as a clean A4 document the desk can hand over ----------
   Only the notice prints: no header, phone menu, chapter bar, footer, Captain helper, skip link or grain (the site
   has no cookie banner). Black on white, no comic shadows, tilts, dots or yellow fills; the four chapters run on,
   headings stay with their text, list items, table rows and cards never split. Links to other sites, and the
   Club rules, print their address. Sizes in pt, like the rules printed from club/#/rules (club/app.css). */
@media print{
  @page{size:A4;margin:16mm 15mm 18mm}
  html,body.p-privacy{background:#fff!important;color:#000}
  body.p-privacy{font-size:10.5pt;line-height:1.45}
  body.p-privacy::after{display:none!important}
  .p-privacy .skip,.p-privacy .hdr,.p-privacy .mnav,.p-privacy .ftr,.p-privacy .dock,.p-privacy .toast,.p-privacy .cur,.p-privacy .wipe,.p-privacy .loader,.p-privacy .pv-sub{display:none!important}
  .p-privacy #main,.p-privacy #main *{color:#000!important;background-color:transparent!important;box-shadow:none!important;text-shadow:none!important}
  .p-privacy .reveal{opacity:1!important;transform:none!important}
  /* where the paper came from: the header with the logo does not print */
  .p-privacy #main::before{content:"CIAO Travels · ciaotravels.it/privacy.html";display:block;margin-bottom:12pt;padding-bottom:4pt;border-bottom:1.5pt solid #000;font-size:8.5pt;font-weight:700;letter-spacing:.04em}
  .p-privacy .wrap{max-width:none;padding-inline:0}

  /* hero: title, date, in short, the controller */
  .p-privacy .pv-hero{padding:0;background:none}
  .p-privacy .pv-hero::before{display:none}
  .p-privacy .pv-hero__grid{display:block}
  .p-privacy .pv-hero__k{font-size:8pt;letter-spacing:.14em}
  .p-privacy .pv-title{font-size:26pt;line-height:1;letter-spacing:-.03em;margin:3pt 0 6pt}
  .p-privacy .pv-title .script{display:inline;font-size:.8em;margin-left:.12em;transform:none}
  .p-privacy .pv-hero .pv-hero__lead{max-width:none;font-size:11pt;line-height:1.45}
  .p-privacy .pv-upd{display:block;margin-top:5pt;padding:0;border-radius:0;font-size:9.5pt}
  .p-privacy .pv-brief,.p-privacy .pv-who{margin-top:10pt;padding:8pt 12pt;border:1pt solid #000;border-radius:6pt;rotate:none;break-inside:avoid}
  .p-privacy .pv-brief{max-width:none}
  .p-privacy .pv-brief__h,.p-privacy .pv-who__h{font-size:11pt;margin-bottom:5pt}
  .p-privacy .pv-brief__l{gap:3pt}
  .p-privacy .pv-brief__l li{padding-left:16pt;font-size:10pt;line-height:1.4}
  .p-privacy .pv-brief__l li::before{display:none}
  .p-privacy .pv-brief__l li::after{left:2pt;top:.32em;border-color:#000}
  .p-privacy .pv-who{display:block}
  .p-privacy .pv-who>p{max-width:none;margin-bottom:6pt}
  .p-privacy .pv-who__dl{grid-template-columns:repeat(2,minmax(0,1fr));gap:5pt 18pt}
  .p-privacy .pv-who__dl dt{font-size:7.5pt;letter-spacing:.12em}
  .p-privacy .pv-who__dl dd{font-size:10pt}
  .p-privacy .pv-who__dl a{display:inline;min-height:0;text-decoration:none}

  /* chapters: openers flattened to a kicker line over the heading */
  .p-privacy .pv-body{position:static}
  .p-privacy .pv-sec,.p-privacy .pv-sec:first-of-type{padding:16pt 0 0;overflow:visible}
  .p-privacy .op-side{display:block}
  .p-privacy .op-side__l{position:static;display:block;justify-self:start;writing-mode:horizontal-tb;rotate:none;margin-bottom:3pt;text-align:left;font-size:8pt;letter-spacing:.14em;white-space:normal}
  .p-privacy .op-side__l::before{display:none}
  .p-privacy .op-cap{width:auto;max-width:none;margin:0 0 6pt;padding:0;border:0;rotate:none;break-inside:avoid;break-after:avoid-page}
  .p-privacy .op-cap .op-cap__n{position:static;display:block;translate:none;padding:0;margin-bottom:3pt;font-size:8pt;letter-spacing:.14em}
  .p-privacy .op-cap .op-cap__note{max-width:none;margin-top:3pt;font-size:10pt;opacity:1}
  .p-privacy .h2{font-size:18pt;line-height:1.05;letter-spacing:-.03em;break-after:avoid-page}
  .p-privacy .op-side__l,.p-privacy .pv-prose .h3{break-after:avoid-page}
  .p-privacy .pv-prose,.p-privacy .pv-prose--wide{max-width:none}
  .p-privacy .pv-prose>.h2{margin-bottom:6pt}
  .p-privacy .pv-prose .h3{font-size:12pt;margin:12pt 0 4pt}
  .p-privacy .pv-prose p{margin-bottom:5pt;line-height:1.45;orphans:3;widows:3}
  .p-privacy .pv-lede{font-size:11pt}

  /* lists, notes, tables */
  .p-privacy .pv-list{gap:4pt;margin:4pt 0 8pt}
  .p-privacy .pv-list li{padding-left:13pt;line-height:1.45;break-inside:avoid}
  .p-privacy .pv-list li::before{left:1pt;top:.48em;width:5pt;height:5pt;border-width:1.2pt;border-color:#000;background:#fff}
  .p-privacy .pv-list--cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:6pt 18pt}
  .p-privacy .pv-note{padding:2pt 0 2pt 9pt;border-left:2pt solid #000;border-radius:0;font-size:9.5pt;break-inside:avoid}
  .p-privacy .pv-tbl{overflow:visible;margin:6pt 0 10pt;border:1pt solid #000;border-radius:0;break-inside:avoid}
  .p-privacy .pv-tbl table{min-width:0;font-size:9.5pt}
  .p-privacy .pv-tbl caption{padding:5pt 8pt 3pt;font-size:7.5pt;letter-spacing:.12em}
  .p-privacy .pv-tbl th{padding:3pt 8pt;font-size:7.5pt;border-bottom:1pt solid #000}
  .p-privacy .pv-tbl td{padding:4pt 8pt;border-top:.5pt solid #999;line-height:1.4}
  .p-privacy .pv-tbl tr{break-inside:avoid}
  .p-privacy .pv-tbl code{padding:0;font-size:.9em}

  /* your rights */
  .p-privacy .pv-rights{grid-template-columns:repeat(2,minmax(0,1fr));gap:4pt 18pt;margin:4pt 0 10pt}
  .p-privacy .pv-rights li{padding:0 0 0 22pt;border:0;border-radius:0;line-height:1.45;break-inside:avoid}
  .p-privacy .pv-rights li::before{left:0;top:.1em;padding:0 2pt;border:1pt solid #000;border-radius:3pt;background:#fff;color:#000;font-size:7.5pt}
  .p-privacy .pv-how{grid-template-columns:repeat(2,minmax(0,1fr));gap:10pt;margin-bottom:10pt}
  .p-privacy .pv-how__c{padding:7pt 10pt;border:1pt solid #000;border-radius:6pt;break-inside:avoid}
  .p-privacy .pv-how__c .h3{margin:0 0 3pt}

  /* links: underlined; other sites and the Club rules print their address (mail and phone already show it) */
  .p-privacy .pv-prose a:not(.btn){text-decoration:underline;text-decoration-thickness:.5pt;text-underline-offset:2pt}
  .p-privacy .pv-prose a[href^="http"]::after,.p-privacy .pv-rules::after{display:inline-block;margin-left:.3em;font-weight:400;text-decoration:none}
  .p-privacy .pv-prose a[href^="http"]::after{content:"(" attr(href) ")"}
  .p-privacy .pv-rules::after{content:"(ciaotravels.it/club/#/rules)"}
}