/* ==========================================================
   The Serenity Collections — Base styles
   Shared across index.html, trade-partners.html, media.html
   ========================================================== */

:root{
    --charcoal: #201e1c;
    --charcoal-2: #2a2723;
    --charcoal-soft: #34302b;
    --cream: #fdfcfa;
    --ink: #2b2926;
    --ink-soft: #6b6560;
    --gold: #b6935f;
    --gold-light: #d3b487;
    --gold-dim: rgba(182,147,95,0.35);
    --line: rgba(255,255,255,0.16);
    --line-dark: rgba(43,41,38,0.14);
  }

  *{ margin:0; padding:0; box-sizing:border-box; }

  html{ scroll-behavior:smooth; }

  body{
    font-family:'Jost', sans-serif;
    background:var(--cream);
    color:var(--ink);
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }

  a{ color:inherit; text-decoration:none; }

  .serif{ font-family:'Cormorant Garamond', serif; }

  .eyebrow{
    font-family:'Jost', sans-serif;
    text-transform:uppercase;
    letter-spacing:0.28em;
    font-size:0.72rem;
    font-weight:500;
  }

  .container{
    width:100%;
    max-width:1180px;
    margin:0 auto;
    padding:0 6vw;
  }

/* -------------------- LOGO MARK -------------------- */
  .brand-logo{
    display:block;
    height:60px;
    width:auto;
  }
  .foot-logo{ height:52px; margin-bottom:0.9rem; }

/* -------------------- CONSENT CHECKBOX -------------------- */
  .field.consent-field{
    display:flex;
    flex-direction:row;
    align-items:flex-start;
    gap:0.8rem;
    margin-top:2.2rem;
    text-align:left;
    position:relative;
  }
  .consent-checkbox-wrap{
    position:relative;
    width:18px;
    height:18px;
    flex-shrink:0;
    margin-top:0.15rem;
  }
  .consent-checkbox-wrap input[type="checkbox"]{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    margin:0;
    opacity:0;
    cursor:pointer;
    z-index:2;
  }
  .consent-box{
    position:absolute;
    inset:0;
    border:1px solid rgba(255,255,255,0.4);
    border-radius:0;
    transition:border-color .3s ease;
    pointer-events:none;
  }
  .consent-box svg{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    opacity:0;
    transform:scale(0.6);
    transition:opacity .2s ease, transform .2s ease;
  }
  .consent-box svg path{
    fill:none;
    stroke:var(--gold);
    stroke-width:2;
    stroke-linecap:round;
    stroke-linejoin:round;
  }
  input[type="checkbox"]:checked ~ .consent-box{
    border-color:var(--gold);
  }
  input[type="checkbox"]:checked ~ .consent-box svg{
    opacity:1;
    transform:scale(1);
  }
  input[type="checkbox"]:focus-visible ~ .consent-box{
    border-color:var(--gold);
    box-shadow:0 0 0 2px rgba(182,147,95,0.25);
  }
  .consent-field label{
    font-size:0.8rem;
    line-height:1.55;
    color:rgba(255,255,255,0.62);
    font-weight:300;
    cursor:pointer;
  }
  .consent-field.invalid .consent-box{
    border-color:var(--gold);
  }
  .consent-field .field-tooltip{
    top:100%;
    left:28px;
    margin-top:6px;
  }
  .submit-msg{
    display:none;
    text-align:center;
    font-family:'Cormorant Garamond', serif;
    font-size:1.2rem;
    color:var(--gold-light);
    margin-top:1.6rem;

  }
  .submit-error{
    display:none;
    text-align:center;
    font-family:'Jost', sans-serif;
    font-size:0.85rem;
    color:#d98c6b;
    margin-top:1.6rem;
  }
  #submitBtn:disabled{
    opacity:0.55;
    cursor:default;
  }
  #submitBtn:disabled:hover{
    background:var(--gold);
    color:#221d15;
  }

/* -------------------- REVEAL -------------------- */
  .reveal{
    opacity:0;
    transform:translateY(18px);
    transition:opacity .9s ease, transform .9s ease;
  }
  .reveal.in{ opacity:1; transform:translateY(0); }

/* -------------------- RESPONSIVE -------------------- */
  @media (max-width:640px){
    .grid-2{ grid-template-columns:1fr; }
    .foot-top{ flex-direction:column; }
    .nav-cta{ padding:0.5rem 1rem; }
    .hero h1{ font-size:2.4rem; }
  }

  @media (prefers-reduced-motion: reduce){
    html{ scroll-behavior:auto; }
    .reveal{ opacity:1; transform:none; transition:none; }
    .scroll-cue .line{ animation:none; }
  }

/* -------------------- FOOTER -------------------- */
  footer{
    background:#000;
    color:rgba(255,255,255,0.85);
    padding:4.5rem 0 1.8rem;
  }
  .foot-grid{
    display:grid;
    grid-template-columns:1.4fr 1fr 1fr;
    gap:2.5rem;
    padding-bottom:2.8rem;
  }
  .foot-brand{ max-width:360px; }
  .foot-brand .brand-logo{ height:44px; margin-bottom:1.5rem; }
  .foot-lede{
    font-family:'Cormorant Garamond', serif;
    font-size:1.2rem;
    color:#fff;
    font-weight:400;
    margin-bottom:0.5rem;
  }
  .foot-sub{
    font-size:0.85rem;
    line-height:1.6;
    color:rgba(255,255,255,0.5);
    font-weight:300;
    margin-bottom:1.7rem;
    max-width:320px;
  }
  .foot-divider{
    width:32px;
    height:1px;
    background:rgba(255,255,255,0.25);
    margin-bottom:1.1rem;
  }
  .foot-property{
    font-size:0.78rem;
    letter-spacing:0.16em;
    text-transform:uppercase;
    color:rgba(255,255,255,0.85);
    margin-bottom:0.3rem;
  }
  .foot-property-sub{
    font-size:0.64rem;
    letter-spacing:0.16em;
    text-transform:uppercase;
    color:rgba(255,255,255,0.4);
  }

  .foot-col{
    position:relative;
    padding-left:2.5rem;
  }
  .foot-col::before{
    content:"";
    position:absolute;
    left:0; top:0.2rem; bottom:0.2rem;
    width:1px;
    background:rgba(255,255,255,0.14);
  }
  .foot-col .eyebrow{ color:rgba(255,255,255,0.45); margin-bottom:1.1rem; }
  .foot-col a{
    display:flex;
    align-items:center;
    gap:0.6rem;
    font-size:0.9rem;
    font-weight:300;
    color:rgba(255,255,255,0.78);
    padding:0.32rem 0;
    transition:color .25s ease;
  }
  .foot-col a:hover{ color:var(--gold-light); }
  .foot-follow a svg{
    width:16px;
    height:16px;
    flex-shrink:0;
    fill:currentColor;
  }

  .foot-bottom{
    border-top:1px solid rgba(255,255,255,0.1);
    padding-top:1.6rem;
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;
    gap:1rem;
  }
  .foot-legal{ display:flex; align-items:center; gap:0.7rem; }
  .foot-legal a{
    font-size:0.78rem;
    color:rgba(255,255,255,0.5);
    font-weight:300;
    transition:color .25s ease;
  }
  .foot-legal a:hover{ color:var(--gold-light); }
  .foot-legal span{ color:rgba(255,255,255,0.25); font-size:0.7rem; }
  .copyright{ font-size:0.78rem; color:rgba(255,255,255,0.42); font-weight:300; }

  @media (max-width:820px){
    .foot-grid{ grid-template-columns:1fr; gap:2.8rem; }
    .foot-col{ padding-left:0; }
    .foot-col::before{ display:none; }
  }


  .foot-contact{ margin-top:1.4rem; display:flex; flex-direction:column; gap:0.2rem; }
  .foot-contact a{
    font-size:0.85rem;
    font-weight:300;
    color:rgba(255,255,255,0.78);
    transition:color .25s ease;
  }
  .foot-contact a:hover{ color:var(--gold-light); }