/*
Theme Name: MAY Biographies
Theme URI: https://maybiographies.com
Author: MAY Biographies LLC
Author URI: https://maybiographies.com
Description: Custom theme for MAY Biographies, built from the original brand site design. Works on its own, and is compatible with Elementor for visual page editing — the homepage is pre-structured as Elementor sections.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: may-biographies
Tags: custom-colors, custom-menu, full-width-template, translation-ready
*/

:root{
    --ink-green:#1F3329;
    --ink-green-deep:#142219;
    --paper:#F3ECDD;
    --paper-soft:#EAE2CF;
    --paper-white:#FBF8F1;
    --gold:#C9A464;
    --gold-bright:#E1C384;
    --charcoal:#2B2622;
    --burgundy:#7A2E2E;
    --pewter:#B6B2A8;
    --display:'Fraunces', serif;
    --body:'Inter', sans-serif;
    --mono:'IBM Plex Mono', monospace;
  }

  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    font-family:var(--body);
    color:var(--charcoal);
    background:var(--paper);
    line-height:1.55;
  }
  img{max-width:100%;display:block;}
  a{color:inherit;}
  h1,h2,h3{font-family:var(--display);margin:0;font-weight:600;letter-spacing:-0.01em;}
  .container{max-width:1180px;margin:0 auto;padding:0 24px;}
  .eyebrow{
    font-family:var(--mono);
    font-size:12.5px;
    letter-spacing:0.14em;
    text-transform:uppercase;
    color:var(--gold);
    margin:0 0 14px;
    display:flex;
    align-items:center;
    gap:10px;
  }
  .eyebrow::before{content:"";width:22px;height:1px;background:var(--gold);display:inline-block;}
  .eyebrow--dark{color:var(--burgundy);}
  .eyebrow--dark::before{background:var(--burgundy);}
  section{padding:96px 0;}
  @media (max-width:700px){ section{padding:64px 0;} }

  :focus-visible{outline:2px solid var(--gold);outline-offset:3px;}
  @media (prefers-reduced-motion: reduce){
    *{animation-duration:0.001ms !important; transition-duration:0.001ms !important;}
  }

  .btn{
    display:inline-flex;align-items:center;justify-content:center;gap:8px;
    font-family:var(--body);font-weight:600;font-size:15px;
    padding:13px 26px;border-radius:3px;border:1px solid transparent;
    cursor:pointer;text-decoration:none;transition:transform .18s ease, box-shadow .18s ease;
  }
  .btn:hover{transform:translateY(-1px);}
  .btn-primary{background:var(--gold);color:var(--ink-green-deep);}
  .btn-primary:hover{box-shadow:0 8px 20px rgba(201,164,100,0.35);}
  .btn-outline{background:transparent;border-color:rgba(243,236,221,0.45);color:var(--paper);}
  .btn-outline:hover{border-color:var(--gold);color:var(--gold-bright);}
  .btn-outline-dark{background:transparent;border-color:rgba(43,38,34,0.3);color:var(--charcoal);}
  .btn-outline-dark:hover{border-color:var(--burgundy);color:var(--burgundy);}

  /* ===== HEADER ===== */
  header{
    position:sticky;top:0;z-index:50;
    background:var(--ink-green);
    border-bottom:1px solid rgba(201,164,100,0.25);
  }
  .nav{display:flex;align-items:center;justify-content:space-between;padding:16px 0;}
  .logo{font-family:var(--display);font-size:20px;color:var(--paper);letter-spacing:0.02em;text-decoration:none;}
  .logo b{color:var(--gold-bright);font-weight:700;}
  .nav-links{display:flex;gap:30px;list-style:none;margin:0;padding:0;}
  .nav-links a{
    font-size:14.5px;color:rgba(243,236,221,0.82);text-decoration:none;
    letter-spacing:0.01em;transition:color .15s ease;
  }
  .nav-links a:hover{color:var(--gold-bright);}
  .nav-right{display:flex;align-items:center;gap:22px;}
  .nav-phone{font-family:var(--mono);font-size:13.5px;color:var(--paper);text-decoration:none;display:flex;align-items:center;gap:7px;}
  .nav-toggle{display:none;background:none;border:none;color:var(--paper);font-size:26px;cursor:pointer;padding:4px;}
  @media (max-width:880px){
    .nav-links{
      position:absolute;top:100%;left:0;right:0;background:var(--ink-green);
      flex-direction:column;gap:0;padding:6px 0 14px;border-bottom:1px solid rgba(201,164,100,0.25);
      display:none;
    }
    .nav-links.is-open{display:flex;}
    .nav-links a{display:block;padding:11px 24px;}
    .nav-phone{display:none;}
    .nav-toggle{display:block;}
  }

  /* ===== HERO ===== */
  .hero{
    position:relative;
    background:
      repeating-linear-gradient(45deg, rgba(255,255,255,0.018) 0px, rgba(255,255,255,0.018) 1px, transparent 1px, transparent 5px),
      repeating-linear-gradient(-45deg, rgba(0,0,0,0.05) 0px, rgba(0,0,0,0.05) 1px, transparent 1px, transparent 5px),
      linear-gradient(165deg, var(--ink-green) 0%, var(--ink-green-deep) 100%);
    color:var(--paper);
    padding:90px 0 64px;
    overflow:hidden;
  }
  .hero-grid{display:grid;grid-template-columns:1.15fr 0.85fr;gap:56px;align-items:start;}
  @media (max-width:880px){ .hero-grid{grid-template-columns:1fr;} }
  .hero h1{font-size:clamp(34px,5vw,54px);line-height:1.06;color:var(--paper-white);}
  .hero h1 em{font-style:italic;font-weight:400;}
  .foil{
    background:linear-gradient(120deg,#f0d8a4 0%,#C9A464 35%,#8a6a35 55%,#E1C384 80%);
    -webkit-background-clip:text;background-clip:text;color:transparent;
  }
  .hero-sub{font-size:17.5px;color:rgba(243,236,221,0.82);max-width:480px;margin:22px 0 32px;}
  .hero-ctas{display:flex;gap:14px;flex-wrap:wrap;}

  /* deckle torn-paper edge at hero base */
  .hero::after{
    content:"";position:absolute;left:0;right:0;bottom:-1px;height:22px;
    background:var(--paper);
    clip-path:polygon(0% 100%,4% 0%,8% 100%,12% 0%,16% 100%,20% 0%,24% 100%,28% 0%,32% 100%,36% 0%,40% 100%,44% 0%,48% 100%,52% 0%,56% 100%,60% 0%,64% 100%,68% 0%,72% 100%,76% 0%,80% 100%,84% 0%,88% 100%,92% 0%,96% 100%,100% 0%,100% 100%,0% 100%);
  }

  /* ===== QUIZ CARD ===== */
  .quiz{
    background:var(--paper-white);
    color:var(--charcoal);
    border-radius:6px;
    padding:30px 28px 26px;
    box-shadow:0 30px 60px -20px rgba(0,0,0,0.45);
    position:relative;
  }
  .quiz::before{
    content:"";position:absolute;top:0;right:34px;width:18px;height:46px;
    background:var(--burgundy);
    clip-path:polygon(0 0,100% 0,100% 100%,50% 78%,0 100%);
  }
  .quiz-progress{height:5px;background:var(--paper-soft);border-radius:4px;overflow:hidden;margin-bottom:10px;}
  .quiz-progress-fill{height:100%;background:linear-gradient(90deg,var(--gold),var(--burgundy));width:12%;transition:width .35s ease;}
  .quiz-caption{font-family:var(--mono);font-size:12px;letter-spacing:0.04em;color:#8a8275;margin:0 0 18px;}
  .quiz-step{display:none;}
  .quiz-step.is-active{display:block;animation:fadeIn .25s ease;}
  @keyframes fadeIn{from{opacity:0;transform:translateY(4px);}to{opacity:1;transform:translateY(0);}}
  .quiz-step h3{font-size:19px;margin-bottom:16px;line-height:1.3;}
  .quiz-options{display:flex;flex-direction:column;gap:9px;margin-bottom:18px;}
  .quiz-options button{
    text-align:left;font-family:var(--body);font-size:14.5px;color:var(--charcoal);
    background:var(--paper);border:1px solid var(--paper-soft);border-radius:4px;
    padding:12px 14px;cursor:pointer;transition:border-color .15s ease, background .15s ease;
  }
  .quiz-options button:hover{border-color:var(--gold);}
  .quiz-options button.is-selected{border-color:var(--burgundy);background:#FBF0EC;font-weight:600;}
  .quiz-continue{width:100%;}
  .quiz-continue[disabled]{opacity:0.45;cursor:not-allowed;}
  .quiz-back{
    display:inline-block;margin-top:12px;background:none;border:none;color:#8a8275;
    font-size:13px;cursor:pointer;text-decoration:underline;padding:0;
  }
  .quiz-form{display:flex;flex-direction:column;gap:12px;margin-bottom:6px;}
  .quiz-form label{font-size:13px;color:#6f675b;display:flex;flex-direction:column;gap:5px;}
  .quiz-form input{
    font-family:var(--body);font-size:14.5px;padding:11px 12px;border:1px solid var(--paper-soft);
    border-radius:4px;background:var(--paper);color:var(--charcoal);
  }
  .quiz-form input:focus{border-color:var(--gold);}
  .quiz-fallback{font-size:13.5px;color:#6f675b;}
  .quiz-fallback a{color:var(--burgundy);text-decoration:underline;}

  /* ===== SECTION HEADERS ===== */
  .section-head{max-width:600px;margin-bottom:54px;}
  .section-head h2{font-size:clamp(28px,3.6vw,38px);color:var(--ink-green);}
  .section-head p{font-size:16px;color:#564f44;margin-top:14px;}
  .section-head--dark h2{color:var(--paper-white);}
  .section-head--dark p{color:rgba(243,236,221,0.75);}
  .section-head--center{margin:0 auto 54px;text-align:center;}
  .section-head--center .eyebrow{justify-content:center;}
  .section-head--center .eyebrow::before{display:none;}

  /* ===== HOW IT WORKS ===== */
  .steps{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--paper-soft);}
  .step{
    display:grid;grid-template-columns:90px 1fr;gap:24px;padding:28px 0;
    border-bottom:1px solid var(--paper-soft);align-items:start;
  }
  .step-num{font-family:var(--display);font-size:34px;color:var(--gold);font-weight:300;}
  .step h3{font-size:18px;margin-bottom:6px;color:var(--ink-green);}
  .step p{margin:0;color:#564f44;font-size:15px;max-width:560px;}
  @media (max-width:600px){ .step{grid-template-columns:50px 1fr;} .step-num{font-size:26px;} }

  /* ===== EDITIONS / BOOKSHELF ===== */
  .editions{background:var(--ink-green);color:var(--paper);}
  .shelf-wrap{overflow-x:auto;padding-bottom:6px;}
  .shelf{display:flex;gap:18px;align-items:flex-end;justify-content:center;padding:20px 10px 0;min-width:min-content;}
  .spine{
    width:108px;min-height:380px;border-radius:5px 14px 14px 5px;
    display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
    padding:26px 0;cursor:pointer;border:none;
    writing-mode:vertical-rl;text-orientation:mixed;
    box-shadow:0 12px 24px -8px rgba(0,0,0,0.5), inset -3px 0 0 rgba(0,0,0,0.25);
    transition:transform .25s ease, box-shadow .25s ease;
    position:relative;flex-shrink:0;
  }
  .spine:hover, .spine:focus-visible, .spine.is-active{
    transform:translateY(-16px) rotate(-2deg);
    box-shadow:0 26px 34px -10px rgba(0,0,0,0.55), inset -3px 0 0 rgba(0,0,0,0.25);
  }
  .spine--silver{background:linear-gradient(100deg,#8c887e,#c4c0b5 45%,#8c887e);color:#2a2722;}
  .spine--gold{background:linear-gradient(100deg,#8a6a30,#d8b264 45%,#8a6a30);color:#2a1f0c;}
  .spine--diamond{
    background:
      radial-gradient(circle at 30% 20%, rgba(255,255,255,0.18) 0, transparent 40%),
      radial-gradient(circle at 70% 60%, rgba(255,255,255,0.12) 0, transparent 35%),
      linear-gradient(100deg,#0d1a24,#1f3a4d 45%,#0d1a24);
    color:#e7eef2;
  }
  .spine-name{font-family:var(--display);font-size:20px;font-weight:600;letter-spacing:0.02em;margin-bottom:14px;}
  .spine-price{font-family:var(--mono);font-size:14px;}
  .spine-tag{
    position:absolute;top:-12px;left:50%;transform:translateX(-50%) rotate(0deg);
    writing-mode:horizontal-tb;background:var(--burgundy);color:#fff;font-family:var(--mono);
    font-size:10px;letter-spacing:0.06em;padding:3px 9px;border-radius:3px;white-space:nowrap;
  }
  .shelf-ledge{
    height:22px;margin:0 auto;max-width:560px;border-radius:2px;
    background:linear-gradient(180deg,#3a2a1c,#1c130c);
    box-shadow:0 18px 30px -10px rgba(0,0,0,0.6);
  }
  .edition-detail{display:none;max-width:640px;margin:46px auto 0;}
  .edition-detail.is-active{display:block;animation:fadeIn .3s ease;}
  .edition-detail h4{font-family:var(--display);font-size:24px;color:var(--gold-bright);margin-bottom:4px;}
  .edition-detail .price{font-family:var(--mono);font-size:15px;color:var(--paper);margin-bottom:18px;display:block;}
  .edition-detail ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px 24px;}
  @media (max-width:600px){ .edition-detail ul{grid-template-columns:1fr;} }
  .edition-detail li{font-size:14px;color:rgba(243,236,221,0.85);padding-left:18px;position:relative;}
  .edition-detail li::before{content:"—";position:absolute;left:0;color:var(--gold);}
  .editions-footnote{
    text-align:center;font-size:13.5px;color:rgba(243,236,221,0.6);margin-top:48px;
    font-family:var(--mono);
  }

  /* responsive shelf fallback */
  @media (max-width:680px){
    .shelf{flex-direction:column;align-items:stretch;gap:10px;}
    .spine{
      width:100%;min-height:0;writing-mode:horizontal-tb;border-radius:5px;
      flex-direction:row;justify-content:space-between;padding:16px 18px;
    }
    .spine:hover,.spine.is-active{transform:translateX(6px);}
    .spine-name{margin-bottom:0;}
    .shelf-ledge{display:none;}
    .spine-tag{top:-10px;left:auto;right:14px;transform:none;}
  }

  /* black card plaque */
  .black-card{
    max-width:640px;margin:64px auto 0;text-align:center;padding:34px 30px;
    border:1px solid rgba(201,164,100,0.35);border-radius:6px;
    background:linear-gradient(180deg, rgba(255,255,255,0.03), transparent);
  }
  .black-card h4{font-family:var(--display);color:var(--paper-white);font-size:20px;margin-bottom:10px;}
  .black-card p{color:rgba(243,236,221,0.72);font-size:14.5px;margin:0 0 18px;}
  .black-card-list{
    display:flex;flex-wrap:wrap;gap:8px 18px;justify-content:center;list-style:none;
    padding:0;margin:0 0 24px;font-family:var(--mono);font-size:12.5px;color:var(--gold-bright);
  }

  /* ===== SAMPLES ===== */
  .books-row{display:flex;gap:30px;justify-content:center;flex-wrap:wrap;}
  .book-cover{
    width:190px;height:260px;border-radius:3px 8px 8px 3px;padding:22px 18px;
    display:flex;flex-direction:column;justify-content:space-between;
    box-shadow:0 18px 30px -12px rgba(43,38,34,0.35), inset 4px 0 0 rgba(0,0,0,0.15);
    color:var(--paper);
  }
  .book-cover--1{background:linear-gradient(160deg,#2f4538,#1c2c22);}
  .book-cover--2{background:linear-gradient(160deg,#5a3a2e,#3a2419);}
  .book-cover--3{background:linear-gradient(160deg,#1c2733,#101820);}
  .book-cover .eyebrow{color:var(--gold-bright);font-size:10.5px;margin-bottom:0;}
  .book-cover .eyebrow::before{background:var(--gold-bright);}
  .book-title{font-family:var(--display);font-size:20px;line-height:1.2;}
  .book-meta{font-family:var(--mono);font-size:11px;color:rgba(243,236,221,0.65);}
  .samples-note{text-align:center;color:#8a8275;font-size:13.5px;margin-top:30px;}

  /* ===== TESTIMONIALS ===== */
  .testimonials{background:var(--paper-soft);}
  .quote-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;}
  @media (max-width:880px){ .quote-grid{grid-template-columns:1fr;} }
  .quote-card{
    background:var(--paper-white);border-top:3px solid var(--gold);padding:30px 26px;border-radius:2px;
  }
  .quote-mark{font-family:var(--display);font-size:42px;color:var(--gold);line-height:1;margin-bottom:6px;}
  .quote-card p{font-size:15px;color:var(--charcoal);margin:0 0 16px;}
  .quote-attr{font-family:var(--mono);font-size:12px;color:#8a8275;}

  /* ===== FAQ ===== */
  .faq-list{border-top:1px solid var(--paper-soft);max-width:780px;}
  .faq-item{border-bottom:1px solid var(--paper-soft);}
  .faq-q{
    width:100%;text-align:left;background:none;border:none;cursor:pointer;
    padding:22px 0;display:flex;justify-content:space-between;align-items:center;
    font-family:var(--display);font-size:18px;color:var(--ink-green);gap:18px;
  }
  .faq-q .chev{flex-shrink:0;transition:transform .2s ease;color:var(--gold);}
  .faq-item.is-open .faq-q .chev{transform:rotate(45deg);}
  .faq-a{max-height:0;overflow:hidden;transition:max-height .25s ease;}
  .faq-a p{font-size:15px;color:#564f44;margin:0 0 22px;max-width:620px;}
  .faq-item.is-open .faq-a{max-height:220px;}

  /* ===== FINAL CTA ===== */
  .final-cta{
    background:linear-gradient(165deg, var(--ink-green) 0%, var(--ink-green-deep) 100%);
    color:var(--paper);text-align:center;
  }
  .final-cta h2{font-size:clamp(28px,4vw,40px);color:var(--paper-white);margin-bottom:18px;}
  .final-cta p{color:rgba(243,236,221,0.75);max-width:480px;margin:0 auto 30px;font-size:16px;}
  .final-cta-ctas{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}

  /* ===== FOOTER ===== */
  footer{background:var(--ink-green-deep);color:rgba(243,236,221,0.7);padding:64px 0 28px;font-size:14px;}
  .footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;}
  @media (max-width:700px){ .footer-grid{grid-template-columns:1fr;gap:30px;} }
  .footer-grid h5{font-family:var(--mono);font-size:12px;letter-spacing:0.08em;text-transform:uppercase;color:var(--gold);margin:0 0 16px;}
  .footer-grid ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;}
  .footer-grid a{text-decoration:none;color:rgba(243,236,221,0.7);}
  .footer-grid a:hover{color:var(--gold-bright);}
  .footer-logo{font-family:var(--display);font-size:20px;color:var(--paper-white);margin-bottom:10px;display:block;}
  .footer-bottom{
    border-top:1px solid rgba(243,236,221,0.12);margin-top:48px;padding-top:22px;
    display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:12.5px;color:rgba(243,236,221,0.45);
  }