/* ══════════════════════════════════════════════════════════════
   CollageForge Pro — LEGAL PAGES (privacy.html / terms.html)
   Standalone "Forge Atelier" stylesheet — premium editorial legal.
   Zero dependency on styles.css.
   ══════════════════════════════════════════════════════════════ */

:root{
  --paper:#fbf8f2; --paper-2:#f3eee3; --card:#ffffff;
  --ink:#1a1612; --ink-2:#2d2620; --body:#3a342c; --muted:#6b6256; --faint:#9a9082;
  --line:rgba(26,22,18,.10); --line-soft:rgba(26,22,18,.07);
  --gold:#9a7b2e; --gold-2:#c9a24b; --gold-deep:#6f5320;
  --brass-soft:#e9d9a8; --champagne:#f4eddc; --ember:#e4572e;
  --espresso:#17130c;
  --grad-gold:linear-gradient(120deg,#6f5320 0%,#9a7b2e 45%,#c9a24b 100%);
  --sh-sm:0 1px 2px rgba(26,22,18,.04),0 4px 12px rgba(26,22,18,.06);
  --sh-md:0 2px 8px rgba(26,22,18,.05),0 18px 44px rgba(26,22,18,.10);
  --sh-lg:0 8px 28px rgba(26,22,18,.10),0 30px 70px rgba(154,123,46,.12);
  --r-sm:10px; --r:16px; --r-lg:22px; --r-xl:28px;
  --font-ui:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-display:"Fraunces",Georgia,"Times New Roman",serif;
  --nav-h:72px;
  --ease:cubic-bezier(.22,1,.36,1);
  --legal-max:760px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 14px);overflow-x:hidden}
body{font-family:var(--font-ui);font-size:17px;line-height:1.78;color:var(--body);background:var(--paper);-webkit-font-smoothing:antialiased;overflow-x:hidden;position:relative}
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(ellipse 62% 40% at 50% -8%,rgba(233,217,168,.34),transparent 70%),
    radial-gradient(ellipse 40% 30% at 88% 0%,rgba(154,123,46,.08),transparent 72%);
  opacity:.9}
body::after{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.025;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .05 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
::selection{background:rgba(154,123,46,.22);color:var(--ink)}
:focus-visible{outline:2px solid var(--gold-deep);outline-offset:3px;border-radius:6px}
h1,h2{text-wrap:balance}

/* ── Kicker pill ── */
.kicker{display:inline-flex;align-items:center;gap:10px;font-size:.72rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep);background:rgba(233,217,168,.32);border:1px solid rgba(154,123,46,.22);padding:7px 16px;border-radius:99px;margin-bottom:16px}
.kicker i{display:block;width:18px;height:1.5px;background:currentColor;opacity:.5}

/* ── Nav ── */
.container{width:min(1220px,100% - 40px);margin-inline:auto}
.navbar{position:sticky;top:0;z-index:1200;background:rgba(251,248,242,.88);backdrop-filter:blur(16px) saturate(150%);-webkit-backdrop-filter:blur(16px) saturate(150%);border-bottom:1px solid var(--line)}
.nav-container{min-height:var(--nav-h);display:flex;align-items:center;gap:14px}
.nav-brand{display:flex;align-items:center;gap:10px;flex-shrink:0}
.nav-logo{width:36px;height:36px;border-radius:11px;object-fit:cover;background:#fff;box-shadow:0 4px 14px rgba(154,123,46,.24)}
.nav-brand-text{font-family:var(--font-display);font-weight:700;font-size:1.12rem;letter-spacing:-.02em;color:var(--ink)}
.brand-pro{font-style:normal;background:var(--grad-gold);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.header-suite-nav{flex:1;display:flex;justify-content:center;min-width:0}
#suite-nav-root{overflow:visible!important;min-height:2.35rem}
body>.sn-panel-wrap{position:fixed!important;left:0!important;right:0!important;top:var(--nav-h)!important;z-index:10050!important}
body.sn-suite-compact>.sn-panel-wrap{display:none!important}

/* ── Legal hero header ── */
.legal-page{position:relative;padding:56px 0 clamp(80px,10vw,120px);overflow:hidden}
.legal-container{position:relative;z-index:1;width:min(var(--legal-max),100% - 40px);margin-inline:auto}
.legal-header{text-align:center;margin-bottom:48px}
.legal-back{display:inline-flex;align-items:center;gap:7px;padding:8px 16px 8px 12px;border-radius:99px;background:rgba(255,255,255,.72);border:1px solid var(--line);box-shadow:var(--sh-sm);font-size:.84rem;font-weight:600;color:var(--muted);transition:transform .3s var(--ease),box-shadow .3s var(--ease),color .2s ease}
.legal-back svg{width:15px;height:15px;color:var(--gold-deep)}
.legal-back:hover{transform:translateY(-1px);box-shadow:var(--sh-md);color:var(--ink)}
.legal-header .kicker{display:inline-flex;margin:20px 0 14px}
.legal-title{font-family:var(--font-display);font-size:clamp(2.6rem,5.6vw,3.8rem);font-weight:700;line-height:1.02;letter-spacing:-.035em;color:var(--ink);position:relative;padding-bottom:20px}
.legal-title::after{content:"";position:absolute;left:50%;transform:translateX(-50%);bottom:0;width:64px;height:2px;border-radius:2px;background:var(--grad-gold);opacity:.8}
.legal-title em{font-style:italic;background:var(--grad-gold);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.legal-updated{display:inline-flex;align-items:center;gap:8px;margin-top:20px;font-size:.78rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.legal-updated::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 3px rgba(154,123,46,.14)}

/* ── Content card ── */
.legal-content{background:var(--card);border:1px solid var(--line-soft);border-radius:var(--r-xl);padding:clamp(32px,5vw,56px);box-shadow:var(--sh-md)}
.legal-app-info{display:flex;align-items:center;gap:14px;padding:16px 0;margin-bottom:36px;border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft)}
.legal-app-icon{width:44px;height:44px;border-radius:12px;object-fit:cover;background:#fff;box-shadow:0 6px 16px rgba(154,123,46,.22)}
.legal-app-name{font-family:var(--font-display);font-weight:700;font-size:1rem;letter-spacing:-.02em;color:var(--ink)}
.legal-app-by{font-size:.78rem;font-weight:600;color:var(--muted);letter-spacing:.06em;text-transform:uppercase;margin-top:2px}
.legal-content p{color:var(--body);font-size:1rem;line-height:1.82;margin:0 0 18px}
.legal-content>p:first-of-type{font-size:1.05rem;color:var(--ink-2);line-height:1.75;font-weight:500}
.legal-content h2{font-family:var(--font-display);font-size:clamp(1.3rem,2.4vw,1.62rem);font-weight:700;letter-spacing:-.02em;color:var(--ink);margin:48px 0 16px;padding-top:28px;border-top:1px solid var(--line-soft)}
.legal-content h2::after{content:"";display:block;width:40px;height:2px;border-radius:2px;background:var(--gold);margin-top:12px;opacity:.65}
.legal-content strong{color:var(--ink);font-weight:700}
.legal-content a{color:var(--gold-deep);font-weight:600;text-decoration:underline;text-decoration-color:rgba(111,83,32,.35);text-underline-offset:3px;transition:color .2s ease,text-decoration-color .2s ease}
.legal-content a:hover{color:var(--ink);text-decoration-color:var(--ink)}
.legal-content ul{list-style:none;margin:0 0 20px;padding:0;display:flex;flex-direction:column;gap:12px}
.legal-content li{position:relative;padding-left:26px;color:var(--body);line-height:1.78}
.legal-content li::before{content:"—";position:absolute;left:0;top:.05em;color:var(--gold-deep);font-weight:700}
.legal-content p:last-child{margin-bottom:0}
.legal-content .legal-footnote{margin:48px 0 0;padding-top:20px;border-top:1px solid var(--line-soft);font-size:.86rem;line-height:1.72;color:var(--muted)}

/* ── Footer ── */
.footer{background:var(--espresso);color:rgba(244,237,220,.72);padding:64px 0 26px}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:32px;padding-bottom:40px;border-bottom:1px solid rgba(233,217,168,.14)}
.footer-logo-link{display:inline-flex;align-items:center;gap:10px;margin-bottom:12px}
.footer-logo{width:40px;height:40px;border-radius:12px;object-fit:cover;box-shadow:0 6px 18px rgba(154,123,46,.3)}
.footer-brand-name{font-family:var(--font-display);font-weight:700;color:#fdf6e4;font-size:1.1rem}
.footer-brand-name .brand-pro{background:var(--grad-champagne);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.footer-description{font-size:.88rem;color:rgba(244,237,220,.55);max-width:280px;margin-bottom:12px}
.footer-links-group h4{font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:#f4eddc;margin-bottom:14px}
.footer-links-group ul{list-style:none;display:flex;flex-direction:column;gap:10px}
.footer-links-group a{font-size:.88rem;color:rgba(244,237,220,.55);transition:color .2s ease}
.footer-links-group a:hover{color:#e9d9a8;text-decoration:underline;text-underline-offset:3px}
.footer-bottom{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-top:22px;font-size:.83rem;color:rgba(244,237,220,.4);border-top:1px solid rgba(233,217,168,.14)}
.footer-bottom a{transition:color .2s ease}
.footer-bottom a:hover{color:#e9d9a8}
.footer-bottom-links{display:flex;gap:10px;align-items:center}
.footer-dot{opacity:.5}

/* ── Responsive ── */
@media(max-width:860px){
  .legal-page{padding-top:48px}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:520px){
  .container{width:min(1220px,100% - 28px)}
  .legal-container{width:min(var(--legal-max),100% - 28px)}
  .legal-content{padding:24px 20px;border-radius:var(--r-lg)}
  .legal-app-info{flex-direction:column;align-items:flex-start}
  .footer-grid{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}
