/* ────────────────────────────────────────────────────────────
   Phenom Services — Legal & FAQ stylesheet
   Shared by terms.html, privacy.html, cancellation.html, faq.html
   ──────────────────────────────────────────────────────────── */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
  --gold:#A67D44;
  --gold-l:#B8915C;
  --gold-d:#7D5E33;
  --bg:#FAF7F1;
  --bg2:#F4F0E9;
  --ink:#232A38;
  --text:#1C1714;
  --text2:rgba(28,23,20,.72);
  --text3:rgba(28,23,20,.5);
  --border:rgba(140,100,40,.16);
  --border2:rgba(140,100,40,.34);
  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'Inter',system-ui,sans-serif;
}
html{scroll-behavior:smooth;font-size:16px}
body{background:#fff;color:var(--text);font-family:var(--sans);font-weight:300;line-height:1.7}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}

/* ─── Top nav ─── */
.doc-nav{
  position:sticky;top:0;z-index:100;
  background:rgba(255,255,255,.96);backdrop-filter:blur(20px);
  border-bottom:1px solid var(--border);
  display:flex;align-items:center;justify-content:space-between;
  padding:1rem 3rem;
}
.doc-nav-logo{
  font-family:var(--sans);font-weight:300;
  letter-spacing:.32em;font-size:1rem;color:var(--text);
}
.doc-nav-logo span{display:block;font-size:.5rem;letter-spacing:.42em;color:var(--text3);margin-top:.15rem}
.doc-nav-links{display:flex;gap:2rem;list-style:none}
.doc-nav-links a{
  font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--text2);transition:color .2s;
}
.doc-nav-links a:hover{color:var(--gold)}
.doc-nav-cta{
  background:var(--ink);color:#fff;
  padding:.7rem 1.6rem;border-radius:999px;
  font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;
  transition:background .2s;
}
.doc-nav-cta:hover{background:var(--gold)}
@media(max-width:820px){
  .doc-nav{padding:1rem 1.2rem}
  .doc-nav-links{display:none}
}

/* ─── Hero header ─── */
.doc-hero{
  background:var(--ink);color:#fff;
  padding:4.5rem 2rem 3rem;text-align:center;
}
.doc-hero .eyebrow{
  display:inline-block;
  font-size:.6rem;letter-spacing:.34em;text-transform:uppercase;
  color:var(--gold);font-weight:600;margin-bottom:1.2rem;
}
.doc-hero h1{
  font-family:var(--serif);font-weight:400;
  font-size:clamp(2.2rem,5vw,3.4rem);line-height:1.1;
  letter-spacing:.01em;color:#fff;
}
.doc-hero .updated{
  margin-top:1.1rem;font-size:.74rem;letter-spacing:.06em;
  color:rgba(255,255,255,.55);
}

/* ─── Cross-page tabs ─── */
.doc-tabs{
  position:sticky;top:60px;z-index:90;
  background:var(--bg);border-bottom:1px solid var(--border);
  display:flex;justify-content:center;flex-wrap:wrap;gap:.4rem;
  padding:.7rem 1rem;
}
.doc-tabs a{
  font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--text2);font-weight:500;
  padding:.5rem 1.1rem;border-radius:999px;transition:all .2s;
}
.doc-tabs a:hover{color:var(--gold)}
.doc-tabs a.active{background:var(--ink);color:#fff}

/* ─── Document body ─── */
.doc-wrap{
  max-width:780px;margin:0 auto;
  padding:3.5rem 2rem 4rem;
}
.doc-intro{
  font-size:1.16rem;line-height:1.7;color:var(--text2);
  padding-bottom:2rem;margin-bottom:2.5rem;
  border-bottom:1px solid var(--border);
}
.doc-wrap h2{
  font-family:var(--sans);font-size:1.4rem;font-weight:700;
  color:var(--text);letter-spacing:.01em;
  margin:2.8rem 0 1rem;line-height:1.25;
  display:flex;align-items:baseline;gap:.7rem;
}
.doc-wrap h2 .n{
  font-family:var(--serif);font-style:italic;font-weight:400;
  font-size:1.15rem;color:var(--gold);
}
.doc-wrap h3{
  font-family:var(--sans);font-size:1.04rem;font-weight:600;
  color:var(--text);margin:1.8rem 0 .6rem;
}
.doc-wrap p{margin-bottom:1.1rem;color:var(--text)}
.doc-wrap ul,.doc-wrap ol{margin:0 0 1.3rem 1.4rem}
.doc-wrap li{margin-bottom:.5rem}
.doc-wrap a.inline{color:var(--gold-d);border-bottom:1px solid var(--border2)}
.doc-wrap a.inline:hover{border-bottom-color:var(--gold)}
.doc-wrap strong{font-weight:600;color:var(--text)}
.muted{color:var(--text3)}

/* ─── Callout ─── */
.doc-callout{
  background:var(--bg);border-left:3px solid var(--gold);
  padding:1.3rem 1.5rem;margin:1.8rem 0;
  font-size:.95rem;line-height:1.65;
}
.doc-callout .label{
  display:block;font-size:.58rem;letter-spacing:.26em;text-transform:uppercase;
  color:var(--gold);font-weight:700;margin-bottom:.5rem;
}

/* ─── Tables (cancellation tiers etc.) ─── */
.doc-table{
  width:100%;border-collapse:collapse;margin:1.4rem 0 2rem;
  font-size:.92rem;
}
.doc-table th,.doc-table td{
  text-align:left;padding:.85rem 1rem;
  border-bottom:1px solid var(--border);vertical-align:top;
}
.doc-table thead th{
  background:var(--bg2);
  font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--text2);font-weight:600;
}
.doc-table td:last-child{font-weight:500}
.doc-table .free{color:#2C7A4B;font-weight:600}
.doc-table .full{color:#B0322B;font-weight:600}

/* ─── FAQ accordion (native details/summary, no JS) ─── */
.faq-group-title{
  font-family:var(--sans);font-size:.72rem;letter-spacing:.24em;
  text-transform:uppercase;color:var(--gold);font-weight:700;
  margin:2.6rem 0 1rem;
}
.faq-item{
  border-bottom:1px solid var(--border);
}
.faq-item summary{
  list-style:none;cursor:pointer;
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:1.2rem .2rem;
  font-family:var(--sans);font-size:1.04rem;font-weight:500;color:var(--text);
  transition:color .2s;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:hover{color:var(--gold-d)}
.faq-item summary .plus{
  flex-shrink:0;width:24px;height:24px;position:relative;transition:transform .3s;
}
.faq-item summary .plus::before,
.faq-item summary .plus::after{
  content:'';position:absolute;background:var(--gold);
  top:50%;left:50%;transform:translate(-50%,-50%);
}
.faq-item summary .plus::before{width:13px;height:1.5px}
.faq-item summary .plus::after{width:1.5px;height:13px;transition:transform .3s}
.faq-item[open] summary .plus::after{transform:translate(-50%,-50%) scaleY(0)}
.faq-item .faq-a{
  padding:0 .2rem 1.4rem;
  font-size:.96rem;line-height:1.7;color:var(--text2);
}
.faq-item .faq-a p{margin-bottom:.8rem}
.faq-item .faq-a a{color:var(--gold-d);border-bottom:1px solid var(--border2)}

/* ─── Back-to-top / contact strip ─── */
.doc-contact{
  background:var(--bg);text-align:center;
  padding:3rem 2rem;border-top:1px solid var(--border);
}
.doc-contact h3{
  font-family:var(--serif);font-weight:400;font-size:1.7rem;
  color:var(--text);margin-bottom:.6rem;
}
.doc-contact p{color:var(--text2);font-size:.95rem;margin-bottom:1.4rem}
.doc-contact a.btn{
  display:inline-block;background:var(--gold);color:#fff;
  padding:.95rem 2.2rem;border-radius:999px;
  font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;font-weight:500;
  transition:background .2s;
}
.doc-contact a.btn:hover{background:var(--gold-d)}

/* ─── Footer ─── */
.doc-footer{
  background:var(--ink);color:rgba(255,255,255,.5);
  padding:3rem 2rem;text-align:center;
  font-size:.78rem;letter-spacing:.04em;
}
.doc-footer a{color:rgba(255,255,255,.75)}
.doc-footer a:hover{color:var(--gold)}
.doc-footer-links{margin-bottom:1rem}
.doc-footer-links a{margin:0 1rem}
.doc-footer .fine{margin-top:1rem;font-size:.7rem;opacity:.5}