/* ======================================================================
   HOTLINE DISTRICT site theme (October 2026)
   Loaded after styles.css on the service and legal pages so they match
   the homepage: a black storefront with warm paper, Exo 2 italic display
   type, hairline rules and square buttons. Light mode follows the device.
   "body:not(#_)" raises specificity over the older rules.
   ====================================================================== */

:root{
  --black:#0B0A0C;
  --black-2:#131115;
  --ink:#F4F0EA;
  --ink-2:#A8A29A;
  --ink-3:#86817B;
  --line:rgba(244,240,234,.14);
  --pink:#E04AB8;
  --violet:#A634D1;
  --btn-line:rgba(244,240,234,.45);
  --hover-wash:rgba(244,240,234,.06);
  --hdr-bg:rgba(11,10,12,.9);
  --display:"Exo 2","Arial Narrow",Arial,sans-serif;
  --sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --ease-hd:cubic-bezier(.22,.75,.2,1);

  /* the older stylesheet's tokens */
  --page-bg:#0B0A0C;
  --text-color:#F4F0EA;
  --text:#F4F0EA;
  --text-muted:#A8A29A;
  --border-color:rgba(244,240,234,.14);
  --card-bg:transparent;
  --card-bg-2:transparent;
  --surface:transparent;
  --surface-2:transparent;
  --surface-border:rgba(244,240,234,.14);
  --primary-color:#E04AB8;
  --accent-color:#E04AB8;
  --shadow-soft:none;
  --shadow-pop:none;
  --bg-image-opacity:0;
  --font-display:"Exo 2","Arial Narrow",Arial,sans-serif;
  --font-body:"Inter",system-ui,sans-serif;
  color-scheme:dark;
}
@media (prefers-color-scheme: light){
  :root{
    --black:#F4F0EA;
    --black-2:#FFFFFF;
    --ink:#121013;
    --ink-2:#55504A;
    --ink-3:#69635D;
    --line:rgba(18,16,19,.14);
    --btn-line:rgba(18,16,19,.35);
    --hover-wash:rgba(18,16,19,.05);
    --hdr-bg:rgba(244,240,234,.92);
    --page-bg:#F4F0EA;
    --text-color:#121013;
    --text:#121013;
    --text-muted:#55504A;
    --border-color:rgba(18,16,19,.14);
    --surface-border:rgba(18,16,19,.14);
    --primary-color:#B0208F;
    --accent-color:#B0208F;
    color-scheme:light;
  }
}

/* ---------- canvas ---------- */
html{background:var(--black)}
body:not(#_){background:var(--black) !important;color:var(--ink);font-family:var(--sans);padding-top:0 !important;-webkit-font-smoothing:antialiased}
body:not(#_)::before,
body:not(#_)::after{content:none !important;display:none !important}
body:not(#_) .background-wrapper{background:none !important}
body:not(#_) .background-wrapper .overlay{display:none !important}

/* ======================================================================
   HEADER (same as the homepage)
   ====================================================================== */
body:not(#_) .hdh{position:sticky;top:0;z-index:1000;background:var(--hdr-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);margin:0;padding:0;box-shadow:none}
body:not(#_) .hdh-in{max-width:1320px;margin:0 auto;height:76px;display:flex;align-items:center;gap:2rem;padding:0 max(clamp(20px,4vw,48px),env(safe-area-inset-right,0px)) 0 max(clamp(20px,4vw,48px),env(safe-area-inset-left,0px))}
body:not(#_) .hdh-brand{flex:none;display:block;line-height:0}
body:not(#_) .hdh-brand img{height:34px;width:auto;max-width:none;margin:0}
body:not(#_) .hdh-nav{display:flex;gap:2rem;margin:0 0 0 auto;padding:0}
body:not(#_) .hdh-nav a{position:relative;padding:.4rem 0;font:500 .97rem/1 var(--sans);color:var(--ink-2);text-decoration:none;transition:color .2s;background:none;border:0}
body:not(#_) .hdh-nav a::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--pink);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease-hd)}
body:not(#_) .hdh-nav a:hover,body:not(#_) .hdh-nav a[aria-current="page"]{color:var(--ink)}
body:not(#_) .hdh-nav a:hover::after,body:not(#_) .hdh-nav a[aria-current="page"]::after{transform:scaleX(1)}
body:not(#_) .hdh-btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;min-height:42px;padding:0 1.1rem;border:1.5px solid var(--btn-line);font:600 .94rem/1 var(--sans);color:var(--ink);background:transparent;text-decoration:none;white-space:nowrap;border-radius:0;transition:background .2s,border-color .2s}
body:not(#_) .hdh-btn:hover{border-color:var(--ink);background:var(--hover-wash);color:var(--ink)}
body:not(#_) .hdh-menu{display:none;margin-left:auto;width:46px;height:46px;border:1.5px solid var(--btn-line);background:transparent;color:var(--ink);cursor:pointer;place-items:center;border-radius:0;padding:0}
body:not(#_) .hdh-menu svg{width:22px;height:22px}
body:not(#_) .hdm[hidden]{display:none !important}
body:not(#_) .hdm{position:fixed;inset:0;z-index:1100;display:flex;flex-direction:column;background:var(--black);overflow-y:auto;padding:0 max(20px,env(safe-area-inset-right,0px)) max(28px,env(safe-area-inset-bottom,0px)) max(20px,env(safe-area-inset-left,0px));color:var(--ink)}
body:not(#_) .hdm-top{height:66px;display:flex;align-items:center;justify-content:space-between}
body:not(#_) .hdm-top img{height:30px;width:auto}
body:not(#_) .hdm-links{display:grid;margin-top:1rem}
body:not(#_) .hdm-links a{display:block;padding:.85rem 0;border-bottom:1px solid var(--line);font:italic 800 2rem/1 var(--display);text-transform:uppercase;text-decoration:none;color:var(--ink)}
body:not(#_) .hdm .hdx-solid{margin-top:2rem;width:100%}
@media (max-width:900px){
  body:not(#_) .hdh-in{height:66px}
  body:not(#_) .hdh-nav,body:not(#_) .hdh-btn{display:none}
  body:not(#_) .hdh-menu{display:inline-grid}
  body:not(#_) .hdh-brand img{height:30px}
}

/* square buttons */
body:not(#_) .hdx-solid,
body:not(#_) .cta-button{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;min-height:52px;padding:0 1.6rem;border:1.5px solid var(--ink) !important;border-radius:0 !important;background:var(--ink) !important;background-image:none !important;color:var(--black) !important;font:600 1rem/1 var(--sans) !important;text-decoration:none;box-shadow:none !important;transition:background .2s,color .2s,border-color .2s}
body:not(#_) .hdx-solid:hover,
body:not(#_) .cta-button:hover{background:var(--pink) !important;border-color:var(--pink) !important;color:#fff !important;transform:none}

/* ======================================================================
   FOOTER (same as the homepage)
   ====================================================================== */
body:not(#_) .hdf{padding:2.5rem 0 2rem;border-top:1px solid var(--line);color:var(--ink-3);font:400 .86rem/1.5 var(--sans);background:var(--black);margin:0;text-align:left}
body:not(#_) .hdf-in{max-width:1320px;margin:0 auto;padding:0 max(clamp(20px,4vw,48px),env(safe-area-inset-right,0px)) 0 max(clamp(20px,4vw,48px),env(safe-area-inset-left,0px))}
body:not(#_) .hdf-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.5rem}
body:not(#_) .hdf-top img{height:28px;width:auto;opacity:.9}
body:not(#_) .hdf-nav{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem}
body:not(#_) .hdf a{color:var(--ink-2);text-decoration:none}
body:not(#_) .hdf a:hover{color:var(--ink)}
body:not(#_) .hdf-links{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.75rem}
body:not(#_) .hdf-social{display:flex;gap:.5rem;padding-left:1.75rem;border-left:1px solid var(--line)}
body:not(#_) .hdf .hdf-social a{display:grid;place-items:center;width:40px;height:40px;padding:0;border:1px solid var(--line);color:var(--ink-2);background:none;transition:color .2s, border-color .2s, background-color .2s}
body:not(#_) .hdf .hdf-social a:hover{color:var(--ink);border-color:var(--ink-2);background:var(--hover-wash)}
body:not(#_) .hdf-social svg{width:18px;height:18px;display:block}
@media (max-width: 640px){body:not(#_) .hdf-social{padding-left:0;border-left:0}}
body:not(#_) .hdf-bot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.35rem 1.5rem;margin-top:2rem;padding-top:1.1rem;border-top:1px solid var(--line);font-size:.66rem;line-height:1.5;letter-spacing:.02em}
body:not(#_) .hdf-bot .hdf-nav{gap:.3rem 1rem}
body:not(#_) .hdf .hdf-bot a{color:var(--ink-3)}
body:not(#_) .hdf .hdf-bot a:hover{color:var(--ink-2)}
body:not(#_) .hdf-tm{margin:.6rem 0 0;font-size:.6rem;line-height:1.5;letter-spacing:.01em;max-width:68em;color:var(--ink-3)}
body:not(#_) #back-to-top{display:none !important}

/* ======================================================================
   PAGE CONTENT (older templates, re-skinned)
   ====================================================================== */
body:not(#_) main#main{max-width:1100px;margin:0 auto;padding:clamp(2.5rem,5vw,4rem) max(clamp(20px,4vw,48px),env(safe-area-inset-right,0px)) clamp(3rem,6vw,5rem) max(clamp(20px,4vw,48px),env(safe-area-inset-left,0px));background:none !important;border:0 !important;box-shadow:none !important;border-radius:0 !important;color:var(--ink);text-align:left}

/* display type */
body:not(#_) main#main h1{font:italic 900 clamp(2.75rem,7vw,5.75rem)/.88 var(--display) !important;text-transform:uppercase;letter-spacing:-.01em;color:var(--ink) !important;text-align:left !important;margin:1.5rem 0 1.25rem !important;background:none !important;-webkit-text-fill-color:currentColor !important;text-wrap:balance}
body:not(#_) main#main h2{font:italic 800 clamp(1.75rem,3.6vw,2.75rem)/.95 var(--display) !important;text-transform:uppercase;letter-spacing:-.005em;color:var(--ink) !important;text-align:left !important;background:none !important;-webkit-text-fill-color:currentColor !important;border:0 !important;padding:0 !important}
body:not(#_) main#main h2::before,
body:not(#_) main#main h2::after{content:none !important;display:none !important}
body:not(#_) main#main h3{font:italic 800 1.35rem/1 var(--display) !important;text-transform:uppercase;color:var(--ink) !important;text-align:left !important}
body:not(#_) main#main p,
body:not(#_) main#main li{color:var(--ink-2)}
body:not(#_) main#main strong{color:var(--ink)}
body:not(#_) main#main a:not(.cta-button):not(.back-link):not(.legal-back){color:var(--ink);text-decoration:underline;text-decoration-color:var(--pink);text-underline-offset:3px}
body:not(#_) main#main a:not(.cta-button):not(.back-link):not(.legal-back):hover{color:var(--pink)}

/* back links */
body:not(#_) .back-link,
body:not(#_) .legal-back{display:inline-flex;align-items:center;gap:.5rem;color:var(--ink-2) !important;font:500 .95rem var(--sans) !important;text-decoration:none !important;background:none !important;border:0 !important;padding:0 !important;box-shadow:none !important}
body:not(#_) .back-link:hover,
body:not(#_) .legal-back:hover{color:var(--ink) !important}

/* lead text and notes */
body:not(#_) .page-subtitle{font-size:clamp(1.05rem,1.4vw,1.2rem) !important;color:var(--ink-2) !important;max-width:40em;text-align:left !important;margin:0 0 2rem !important}
body:not(#_) .intro-card{background:none !important;border:0 !important;border-left:3px solid var(--pink) !important;border-radius:0 !important;box-shadow:none !important;padding:.25rem 0 .25rem 1.25rem !important;margin:0 0 1.5rem !important;text-align:left !important}
body:not(#_) .intro-card p{color:var(--ink) !important;font-size:1.1rem}
body:not(#_) .service-area,
body:not(#_) .pricing-note,
body:not(#_) .legal-meta{color:var(--ink-3) !important;text-align:left !important}

/* sections become ruled bands instead of rounded cards */
body:not(#_) .services-section,
body:not(#_) .cta-section{background:none !important;background-image:none !important;border:0 !important;border-top:1px solid var(--line) !important;border-radius:0 !important;box-shadow:none !important;padding:clamp(2rem,4vw,3rem) 0 0 !important;margin:clamp(2.5rem,5vw,3.5rem) 0 0 !important;text-align:left !important}
body:not(#_) .services-section > p,
body:not(#_) .cta-section > p{text-align:left !important;max-width:40em;margin-left:0 !important}

/* service cards: flat cells divided by hairlines */
body:not(#_) .services-grid-page{gap:0 !important;border-top:1px solid var(--line);margin-top:1.75rem !important}
body:not(#_) .service-card-page{background:none !important;background-image:none !important;border:0 !important;border-bottom:1px solid var(--line) !important;border-radius:0 !important;box-shadow:none !important;padding:1.75rem 1.5rem 1.75rem 0 !important;text-align:left !important;align-items:flex-start !important}
body:not(#_) .service-card-page + .service-card-page{padding-left:1.5rem !important;border-left:1px solid var(--line) !important}
body:not(#_) .service-card-page:hover{transform:none !important;box-shadow:none !important}
body:not(#_) .icon-box{width:44px !important;height:44px !important;background:none !important;border:0 !important;border-radius:0 !important;box-shadow:none !important;color:var(--pink) !important;margin:0 0 1rem !important;padding:0 !important}
body:not(#_) .icon-box svg{width:44px !important;height:44px !important}
body:not(#_) .service-price{font:600 1rem var(--sans) !important;color:var(--ink) !important;text-align:left !important;margin:.5rem 0 .75rem !important}
body:not(#_) .card-note{color:var(--ink-3) !important;text-align:left !important;font-size:.92rem !important}
body:not(#_) .format-chips{justify-content:flex-start !important}
body:not(#_) .chip{border-radius:0 !important;background:none !important;border:1px solid var(--line) !important;color:var(--ink-2) !important;font:500 .75rem/1 var(--sans) !important;letter-spacing:.04em !important;text-transform:none !important;padding:.4rem .55rem !important;box-shadow:none !important}
body:not(#_) .chip--primary{color:var(--ink) !important;border-color:var(--btn-line) !important}

/* calls to action and cross-links */
body:not(#_) .cta-section h2{margin-bottom:.75rem !important}
body:not(#_) .other-services{background:none !important;border:0 !important;border-top:1px solid var(--line) !important;border-radius:0 !important;box-shadow:none !important;padding:1.5rem 0 0 !important;margin-top:2.5rem !important;text-align:left !important}
body:not(#_) .divider,
body:not(#_) hr{border:0 !important;height:1px !important;background:var(--line) !important;box-shadow:none !important}

/* legal pages: a reading column with smaller headings */
body:not(#_) main#main.legal-page{max-width:820px}
body:not(#_) main#main.legal-page h2{font-size:clamp(1.35rem,2.4vw,1.85rem) !important;margin:2.75rem 0 .9rem !important}
body:not(#_) main#main.legal-page h3{font:600 1rem/1.3 var(--sans) !important;text-transform:none;letter-spacing:0;margin:1.5rem 0 .5rem !important}
body:not(#_) main#main.legal-page p,
body:not(#_) main#main.legal-page li{font-size:1rem;line-height:1.65}

/* proof numbers on the publishing page */
body:not(#_) .proof-grid{gap:0 !important;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:1.5rem !important}
body:not(#_) .proof-item{background:none !important;border:0 !important;border-radius:0 !important;box-shadow:none !important;padding:1.4rem 1rem 1.4rem 0 !important;text-align:left !important}
body:not(#_) .proof-item + .proof-item{border-left:1px solid var(--line) !important;padding-left:1.25rem !important}
body:not(#_) .proof-number{font:italic 900 clamp(2.5rem,5vw,3.75rem)/.9 var(--display) !important;color:var(--ink) !important;background:none !important;-webkit-text-fill-color:currentColor !important}
body:not(#_) .proof-label{color:var(--ink-2) !important;font:500 .85rem var(--sans) !important;letter-spacing:.02em !important;text-transform:none !important}
body:not(#_) .service-starts{color:var(--ink-2) !important;text-align:left !important}

/* stats on the publishing page */
body:not(#_) .stat-number,
body:not(#_) .snapshot-number{font:italic 900 clamp(2.5rem,5vw,3.75rem)/.9 var(--display) !important;color:var(--ink) !important;background:none !important;-webkit-text-fill-color:currentColor !important}

@media (max-width:760px){
  body:not(#_) .service-card-page,
  body:not(#_) .service-card-page + .service-card-page{padding:1.5rem 0 !important;border-left:0 !important}
  body:not(#_) .proof-item,
  body:not(#_) .proof-item + .proof-item{padding:1.1rem .5rem 1.1rem 0 !important}
}