/* ============================================================
   Oravio — content-page components (load AFTER style.css)
   Shared by terms/privacy/support/feedback/testimonials/etc.
   ============================================================ */

/* page wrapper keeps content above the canvas background */
.pg{position:relative;z-index:1;max-width:var(--maxw);margin:0 auto;padding:0 clamp(20px,5vw,48px)}
.pg-narrow{max-width:920px}

/* hero header for content pages */
.pg-hero{position:relative;z-index:1;text-align:center;padding:clamp(120px,16vh,180px) clamp(20px,5vw,48px) 40px;max-width:900px;margin:0 auto}
.pg-eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:"JetBrains Mono",ui-monospace,monospace;font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--c1);margin-bottom:18px}
.pg-eyebrow .dot{width:8px;height:8px;border-radius:50%;background:var(--c4);box-shadow:0 0 12px var(--c4)}
.pg-hero h1{font-size:clamp(34px,6vw,68px);font-weight:800;letter-spacing:-.02em;line-height:1.04;margin-bottom:18px}
.pg-hero h1 em{font-style:normal;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.pg-hero p{color:var(--ink-1);font-size:clamp(16px,2vw,19px);line-height:1.6;max-width:680px;margin:0 auto}
.pg-meta{margin-top:18px;font-family:"JetBrains Mono",monospace;font-size:12px;color:var(--ink-2);letter-spacing:.06em}

/* generic section */
.pg-section{position:relative;z-index:1;padding:48px 0}
.pg-section h2{font-size:clamp(26px,3.4vw,40px);font-weight:800;letter-spacing:-.02em;margin-bottom:18px}
.pg-section h2 em{font-style:normal;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}

/* glass card */
.pg-card{background:var(--glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:calc(var(--r) + 6px);padding:clamp(22px,4vw,40px);box-shadow:var(--shadow-glow)}
.pg-card + .pg-card{margin-top:22px}

/* legal / long-form prose */
.pg-prose{color:var(--ink-1);font-size:15.5px;line-height:1.75}
.pg-prose h2{font-size:clamp(22px,2.6vw,30px);font-weight:800;color:var(--ink-0);letter-spacing:-.01em;margin:38px 0 12px;padding-top:10px;scroll-margin-top:90px}
.pg-prose h2:first-child{margin-top:0}
.pg-prose h3{font-size:18px;font-weight:700;color:var(--ink-0);margin:24px 0 8px}
.pg-prose p{margin:0 0 14px}
.pg-prose ul,.pg-prose ol{margin:0 0 16px;padding-left:22px}
.pg-prose li{margin:0 0 8px}
.pg-prose a{color:var(--c1);text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--c1) 35%,transparent)}
.pg-prose a:hover{color:var(--c2)}
.pg-prose strong{color:var(--ink-0)}
.pg-prose hr{border:none;border-top:1px solid var(--line);margin:30px 0}
.pg-prose code{font-family:"JetBrains Mono",monospace;font-size:.88em;background:var(--grad-soft);padding:2px 7px;border-radius:6px;color:var(--ink-0)}
.pg-prose table{width:100%;border-collapse:collapse;margin:0 0 18px;font-size:14.5px}
.pg-prose th,.pg-prose td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line)}
.pg-prose th{color:var(--ink-0);font-weight:700;font-family:"JetBrains Mono",monospace;font-size:12px;letter-spacing:.05em;text-transform:uppercase}

/* table of contents */
.pg-toc{position:sticky;top:90px;align-self:start}
.pg-toc ul{list-style:none;display:grid;gap:6px;padding:0;margin:0}
.pg-toc a{display:block;font-size:13.5px;color:var(--ink-2);text-decoration:none;padding:7px 12px;border-radius:10px;border:1px solid transparent;transition:.2s var(--ease)}
.pg-toc a:hover{color:var(--ink-0);background:var(--grad-soft);border-color:var(--line)}
.pg-layout{display:grid;grid-template-columns:240px 1fr;gap:40px;align-items:start}
@media (max-width:880px){.pg-layout{grid-template-columns:1fr}.pg-toc{display:none}}

/* forms */
.pg-field{display:grid;gap:7px;margin-bottom:16px}
.pg-field label{font-size:13px;font-weight:600;color:var(--ink-1);letter-spacing:.02em}
.pg-input,.pg-textarea,.pg-select{width:100%;background:var(--bg-1);border:1px solid var(--line-2);border-radius:12px;padding:13px 15px;color:var(--ink-0);font:400 15px/1.4 "Inter",sans-serif;outline:none;transition:.2s var(--ease)}
.pg-textarea{resize:vertical;min-height:120px}
.pg-input:focus,.pg-textarea:focus,.pg-select:focus{border-color:var(--c1);box-shadow:0 0 0 3px rgba(0,184,212,.15)}
.pg-input::placeholder,.pg-textarea::placeholder{color:var(--ink-2)}
.pg-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:620px){.pg-row{grid-template-columns:1fr}}
.pg-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border:none;cursor:pointer;padding:14px 26px;border-radius:13px;background:var(--grad);color:#fff;font:700 15px "Inter",sans-serif;transition:.2s var(--ease)}
.pg-btn:hover{filter:brightness(1.08);transform:translateY(-1px)}
.pg-btn:disabled{opacity:.6;cursor:wait;transform:none}
.pg-btn-ghost{background:transparent;border:1px solid var(--line-2);color:var(--ink-0)}
.pg-btn-ghost:hover{border-color:var(--c1);filter:none}

/* badges / pills */
.pg-pill{display:inline-flex;align-items:center;gap:7px;font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--c2);background:var(--grad-soft);border:1px solid var(--line);border-radius:999px;padding:7px 13px}

/* reveal animation */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.reveal.in{opacity:1;transform:none}

/* notice / callout */
.pg-note{background:var(--grad-soft);border:1px solid var(--line);border-left:3px solid var(--c1);border-radius:12px;padding:16px 18px;color:var(--ink-1);font-size:14.5px;line-height:1.6;margin:18px 0}
.pg-note b{color:var(--ink-0)}

/* ============================================================
   LEGAL/CONTENT BRIDGE — restyle the existing .priv-* vocabulary
   (terms.html / privacy.html) onto the new design tokens.
   ============================================================ */
.blobs{display:none!important}
.page{position:relative;z-index:1}
.priv-header{position:relative;z-index:1;text-align:center;padding:clamp(120px,15vh,170px) 24px 36px;background:transparent;border:none}
.priv-tag{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:12px;font-weight:600;letter-spacing:.28em;text-transform:uppercase;color:var(--c1);margin-bottom:16px}
.priv-header h1{font-size:clamp(34px,6vw,64px);font-weight:800;letter-spacing:-.02em;line-height:1.05;color:var(--ink-0);margin-bottom:16px}
.priv-header h1 span{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.priv-meta{display:inline-flex;align-items:center;gap:16px;flex-wrap:wrap;justify-content:center;background:var(--glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--line);border-radius:999px;padding:11px 22px;font-size:12.5px;color:var(--ink-2);margin-top:10px}
.priv-meta strong{color:var(--ink-0);font-weight:700}
.priv-layout{display:grid;grid-template-columns:250px 1fr;max-width:var(--maxw);margin:0 auto;gap:36px;position:relative;z-index:1;padding:0 clamp(20px,5vw,48px)}
@media(max-width:880px){.priv-layout{grid-template-columns:1fr;gap:0}.toc{display:none}}
.toc{padding:24px 0;position:sticky;top:90px;height:auto;max-height:calc(100vh - 110px);overflow-y:auto;border:none}
.toc-title{font-family:"JetBrains Mono",monospace;font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--c1);margin-bottom:14px}
.toc a{display:block;font-size:13px;color:var(--ink-2);text-decoration:none;padding:7px 12px;border-left:none;border-radius:10px;transition:.2s var(--ease);line-height:1.4;margin-bottom:2px}
.toc a:hover,.toc a.active{color:var(--ink-0);background:var(--grad-soft)}
.priv-content{padding:32px 0 80px;color:var(--ink-1)}
.priv-section{margin-bottom:46px;scroll-margin-top:96px;background:var(--glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--line);border-radius:calc(var(--r) + 4px);padding:clamp(20px,3vw,32px)}
.priv-section h2{font-size:clamp(20px,2.4vw,28px);font-weight:800;letter-spacing:-.01em;color:var(--ink-0);margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px}
.sec-num{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:9px;background:var(--grad);color:#fff;font-size:14px;font-weight:800;flex-shrink:0}
.priv-section h3{font-size:17px;font-weight:700;color:var(--ink-0);margin:22px 0 9px}
.priv-section p{font-size:15px;color:var(--ink-1);margin-bottom:12px;line-height:1.72}
.priv-section ul{margin:8px 0 16px;padding:0;list-style:none}
.priv-section ul li{font-size:15px;color:var(--ink-1);padding:7px 0 7px 24px;border-bottom:1px solid var(--line);position:relative}
.priv-section ul li::before{content:'›';position:absolute;left:6px;color:var(--c1);font-weight:800}
.priv-section ul li:last-child{border-bottom:none}
.priv-section a{color:var(--c1);text-decoration:none}.priv-section a:hover{color:var(--c2)}
.priv-section strong{color:var(--ink-0)}
.badge{display:inline-flex;align-items:center;gap:5px;background:var(--grad-soft);color:var(--c2);font-size:12px;font-weight:700;padding:4px 11px;border-radius:999px;margin-right:6px;margin-bottom:4px;border:1px solid var(--line)}
.info-box{background:var(--grad-soft);border-left:3px solid var(--c1);border-radius:0 12px 12px 0;padding:16px 20px;margin:16px 0}
.info-box p{margin:0;font-size:14px;color:var(--ink-1);line-height:1.6}
.info-box strong{color:var(--ink-0)}
.warn-box{background:rgba(236,72,153,.08);border-left:3px solid var(--c3);border-radius:0 12px 12px 0;padding:16px 20px;margin:16px 0}
.warn-box p{margin:0;font-size:14px;color:var(--ink-1);line-height:1.6}.warn-box strong{color:var(--ink-0)}
.law-box{background:rgba(124,58,237,.08);border-left:3px solid var(--c2);border-radius:0 12px 12px 0;padding:16px 20px;margin:16px 0}
.law-box p{margin:0;font-size:14px;color:var(--ink-1);line-height:1.6}.law-box strong{color:var(--ink-0)}
.tbl-wrap{overflow-x:auto;margin:16px 0;border-radius:12px;border:1px solid var(--line)}
.priv-section table,.priv-content table{width:100%;border-collapse:collapse;font-size:14px}
.priv-section th,.priv-content th{background:var(--grad-soft);color:var(--ink-0);padding:12px 16px;text-align:left;font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.05em;font-family:"JetBrains Mono",monospace}
.priv-section td,.priv-content td{padding:12px 16px;border-bottom:1px solid var(--line);vertical-align:top;color:var(--ink-1)}
.priv-section tr:last-child td{border-bottom:none}
.contact-card{background:var(--grad-soft);border:1px solid var(--line);border-radius:16px;padding:24px 28px;margin-top:16px}
.contact-card p{margin-bottom:6px;font-size:15px;color:var(--ink-1)}.contact-card p:last-child{margin:0}
.contact-card a{color:var(--c1);text-decoration:none;font-weight:600}.contact-card a:hover{color:var(--c2)}

/* inline language switch for bilingual content pages */
.pg-lang{display:inline-flex;gap:4px;background:var(--glass);border:1px solid var(--line);border-radius:999px;padding:4px;margin-top:18px}
.pg-lang button{border:none;background:transparent;color:var(--ink-2);font:600 13px "Inter",sans-serif;padding:7px 16px;border-radius:999px;cursor:pointer;transition:.2s var(--ease)}
.pg-lang button.active{background:var(--grad);color:#fff}
