/*
  LEIAH SYFER — CUSTOM STRONGLY TYPED AUTHOR REDESIGN
  -----------------------------------------------------
  BEGINNER TIP: EDIT THE COLOR VARIABLES JUST BELOW to change the whole site.
  Uses the same folder structure as the HTML5 UP Strongly Typed template.
  Original template credit: https://html5up.net/strongly-typed (CC BY 3.0)
*/
:root {
  --night: #08071d;       /* Deep navy from book cover */
  --night-deep: #050411;
  --night-panel: #10102b;
  --night-soft: #191434;
  --pink: #ff2b91;        /* Neon pink from cover */
  --pink-bright: #ff69b3;
  --cyan: #6dc7ff;        /* Electric blue cover accents */
  --violet: #8d58ff;
  --neon-violet: #b45cff; /* Bright Lights book heading and series name */
  --electric-blue: #42baff; /* Rowan synopsis highlight */
  --white: #fff7fc;
  --text: #dcd9ec;
  --muted: #aaa6c7;
  --line: rgba(180, 178, 221, .19);
  --font-body: 'DM Sans', Arial, sans-serif;
  --font-titles: 'Barlow Condensed', Impact, sans-serif;
  --font-editorial: 'Playfair Display', Georgia, serif;
  --font-script: 'Allura', cursive;
  --content-width: 1200px;
  --cover-display-width: 350px; /* Both cover images share exactly this size */
}

/* Global */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 94px; }
body { margin: 0; overflow-x: clip; background: var(--night); color: var(--text); font: 400 16px/1.7 var(--font-body); -webkit-font-smoothing: antialiased; }
body, input, textarea, button { font-family: var(--font-body); }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--cyan); }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible { outline: 2px solid var(--cyan); outline-offset: 3px; }
button { cursor: pointer; }
img { display: block; max-width: 100%; }
.shell { width: min(calc(100% - 64px), var(--content-width)); margin-inline: auto; }
::selection { background: var(--pink); color: #fff; }
.skip-link { position: fixed; top: -80px; left: 16px; background: var(--pink); color: #fff; z-index: 999; padding: 10px 16px; }
.skip-link:focus { top: 15px; }
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Small announcement bar and navigation */
.announcement-bar { min-height: 30px; display: flex; justify-content: center; align-items: center; gap: 14px; padding: 5px 14px; background: #19102e; color: #d8b9d7; text-align: center; letter-spacing: .27em; font: 600 11px/1.5 var(--font-titles); }
.announcement-bar span { color: var(--pink); font-size: 9px; }

/* Social icons: shared style for top strip and bottom footer, with glow on hover.
   Icons are stored locally in assets/icons for reliable rendering without a CDN. */
.social-links { display: flex; align-items: center; justify-content: center; gap: 12px; }
.social-link { width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid rgba(188, 147, 247, .34); border-radius: 50%; background: rgba(61, 29, 93, .22); text-decoration: none !important; line-height: 1; transition: background .2s ease, box-shadow .2s ease, border-color .2s ease, transform .2s ease; }
.social-link img { width: 17px; height: 17px; object-fit: contain; display: block; }
.social-link:hover, .social-link:focus-visible { background: rgba(180, 92, 255, .24); border-color: var(--neon-violet); box-shadow: 0 0 16px rgba(180, 92, 255, .5), inset 0 0 8px rgba(180, 92, 255, .2); transform: translateY(-2px); }
.announcement-bar .social-links-top { min-height: 39px; }
.announcement-bar { padding-block: 5px; }

.site-header { background: rgba(8,7,29,.95); border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 50; backdrop-filter: blur(15px); }
.header-inner { min-height: 88px; display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.wordmark { white-space: nowrap; display: inline-flex; align-items: center; gap: 7px; color: var(--white); font: 700 30px/1 var(--font-titles); letter-spacing: .085em; }
.wordmark span:first-child { color: var(--pink-bright); }
.wordmark .wordmark-star { position: relative; top: -10px; font-size: 13px; color: var(--cyan); }
.wordmark:hover { color: #fff; }
.main-nav { display: flex; align-items: center; gap: 17px; }
.main-nav > a { color: #e4deed; font: 600 13px/1.2 var(--font-body); transition: color .2s ease; }
.main-nav > a:hover { color: var(--pink-bright); }
.main-nav .nav-cta { border: 1px solid rgba(255, 97, 179, .68); border-radius: 3px; padding: 13px 19px; color: var(--white); }
.main-nav .nav-cta:hover { background: var(--pink); border-color: var(--pink); color: #fff; }
.menu-toggle { display: none; }

/* Decorative star field: purely CSS, no external stock assets */
.starfield { position: relative; isolation: isolate; overflow: hidden; }
.starfield::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: .6; background-image: radial-gradient(1px 1px at 8% 18%,#d9d8ff 80%,transparent),radial-gradient(1.3px 1.3px at 31% 11%,#ff8bbf 80%,transparent),radial-gradient(1px 1px at 56% 26%,#fff 80%,transparent),radial-gradient(1.3px 1.3px at 79% 15%,#d9d8ff 80%,transparent),radial-gradient(1.2px 1.2px at 94% 43%,#fff 80%,transparent),radial-gradient(1px 1px at 18% 74%,#fc91d1 80%,transparent),radial-gradient(1px 1px at 63% 78%,#a7ccff 80%,transparent),radial-gradient(1.5px 1.5px at 86% 82%,#d9d8ff 80%,transparent); background-size: 210px 230px, 277px 280px, 335px 300px, 260px 315px, 345px 267px, 250px 325px, 385px 285px, 295px 310px; }

/* Buttons and typography */
.eyebrow { display: flex; align-items: center; gap: 12px; margin: 0 0 20px; color: var(--cyan); font: 600 13px/1.2 var(--font-titles); letter-spacing: .3em; text-transform: uppercase; }
.eyebrow-line { width: 27px; height: 1px; background: var(--pink); }
.button-row { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 19px; min-height: 52px; padding: 14px 23px; font: 700 13px/1.2 var(--font-body); color: #fff; border-radius: 3px; border: 1px solid transparent; transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease; }
.button:hover { transform: translateY(-2px); color: #fff; }
.button-hot { background: var(--pink); border-color: var(--pink); box-shadow: 0 8px 30px rgba(255, 43, 145, .22); }
.button-hot:hover { background: #ff53a6; border-color: #ff53a6; box-shadow: 0 8px 36px rgba(255, 43, 145, .4); }
.button-outline { border-color: rgba(120,199,255,.65); background: rgba(12,18,48,.44); }
.button-outline:hover { background: rgba(109,199,255,.16); }
.button-full { width: 100%; }
.section { padding: 115px 0; }
.section-heading { margin-bottom: 55px; }
.section-heading.center { text-align: center; }
.section-heading.center .eyebrow { justify-content: center; }
.section-heading h2, .about-copy h2, .newsletter-copy h2, .contact-grid h2 { margin: 0; color: var(--white); font: 700 clamp(44px,5.4vw,78px)/.99 var(--font-titles); letter-spacing: -.01em; text-transform: uppercase; }
.section-heading h2 em, .about-copy h2 em, .newsletter-copy h2 em, .contact-grid h2 em { color: var(--pink-bright); font: italic 600 .9em/1.2 var(--font-editorial); text-transform: none; }
/* Only the “Bright Lights” words in the Books headline glow neon violet. */
.section-books .section-heading h2 em { color: var(--neon-violet); text-shadow: 0 0 13px rgba(180, 92, 255, .48), 0 0 34px rgba(148, 69, 255, .28); }
.section-heading > p:last-child { color: var(--muted); font-size: 16px; margin: 17px auto 0; }
.pink-text { color: var(--pink-bright); }
.small-note { color: var(--muted); font-size: 12px; line-height: 1.6; }

/* Homepage hero */
.hero { background: radial-gradient(ellipse at 72% 45%,rgba(78,33,117,.27), transparent 52%),linear-gradient(145deg,#09071f 12%,#08051f 55%,#0a071f 100%); min-height: 690px; }
.hero-layout { display: grid; grid-template-columns: 1.13fr .87fr; align-items: center; gap: 36px; min-height: 665px; padding-block: 70px 105px; position: relative; }
.hero-glow { position: absolute; z-index: -1; border-radius: 100%; filter: blur(90px); opacity: .6; pointer-events: none; }
.hero-glow-one { width: 270px; height: 270px; left: -100px; top: 170px; background: #461957; }
.hero-glow-two { width: 350px; height: 300px; right: 7%; bottom: 0; background: #2a2269; }
.hero-copy { position: relative; z-index: 1; }
.hero-copy h1 { color: #fff9fd; text-transform: uppercase; letter-spacing: -.018em; font: 700 clamp(75px,9vw,130px)/.78 var(--font-titles); margin: 22px 0 22px; }
.hero-copy .display-script { display: block; position: relative; z-index: 1; color: #ff8ac4; font: 400 clamp(83px,10vw,143px)/1.08 var(--font-script); text-transform: none; letter-spacing: -.01em; text-shadow: 0 0 18px rgba(255, 43, 145, .33); transform: rotate(-3deg); margin: 0 0 0 1px; }
.hero-lead { margin: 0 0 12px; color: var(--white); font: 600 24px/1.45 var(--font-editorial); }
.hero-description { color: #c4c0d5; max-width: 490px; margin: 0 0 28px; font-size: 15px; }
.hero-footnote { display: flex; align-items: center; gap: 11px; margin-top: 48px; color: #b9afd2; letter-spacing: .21em; font: 600 12px/1 var(--font-titles); }
.pulse-dot, .tag-dot { width: 8px; height: 8px; background: var(--pink); border-radius: 50%; box-shadow: 0 0 17px var(--pink); flex: 0 0 auto; }
.hero-art { position: relative; display: flex; justify-content: center; align-items: center; isolation: isolate; }
.hero-cover { width: min(100%, var(--cover-display-width)); height: auto; border: 1px solid rgba(255, 129, 196, .45); box-shadow: 18px 30px 72px rgba(0,0,0,.56), 0 0 54px rgba(255,39,150,.24); transform: rotate(5deg); position: relative; z-index: 2; }
.orbit { position: absolute; z-index: -1; border-radius: 50%; border: 1px solid rgba(255,75,169,.38); }
.orbit-one { width: 108%; height: 89%; transform: rotate(-19deg); }
.orbit-two { width: 93%; height: 106%; transform: rotate(25deg); border-color: rgba(92,164,252,.22); }
.floating-stamp { position: absolute; z-index: 3; top: 10%; right: -5%; width: 120px; height: 120px; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 1px solid rgba(255,167,208,.8); border-radius: 50%; background: rgba(12,7,32,.94); color: #fce4f0; font: 600 11px/1.2 var(--font-titles); text-align: center; letter-spacing: .16em; transform: rotate(14deg); box-shadow: 0 0 20px rgba(255,43,145,.1); }
.floating-stamp strong { margin: 3px 0; color: var(--pink-bright); font-size: 23px; }
.floating-stamp > span { font-size: 16px; color: var(--cyan); }
.scroll-cue { position: absolute; bottom: 22px; left: 50%; transform: translateX(-50%); color: #918eaa; letter-spacing: .25em; font: 500 11px/1 var(--font-titles); white-space: nowrap; }
.scroll-cue span { color: var(--pink); font-size: 22px; margin-left: 13px; vertical-align: middle; }

/* Expanded opening welcome: centered text-only introduction; book art lives in Books section. */
.hero-author-intro .hero-layout { display: block; min-height: 0; padding-block: 90px 112px; }
.hero-author-intro .hero-copy { width: min(100%, 850px); margin-inline: auto; }
.hero-author-intro .hero-copy h1 { max-width: 850px; margin: 12px 0 28px; font: 700 clamp(44px, 4.5vw, 66px)/1.01 var(--font-titles); letter-spacing: -.009em; text-transform: uppercase; }
.hero-author-intro .hero-intro-highlight { color: var(--pink-bright); font: italic 600 .84em/1.2 var(--font-editorial); text-transform: none; }
.hero-intro-body { max-width: 800px; color: #e5e0ef; font-size: 15.5px; line-height: 1.78; }
.hero-intro-body p { margin: 0 0 16px; }
.hero-intro-body p:first-child { color: #f1e6f2; }
.hero-intro-body strong { color: #fff9fd; }
.hero-intro-body em { color: #ffb3d8; }
/* Keep the whole series title violet; give “Bright Lights Series” a matched neon halo. */
.hero-intro-body em.bright-lights-series { color: var(--neon-violet); text-shadow: 0 0 13px rgba(180, 92, 255, .48), 0 0 34px rgba(148, 69, 255, .28); }
.hero-intro-body .bright-lights-glow, .detail-card .bright-lights-glow { color: #c781ff; text-shadow: 0 0 5px rgba(216, 165, 255, .9), 0 0 14px rgba(180, 92, 255, .7), 0 0 30px rgba(148, 69, 255, .4); }
/* Italic pink book title, without bold or a glow. */
.hero-intro-body em.book-title-inline { color: var(--pink-bright); font-weight: 400; font-style: italic; text-shadow: none; }
.hero-author-intro .button-row { margin-top: 25px; }
@media (max-width: 800px) {
  .hero-author-intro .hero-layout { padding-block: 64px 100px; }
  .hero-author-intro .hero-copy { text-align: left; }
  .hero-author-intro .hero-copy .eyebrow { justify-content: flex-start; }
  .hero-author-intro .hero-copy h1 { max-width: 640px; font-size: clamp(43px, 7.8vw, 62px); }
  .hero-author-intro .hero-intro-body { margin-inline: 0; }
  .hero-author-intro .button-row { justify-content: flex-start; }
}
@media (max-width: 520px) {
  .hero-author-intro .hero-copy h1 { font-size: clamp(39px, 10.3vw, 53px); }
  .hero-author-intro .hero-layout { padding-block: 48px 86px; }
  .hero-author-intro .hero-intro-body { font-size: 15px; line-height: 1.75; }
  .hero-author-intro .hero-intro-body p { margin-bottom: 17px; }
}

/* Sliding editorial ticker */
.ribbon { background: var(--night); color: #fff; overflow: hidden; transform: rotate(-.6deg) scale(1.015); position: relative; z-index: 1; }
.ribbon-track { display: flex; width: max-content; white-space: nowrap; animation: move-ribbon 32s linear infinite; }
.ribbon-track > span { display: inline-block; padding: 16px 0; font: 700 18px/1 var(--font-titles); letter-spacing: .25em; }
.ribbon-track b { padding: 0 35px; color: #ffd2e5; }
@keyframes move-ribbon { to { transform: translateX(-50%); } }

/* Book spotlight */
.section-books { background: radial-gradient(ellipse at 51% 68%,rgba(35,25,71,.45), transparent 63%),#08071d; }
.book-feature { display: grid; grid-template-columns: .92fr 1.08fr; gap: clamp(50px,8vw,110px); align-items: start; max-width: 1060px; margin: auto; }
.book-feature-art { min-height: 510px; position: sticky; top: 116px; display: grid; place-items: center; isolation: isolate; }
.book-feature-glow { position: absolute; z-index: -1; width: 440px; height: 440px; max-width: 100%; border-radius: 50%; background: radial-gradient(circle,rgba(255,43,145,.23) 0,rgba(101,51,160,.12) 49%, transparent 69%); filter: blur(20px); }
.book-feature-art img { width: min(100%, var(--cover-display-width)); height: auto; border: 1px solid rgba(255, 156, 212, .27); box-shadow: 18px 25px 48px rgba(0,0,0,.62), 0 0 40px rgba(235,33,125,.13); transform: rotate(-3deg); }
.book-feature-copy .eyebrow { margin-bottom: 15px; color: #00eaff; text-shadow: 0 0 7px rgba(0, 234, 255, .7), 0 0 18px rgba(0, 234, 255, .35); }
.book-series { margin: 0 0 13px; font: 600 17px/1.2 var(--font-titles); color: #a8add9; letter-spacing: .18em; }
.book-feature h3 { margin: 0 0 18px; color: var(--white); font: 700 clamp(64px,7.5vw,104px)/.84 var(--font-titles); text-transform: uppercase; letter-spacing: -.01em; }
.book-title-of { color: #ff81bd; font: 400 75px/.6 var(--font-script); text-transform: none; }
.book-pullquote { max-width: 520px; margin: 24px 0 18px; color: var(--white); font: italic 500 25px/1.4 var(--font-editorial); }
/* Author-provided synopsis: paragraph spacing and highlighted emotional beats */
.book-synopsis { max-width: 590px; margin: 0 0 28px; color: #dbd7e9; font-size: 15px; line-height: 1.82; }
.book-synopsis p { margin: 0 0 17px; }
.book-synopsis .synopsis-emphasis { color: #ff9ecf; font-size: 17px; line-height: 1.5; margin: 17px 0 20px; }
.book-synopsis .synopsis-emphasis--rowan { color: var(--electric-blue); text-shadow: 0 0 13px rgba(66, 186, 255, .25); }
/* Tilly’s closing question: italic white, without a neon halo. */
.book-synopsis .synopsis-emphasis--tilly { color: #fff; font-size: 18px; margin: 21px 0 0; font-style: italic; text-shadow: none; }
.book-tags { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 26px; }
.book-tags span { border: 1px solid transparent; box-shadow: inset 0 0 0 .5px #00EAFF; padding: 9px 13px; color: #b2cced; font: 600 12px/1.1 var(--font-titles); letter-spacing: .14em; }
.book-feature-copy .small-note { margin-top: 14px; }

/* Quote */
.quote-band { padding: 65px 0; background: linear-gradient(rgba(7,6,25,.75), rgba(7,6,25,.86)),url('../../images/miami-city-lights.webp') center 49%/cover no-repeat; border-block: 1px solid rgba(255,43,145,.22); }
.quote-inner { display: flex; align-items: center; justify-content: center; gap: min(6vw,85px); text-align: center; }
.quote-inner p { margin: 0; color: #fff; font: 500 clamp(25px,3.2vw,47px)/1.35 var(--font-editorial); }
.quote-inner p em { color: #ffa0cb; }
.quote-attribution { display: block; margin-top: 16px; color: #ffa0cb; font: 600 clamp(13px, 1.4vw, 17px)/1.5 var(--font-body); letter-spacing: .045em; }
.quote-spark { color: var(--cyan); font-size: 30px; }

/* Author */
.section-about { background: #0c0a24; }
.about-grid { display: grid; grid-template-columns: .88fr 1.12fr; align-items: center; gap: clamp(45px,7vw,115px); }
.about-illustration { border: 1px solid rgba(255,111,184,.26); background: #0c0a24; box-shadow: 15px 17px 0 rgba(255,43,145,.07); overflow: hidden; }
.about-illustration img { display: block; width: 100%; height: auto; aspect-ratio: 1122 / 1402; object-fit: contain; }
.about-copy h2 { margin-bottom: 25px; }
.about-lead { color: #ffe9f4; font: 500 24px/1.3 var(--font-editorial); }
.about-copy > p:not(.eyebrow) { max-width: 600px; }
.about-copy > p:not(.eyebrow):not(.about-lead) { color: var(--muted); }
.about-copy > p:not(.eyebrow) { line-height: 1.78; margin-block: 0 18px; }
.about-copy .about-signoff { margin-top: 25px !important; color: #ffb3d8 !important; font: italic 600 21px/1.5 var(--font-editorial); }

.text-link { display: inline-flex; gap: 15px; margin-top: 22px; padding-bottom: 7px; color: var(--white); border-bottom: 1px solid var(--electric-blue); font: 700 14px var(--font-body); transition: color .2s ease, border-bottom-color .2s ease; }
/* Questions? text, arrow (inherits color), and underline all turn matching electric blue on hover. */
.text-link:hover, .text-link:focus-visible { color: var(--electric-blue); border-bottom-color: var(--electric-blue); }

/* Three extras cards */
.section-insiders { background: var(--night); }
.insider-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.insider-card { padding: 32px 34px 41px; background: linear-gradient(150deg,rgba(32,22,64,.9),rgba(16,14,40,.95)); border: 1px solid rgba(190,162,226,.19); min-height: 300px; transition: transform .2s ease, border-color .2s ease; }
.insider-card:hover { transform: translateY(-4px); border-color: rgba(255, 75, 161, .6); }
.insider-icon { color: var(--pink-bright); font-size: 39px; line-height: 1; margin-bottom: 25px; }
.card-index { color: var(--cyan); font: 600 13px/1 var(--font-titles); letter-spacing: .15em; }
.insider-card h3 { margin: 12px 0; color: var(--white); font: 700 35px/1.1 var(--font-titles); text-transform: uppercase; }
.insider-card > p:last-child { color: var(--muted); font-size: 14px; }

/* Newsletter form */
.newsletter-section { background: radial-gradient(ellipse at 86% 30%,rgba(155,37,121,.2), transparent 47%),linear-gradient(120deg,#0e0a2a,#130b2d 53%,#0b0824); border-top: 1px solid rgba(255,101,176,.28); border-bottom: 1px solid rgba(255,101,176,.28); }
.newsletter-grid { display: grid; grid-template-columns: 1.03fr .97fr; align-items: center; gap: clamp(32px,9vw,130px); }
.newsletter-copy h2 { margin-bottom: 21px; }
.newsletter-copy > p:not(.eyebrow) { max-width: 470px; color: #c6c1df; }
.newsletter-copy .newsletter-small { margin-top: 25px; color: var(--cyan) !important; font: 600 16px/1.5 var(--font-editorial); }
.newsletter-form-panel { position: relative; padding: 43px 42px; border: 1px solid rgba(255,125,193,.46); background: rgba(9,7,32,.82); box-shadow: 0 12px 70px rgba(0,0,0,.23); }
.form-spark { color: var(--electric-blue); font-size: 35px; position: absolute; right: 36px; top: 28px; }
.newsletter-form-panel h3 { margin: 0 40px 5px 0; font: 700 37px/1.1 var(--font-titles); color: var(--white); text-transform: uppercase; }
.newsletter-form-panel > p { margin: 0 0 27px; color: var(--muted); font-size: 14px; }
.styled-form label:not(.check-row) { display: block; margin-bottom: 8px; color: #f2e6f0; font: 600 12px/1.2 var(--font-body); }
.styled-form input[type='email'], .styled-form input[type='text'], .styled-form textarea { display: block; width: 100%; padding: 15px 17px; color: var(--white); background: #161230; border: 1px solid #51446b; border-radius: 3px; font: 400 14px/1.5 var(--font-body); }
.styled-form textarea { resize: vertical; min-height: 145px; }
.styled-form input::placeholder, .styled-form textarea::placeholder { color: #89849f; opacity: 1; }
.styled-form input:focus, .styled-form textarea:focus { border-color: var(--cyan); }
.check-row { display: flex; align-items: flex-start; gap: 10px; color: #c8bdd4; margin: 17px 0 20px; font-size: 12px; line-height: 1.6; cursor: pointer; }
.check-row input { margin: 4px 0 0; accent-color: var(--pink); flex: 0 0 auto; }
.check-row a { text-decoration: underline; text-underline-offset: 2px; color: #a9d8ff; }
.form-help { font-size: 11px; color: #9c97b3; margin: 12px 0 0; }

/* Contact */
.contact-section { background: #0b0921; }
.contact-grid { display: grid; grid-template-columns: .88fr 1.12fr; gap: clamp(40px,8vw,110px); }
.contact-grid h2 { margin-bottom: 22px; }
.contact-grid > div > p:not(.eyebrow) { max-width: 385px; color: var(--muted); }
.contact-form { background: #13102e; border: 1px solid var(--line); padding: 33px; }
.two-inputs { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.contact-form > label { margin-top: 19px; }
.contact-form .button { margin-top: 22px; }

/* Footer */
.site-footer { background: #060515; border-top: 1px solid #302242; }
.footer-top { display: flex; align-items: flex-start; justify-content: space-between; gap: clamp(18px, 2.5vw, 35px); padding: 60px 0 50px; }
.footer-wordmark { font-size: 34px; }
.footer-top p { margin: 19px 0 0; color: #a9a3ba; font-size: 14px; }
.footer-brand { flex: 0 0 auto; }
/* Keep all footer menu buttons on a single row on desktop, without squeezing the social icons. */
.footer-right { display: flex; flex: 1 1 auto; min-width: 0; flex-direction: column; align-items: flex-end; gap: 22px; }
.footer-top .footer-nav { max-width: none; display: flex; flex-wrap: nowrap; justify-content: flex-end; gap: clamp(7px, 1.05vw, 14px); }
.footer-top .footer-nav a { flex: 0 0 auto; white-space: nowrap; font-size: 12px; color: #d1cbe1; }
.footer-top .social-links-footer { justify-content: flex-end; flex-wrap: wrap; }
.footer-bottom { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 18px 26px; border-top: 1px solid var(--line); padding-block: 21px 30px; color: #8b85a3; font-size: 11px; }
.footer-bottom .footer-credit { max-width: 420px; text-align: right; }
.footer-bottom a { color: #b9b2d1; text-decoration: underline; }

/* Thank-you and privacy standalone pages */
.subpage-main { min-height: 70vh; display: flex; align-items: center; padding: 85px 0 120px; }
.subpage-panel { max-width: 800px; padding: clamp(28px,7vw,68px); background: #13102f; border: 1px solid rgba(255,103,180,.32); }
.subpage-panel h1 { margin: 8px 0 18px; font: 700 clamp(52px,7vw,85px)/1 var(--font-titles); color: var(--white); text-transform: uppercase; }
.subpage-panel h2 { margin: 28px 0 9px; font: 700 30px var(--font-titles); color: var(--pink-bright); text-transform: uppercase; }
.subpage-panel p, .subpage-panel li { color: #c7c0d9; }
.subpage-panel .button { margin-top: 22px; }

@media (max-width: 1100px) {
  :root { --cover-display-width: 310px; }
  .hero-copy h1 { font-size: clamp(70px,9vw,105px); }
  .hero-copy .display-script { font-size: clamp(73px,10vw,118px); }

  .floating-stamp { right: -2%; }
  .main-nav { gap: 13px; }
  .footer-top { flex-direction: column; }
  .footer-right { width: 100%; align-items: flex-start; }
  .footer-top .footer-nav, .footer-top .social-links-footer { justify-content: flex-start; }
}
@media (max-width: 800px) {
  :root { --cover-display-width: 320px; }
  html { scroll-padding-top: 75px; }
  .shell { width: min(calc(100% - 38px),var(--content-width)); }
  .header-inner { min-height: 70px; }
  .wordmark { font-size: 27px; }
  .menu-toggle { display: flex; flex-direction: column; justify-content: center; gap: 5px; width: 44px; height: 42px; background: transparent; border: 1px solid #665273; padding: 10px; border-radius: 3px; }
  .menu-toggle span { display: block; height: 2px; width: 100%; background: var(--white); }
  .main-nav { display: none; position: absolute; top: 100%; left: 0; width: 100%; padding: 17px 20px 25px; background: #0a0823; border-bottom: 1px solid var(--pink); box-shadow: 0 15px 40px #02010c; flex-direction: column; align-items: stretch; gap: 0; }
  .main-nav.is-open { display: flex; }
  .main-nav a { display: block; padding: 12px 10px; }
  .main-nav .nav-cta { text-align: center; margin-top: 10px; }
  .hero-layout { grid-template-columns: 1fr; min-height: 0; gap: 50px; padding: 80px 0 90px; }
  .hero-copy { text-align: center; }
  .hero-copy .eyebrow, .hero-footnote { justify-content: center; }
  .hero-copy h1 { font-size: clamp(76px,12vw,115px); }
  .hero-copy .display-script { font-size: clamp(85px,14vw,135px); }
  .hero-description { margin-inline: auto; }
  .button-row { justify-content: center; }
  .hero-footnote { margin-top: 33px; }
  .hero-cover, .book-feature-art img { width: min(100%, var(--cover-display-width)); }
  .hero-art { min-height: 420px; }
  .orbit-one { width: 70%; }
  .orbit-two { width: 70%; }
  .floating-stamp { right: 16%; top: 3%; }
  .section { padding: 80px 0; }
  .book-feature { gap: 32px; grid-template-columns: 1fr; }
  .book-feature-art { min-height: 450px; position: relative; top: auto; }

  .book-feature-copy { text-align: center; }
  .book-feature-copy .eyebrow, .book-tags { justify-content: center; }
  .book-synopsis, .book-pullquote { margin-left: auto; margin-right: auto; }
  .book-synopsis { text-align: left; }
  .about-grid, .newsletter-grid, .contact-grid { grid-template-columns: 1fr; }
  .insider-grid { grid-template-columns: 1fr; }
  .insider-card { min-height: 0; }
  .footer-top { flex-direction: column; }
  .footer-right { align-items: flex-start; width: 100%; }
  .footer-top .footer-nav, .footer-top .social-links-footer { justify-content: flex-start; }
  .footer-top .footer-nav { flex-wrap: wrap; gap: 12px 18px; }
}
@media (max-width: 520px) {
  :root { --cover-display-width: 260px; }
  .announcement-bar { font-size: 10px; letter-spacing: .14em; gap: 7px; }
  .hero-layout { padding-top: 73px; }
  .hero-copy h1 { font-size: clamp(58px,15vw,83px); }
  .hero-copy .display-script { font-size: clamp(67px,17vw,96px); margin-top: 3px; }
  .hero-lead { font-size: 20px; }
  .hero-description { font-size: 14px; }
  .hero-art { min-height: 370px; }
  .hero-cover, .book-feature-art img { width: min(100%, var(--cover-display-width)); }
  .floating-stamp { width: 93px; height: 93px; right: 6%; font-size: 9px; }
  .floating-stamp strong { font-size: 17px; }
  .orbit-one { width: 92%; }
  .orbit-two { width: 87%; }
  .section-heading h2,.about-copy h2,.newsletter-copy h2,.contact-grid h2 { font-size: 50px; }
  .section-heading > p:last-child { font-size: 14px; }
  .book-feature h3 { font-size: 69px; }
  .book-title-of { font-size: 55px; }
  .book-feature-art { min-height: 400px; }

  .book-pullquote { font-size: 21px; }
  .quote-spark { display: none; }
  .quote-band { padding: 55px 0; }
  .newsletter-form-panel { padding: 31px 22px; }
  .form-spark { right: 20px; top: 23px; }
  .two-inputs { grid-template-columns: 1fr; gap: 17px; }
  .contact-form { padding: 23px; }
  .footer-bottom { flex-direction: column; align-items: center; text-align: center; }
  .footer-bottom .footer-credit { text-align: center; }
  .button { width: 100%; }
  .book-feature-copy .button { width: auto; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .ribbon-track { animation: none; }
  .button, .insider-card, .social-link { transition: none; }
}

/* Coach Harry Becker stays white and unglowing. */
.quote-attribution { color: #fff; text-shadow: none; }

/* Added dedicated content pages and clickable home page cards. */
.main-nav > a[aria-current="page"] { color: var(--electric-blue); }
.footer-nav a[aria-current="page"] { color: var(--electric-blue); }
.insider-card { display: flex; flex-direction: column; align-items: flex-start; color: var(--text); }
.insider-card:hover, .insider-card:focus-visible { color: var(--text); border-color: var(--electric-blue); }
.insider-card > p:not(.card-index) { color: var(--muted); font-size: 14px; }
.insider-card-action { display: inline-flex; align-items: center; gap: 13px; font: 700 12px/1.4 var(--font-body); color: var(--electric-blue); margin-top: auto; padding-top: 18px; }
.insider-card-action span { transition: transform .2s ease; }
.insider-card:hover .insider-card-action span { transform: translate(2px,-2px); }
.thanks-star { color: var(--electric-blue); }
.detail-main { min-height: 66vh; padding: 92px 0 120px; background: radial-gradient(ellipse at 85% 5%, rgba(180,92,255,.12), transparent 43%), var(--night); }
.detail-hero { max-width: 1100px; padding-bottom: 53px; }
.detail-hero .eyebrow { display: flex; align-items: center; gap: 12px; }
.detail-hero h1 { font: 800 clamp(60px,8vw,110px)/.98 var(--font-titles); letter-spacing: -.015em; text-transform: uppercase; color: var(--white); margin: 15px 0 25px; }
.detail-hero h1 em { font: italic 500 .9em/1.1 var(--font-editorial); text-transform: none; color: var(--pink-bright); text-shadow: 0 0 18px rgba(255,43,145,.36); }
.detail-intro { font-size: clamp(16px,2vw,19px); max-width: 740px; color: #c4bdd8; line-height: 1.8; }
.detail-hero .button-row { margin-top: 28px; }
.detail-section { padding-top: 24px; }
.detail-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 22px; }
.detail-card { padding: clamp(27px,4vw,45px); background: linear-gradient(145deg,rgba(31,22,62,.98),rgba(15,13,39,.98)); border: 1px solid rgba(109,199,255,.28); min-height: 315px; }
.detail-card .eyebrow { color: var(--electric-blue); }
.detail-card h2 { color: var(--white); font: 700 clamp(32px,3.2vw,43px)/1.1 var(--font-titles); text-transform: uppercase; margin: 20px 0; }
.detail-card > p:not(.eyebrow) { color: #c4bdd8; }
.detail-link { display: inline-flex; gap: 12px; margin-top: 16px; color: var(--pink-bright); border-bottom: 1px solid var(--pink-bright); padding-bottom: 4px; font-size: 13px; font-weight: 700; }
.detail-link:hover { color: #ffa4ce; border-bottom-color: #ffa4ce; }
/* Electric blue hover/focus for Events & Press links, retaining pink in default state. */
.events-press-link:hover, .events-press-link:focus-visible { color: var(--electric-blue); border-bottom-color: var(--electric-blue); }
.detail-coming { color: var(--pink-bright) !important; font-family: var(--font-editorial); font-style: italic; margin-top: 26px; }
.detail-end-note { margin: 27px 0 0; color: #a9a3ba; font-size: 13px; }
.faq-list { max-width: 950px; border-top: 1px solid rgba(109,199,255,.35); }
.faq-item { border-bottom: 1px solid rgba(109,199,255,.3); background: rgba(24,17,54,.42); }
.faq-item summary { list-style: none; display: flex; justify-content: space-between; gap: 25px; cursor: pointer; padding: 25px 28px; font: 600 clamp(21px,2.5vw,28px)/1.28 var(--font-titles); color: var(--white); }
.faq-item summary > span { min-width: 0; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary:after { content: '+'; flex: 0 0 auto; font: 500 30px/1 var(--font-body); color: var(--electric-blue); }
.faq-item[open] summary:after { content: '−'; }
.faq-item summary:hover { color: #cfefff; }
.faq-item summary:focus-visible { outline: 2px solid var(--cyan); outline-offset: -2px; }
.faq-answer { padding: 0 28px 22px; max-width: 770px; color: #c7c0d9; }
.faq-answer p { margin: 0; }
.faq-answer a { color: var(--electric-blue); text-decoration: underline; text-underline-offset: 3px; }
.detail-bottom-cta { padding: 44px 0 0; }
.detail-bottom-cta h2 { color: var(--white); font: 700 43px/1.2 var(--font-titles); text-transform: uppercase; margin: 0 0 12px; }
.detail-bottom-cta p { color: var(--muted); margin: 0 0 23px; }
/* Accommodate three extra main-navigation links before the mobile breakpoint. */
@media (max-width: 1080px) {
  .menu-toggle { display: flex; flex-direction: column; justify-content: center; gap: 5px; width: 44px; height: 42px; background: transparent; border: 1px solid #665273; padding: 10px; border-radius: 3px; }
  .menu-toggle span { display: block; height: 2px; width: 100%; background: var(--white); }
  .main-nav { display: none; position: absolute; top: 100%; left: 0; width: 100%; padding: 17px 20px 25px; background: #0a0823; border-bottom: 1px solid var(--pink); box-shadow: 0 15px 40px #02010c; flex-direction: column; align-items: stretch; gap: 0; }
  .main-nav.is-open { display: flex; }
  .main-nav a { display: block; padding: 12px 10px; }
  .main-nav .nav-cta { text-align: center; margin-top: 10px; }
}
@media (max-width: 800px) {
  .detail-main { padding: 70px 0 85px; }
  .detail-grid { grid-template-columns: 1fr; }
  .detail-hero { padding-bottom: 30px; }
}
@media (max-width: 520px) {
  .detail-hero h1 { font-size: clamp(54px,13vw,75px); }
  .faq-item summary { padding: 19px 18px; }
  .faq-answer { padding: 0 18px 20px; }
}

/* Spotify entry on the Reader Extras page; follows the social URL configured in site.js. */
.detail-card .extras-spotify-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 18px;
  padding: 10px 16px;
  border: 1px solid rgba(180, 92, 255, .68);
  border-radius: 999px;
  color: #f5e8ff;
  background: rgba(180, 92, 255, .11);
  text-decoration: none;
  font: 600 14px/1.2 var(--font-body);
  transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.detail-card .extras-spotify-link img { display: block; flex: none; width: 18px; height: 18px; }
.detail-card .extras-spotify-link:hover, .detail-card .extras-spotify-link:focus-visible {
  color: #fff;
  border-color: var(--neon-violet);
  background: rgba(180, 92, 255, .22);
  box-shadow: 0 0 15px rgba(180, 92, 255, .34);
}
@media (prefers-reduced-motion: reduce) {
  .detail-card .extras-spotify-link { transition: none; }
}

/* Cross-browser icon rendering: fixed vector paths, not operating-system glyphs. */
.ui-icon {
  display: inline-block;
  width: 1em;
  height: 1em;
  flex: 0 0 auto;
  vertical-align: -0.125em;
  overflow: visible;
}
/* Inline icons inherit the exact color, glow, and hover state of their parent. */
.wordmark .wordmark-star .ui-icon { display: block; }
.insider-icon .ui-icon, .form-spark .ui-icon, .quote-spark .ui-icon,
.thanks-star .ui-icon { display: inline-block; }
.ribbon-track b .ui-icon { vertical-align: -0.12em; }
/* Prevent unwanted iOS automatic font-size enlargement while respecting page zoom. */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
/* FAQ expand/collapse is drawn with CSS lines, not font-dependent +/− glyphs. */
.faq-item summary::after {
  content: '';
  width: 18px;
  height: 18px;
  align-self: center;
  background:
    linear-gradient(var(--electric-blue), var(--electric-blue)) center / 18px 2px no-repeat,
    linear-gradient(var(--electric-blue), var(--electric-blue)) center / 2px 18px no-repeat;
}
.faq-item[open] summary::after {
  content: '';
  background:
    linear-gradient(var(--electric-blue), var(--electric-blue)) center / 18px 2px no-repeat;
}