
:root{
  --navy:#041d31;--navy-2:#062944;--navy-3:#0b3452;--gold:#d6a64f;--gold-2:#efc978;
  --paper:#f7efdf;--ink:#0f2133;--muted:#5e5a53;--line:rgba(19,40,58,.18);
  --container:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Georgia,'Times New Roman',serif;color:var(--ink);background:var(--navy);overflow-x:hidden}
a{text-decoration:none}
img{display:block;max-width:100%}
.container{max-width:var(--container)}

/* IMAGE PLACEHOLDERS ------------------------------------------------------
   Every visual uses a fixed-aspect slot. When you add your own image, put:
   <img src="assets/img/your-file.jpg" alt="..."> inside the .image-slot and
   remove the <span class="slot-label">...</span>. object-fit:contain means
   the full image is always visible and is NEVER cropped.
------------------------------------------------------------------------- */
.image-slot{position:relative;width:100%;overflow:hidden;background:
  linear-gradient(135deg,rgba(214,166,79,.13),rgba(4,29,49,.05)),#e9e2d5;
  border:1px dashed rgba(4,29,49,.35);display:flex;align-items:center;justify-content:center;text-align:center;color:#6b6258}
.image-slot img{width:100%;height:100%;object-fit:contain;object-position:center;background:transparent}
.slot-label{padding:.7rem 1rem;font:600 .72rem/1.35 Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#746a5f}
.slot-label small{display:block;font-size:.64rem;font-weight:400;letter-spacing:.05em;margin-top:.22rem;color:#8b8176}
.logo-slot{width:220px;aspect-ratio:5.5/1;background:#082640;border-color:rgba(214,166,79,.55);color:var(--gold-2)}
.logo-slot .slot-label{color:var(--gold-2);font-size:.68rem}
.hero-image-slot{position:absolute;inset:0;aspect-ratio:auto;border:0;border-radius:0;background:#13314a;color:#d4b56f}
.hero-image-slot .slot-label,.banner-image-slot .slot-label,.subscribe-image-slot .slot-label{position:absolute;left:1rem;bottom:.75rem;background:rgba(2,19,34,.66);color:#f0ce86;border-radius:3px;padding:.45rem .65rem}
.book-cover-slot{width:min(100%,220px);aspect-ratio:2/3;margin-inline:auto;box-shadow:5px 7px 10px rgba(0,0,0,.15);background:#eee5d7}
.story-slot{aspect-ratio:16/9;background:#e9e2d5}
.music-slot{aspect-ratio:16/9;background:#e9e2d5;border-radius:4px}
.poetry-cover-slot{width:min(100%,230px);aspect-ratio:2/3;margin-inline:auto;box-shadow:5px 7px 12px rgba(0,0,0,.15)}
.about-collage-slot{aspect-ratio:4/3;box-shadow:0 7px 18px rgba(0,0,0,.12)}

/* NAV */
.site-navbar{min-height:64px;background:linear-gradient(90deg,#031527,#082640);border-bottom:1px solid rgba(214,166,79,.55);z-index:1040}
.site-navbar .navbar-brand{margin-right:2rem}
.site-navbar .nav-link{font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:#fff!important;padding:.65rem .78rem!important;position:relative;white-space:nowrap}
.site-navbar .nav-link:hover,.site-navbar .nav-link.active{color:var(--gold-2)!important}
.site-navbar .nav-link.active:after{content:"";position:absolute;left:.72rem;right:.72rem;bottom:.25rem;height:1px;background:var(--gold)}
.navbar-toggler{border-color:rgba(214,166,79,.7)}.navbar-toggler:focus{box-shadow:none}.search-mark{color:var(--gold-2);font-size:1.05rem;padding-left:.45rem}

/* HERO: desktop keeps the design's wide image ratio; mobile stacks image and text */
.hero{position:relative;isolation:isolate;overflow:hidden;aspect-ratio:1536/510;min-height:340px;background:var(--navy-2)}
.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,18,32,.35),rgba(0,25,43,.54) 35%,rgba(0,22,39,.28));z-index:1;pointer-events:none}
.hero:after{content:"";position:absolute;left:27%;right:20%;top:6%;bottom:6%;background:radial-gradient(ellipse at center,rgba(0,20,36,.88),rgba(0,23,40,.56) 58%,transparent 100%);z-index:1;pointer-events:none}
.hero .hero-content{position:relative;z-index:2;height:100%;min-height:340px;display:flex;align-items:center;justify-content:center;text-align:center;color:white;padding-block:2rem}
.hero h1{font-size:clamp(2.75rem,5.4vw,4.85rem);line-height:.98;margin-bottom:.45rem;color:#f7e5b3;text-shadow:0 2px 16px rgba(0,0,0,.45)}
.hero .subhead{font-style:italic;font-size:clamp(1.25rem,2.4vw,2rem);color:#f0ca74;margin-bottom:.8rem}
.hero p{font-size:clamp(.96rem,1.5vw,1.08rem);max-width:580px;margin:.25rem auto 1.1rem;line-height:1.55}
.hero-rule{width:108px;height:1px;background:var(--gold);margin:1rem auto;position:relative}.hero-rule:after{content:"✦";position:absolute;left:50%;top:50%;transform:translate(-50%,-52%);background:#06223a;color:var(--gold-2);padding:0 .3rem;font-size:.8rem}

.btn-gold,.btn-navy{border-radius:4px;text-transform:uppercase;letter-spacing:.1em;font-weight:700;font-size:.72rem;padding:.82rem 1.2rem;white-space:normal}
.btn-gold{background:linear-gradient(90deg,#d5a346,#f0c66f);border:1px solid #e6bc69;color:#18202a}.btn-gold:hover{background:#efc978;color:#18202a}
.btn-navy{background:var(--navy);border:1px solid #123953;color:#fff}.btn-navy:hover{background:#0b304d;color:#fff}
.btn-outline-gold{border:1px solid var(--gold);color:#f1d18f;text-transform:uppercase;letter-spacing:.1em;font-size:.72rem;padding:.8rem 1.2rem}.btn-outline-gold:hover{background:rgba(214,166,79,.12);color:#fff}

/* PAPER */
.paper{background:radial-gradient(circle at 15% 8%,rgba(255,255,255,.42),transparent 28%),linear-gradient(rgba(255,255,255,.11),rgba(255,255,255,.11)),var(--paper);position:relative}
.paper:before{content:"";position:absolute;inset:0;opacity:.13;pointer-events:none;background-image:repeating-linear-gradient(0deg,rgba(113,82,45,.12) 0 1px,transparent 1px 5px)}.paper>*{position:relative}
.section-pad{padding:2rem 0}.section-title{text-align:center;font-size:clamp(1.45rem,2.3vw,1.8rem);text-transform:uppercase;letter-spacing:.02em;margin-bottom:.3rem}.section-title:before,.section-title:after{content:"✦";color:var(--gold);font-size:.72rem;vertical-align:middle;margin:0 .8rem}.section-kicker{text-align:center;color:#4a4b4c;font-style:italic;margin-bottom:1.5rem}

/* BOOK GRID: consistent vertical rhythm. Titles reserve exactly two lines on tablet/desktop.
   Therefore every description starts on the SAME baseline even when one title is one line. */
.book-grid>[class*="col-"]{display:flex}
.book-item{display:flex;flex-direction:column;width:100%;text-align:center}
.book-media-wrap{min-height:340px;display:flex;align-items:flex-end;justify-content:center;margin-bottom:1rem}
.book-title{font-size:1.34rem;line-height:1.22;margin:0 0 .55rem;min-height:2.44em;display:flex;align-items:flex-start;justify-content:center}
.book-description{line-height:1.42;min-height:5.7em;margin:0 auto .65rem;max-width:260px}
.book-meta{min-height:1.6em;margin:.15rem 0 .75rem;white-space:nowrap}
.book-actions{margin-top:auto}

/* CARDS / MEDIA */
.soft-card{background:rgba(255,255,255,.32);border:1px solid rgba(89,61,27,.14);box-shadow:0 6px 16px rgba(40,30,16,.08);border-radius:4px;overflow:hidden;display:flex;flex-direction:column}.soft-card .card-body{padding:1.05rem 1.1rem;display:flex;flex-direction:column;flex:1}.soft-card h3,.soft-card h4{color:#10243b}.soft-card .card-body>a{margin-top:auto}
.line-row{border-bottom:1px solid var(--line);padding:1rem 0}.line-row:last-child{border-bottom:0}.play-circle{width:34px;height:34px;border:2px solid #081d31;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:.75rem;flex:0 0 34px}.wave{height:18px;flex:1;min-width:80px;background:repeating-linear-gradient(90deg,rgba(27,39,47,.25) 0 2px,transparent 2px 5px);clip-path:polygon(0 43%,3% 35%,6% 64%,9% 28%,13% 72%,16% 36%,21% 59%,24% 30%,28% 68%,33% 42%,38% 56%,43% 35%,49% 62%,54% 38%,60% 57%,67% 42%,74% 53%,82% 45%,90% 52%,100% 48%,100% 54%,0 54%)}
.poem-note{background:#f1e5cf;border:1px solid #ddc5a3;border-radius:3px;padding:1.25rem;min-height:250px;box-shadow:0 4px 8px rgba(56,38,17,.07);position:relative}.poem-note:after{content:"✎";position:absolute;right:15px;bottom:10px;color:#a87d43;font-size:1.5rem;opacity:.8}.poem-note h4{font-size:1.35rem}.poem-note p{white-space:pre-line;line-height:1.35;color:#232f38}

/* IMAGE BANDS */
.quote-band,.subscribe{position:relative;isolation:isolate;overflow:hidden;background:var(--navy-2);color:#fff}
.quote-band{min-height:190px;display:flex;align-items:center;color:#f8e2a8;text-align:center}.banner-image-slot,.subscribe-image-slot{position:absolute;inset:0;border:0;background:#14324a;z-index:-2}.quote-band:after,.subscribe:after{content:"";position:absolute;inset:0;background:rgba(2,28,48,.66);z-index:-1}.quote-band .container,.subscribe .container{position:relative;z-index:1}.quote-band blockquote{font-size:clamp(1.35rem,3vw,2.15rem);font-style:italic;margin:0 auto;max-width:760px;text-shadow:0 2px 8px rgba(0,0,0,.5)}.quote-band cite{display:block;margin-top:.55rem;font-style:italic;font-size:1rem}
.feature-strip{background:var(--paper);padding:1.5rem 0;border-top:1px solid rgba(214,166,79,.32)}.feature-item{text-align:center;padding:0 1.2rem;min-height:115px}.feature-item+.feature-item{border-left:1px solid rgba(20,39,54,.2)}.feature-icon{font-size:2.25rem;color:#aa7941;line-height:1}.feature-item h4{font-size:1.05rem;text-transform:uppercase;margin:.55rem 0 .25rem}.feature-item p{margin:0;font-size:.93rem;color:#333}
.subscribe{padding:1.55rem 0;min-height:145px}.subscribe h3{color:#f3ce7a;text-transform:uppercase;margin-bottom:.25rem}.subscribe p{font-style:italic}.subscribe .form-control{background:rgba(4,30,50,.86);border:1px solid #d5ad63;color:#fff;height:46px}.subscribe .form-control::placeholder{color:#b9c0c6}.subscribe .btn{height:46px;min-width:150px}

/* ABOUT / CONTACT */
.about-copy h2,.contact-title,.featured-big{font-size:clamp(1.55rem,2.7vw,2rem);color:#0d2941}.about-copy p{font-size:1.03rem;line-height:1.48}.life-card{background:rgba(255,255,255,.38);padding:1.25rem;border:1px solid #ddc9aa;border-radius:3px}.life-line{display:flex;gap:.8rem;margin:.7rem 0}.life-line .symbol{font-size:1.6rem;width:38px;color:#062844;flex:0 0 38px}.contact-form .form-control,.contact-form .form-select{border:1px solid #c5bcae;background:rgba(255,255,255,.35);border-radius:4px;padding:.75rem .9rem}.contact-form textarea{min-height:135px}.connect-row{display:flex;gap:1rem;align-items:center;margin:1.1rem 0}.connect-icon{width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,#efd395,#d9aa57);display:flex;align-items:center;justify-content:center;font-size:1.45rem;color:#08223a;flex:0 0 56px}

/* FOOTER */
.site-footer{background:linear-gradient(#06253e,#03182a);color:#fff;padding:1.4rem 0 1.6rem;border-top:1px solid rgba(214,166,79,.55)}.footer-nav a{color:#fff;font-size:.8rem;text-transform:uppercase;margin:0 .55rem}.footer-nav a.active,.footer-nav a:hover{color:var(--gold-2)}.socials{display:flex;justify-content:center;gap:.8rem;margin:1rem 0;flex-wrap:wrap}.socials a{width:38px;height:38px;border:1px solid #dbad58;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#f0ca79;font-weight:700;font-family:Arial,sans-serif}.copyright{font-size:.83rem;color:#e5e7e9}.footer-hand{font-family:'Segoe Print','Bradley Hand',cursive;color:#d7a655;font-size:1rem;transform:rotate(-4deg);display:inline-block}
.text-gold{color:var(--gold)!important}.bg-navy{background:var(--navy)!important}.smallcaps{text-transform:uppercase;letter-spacing:.08em}.serif{font-family:Georgia,'Times New Roman',serif}.script{font-family:'Segoe Print','Bradley Hand',cursive}.divider{height:1px;background:rgba(110,84,49,.22)}

/* RESPONSIVE */
@media (max-width:1199.98px){.logo-slot{width:190px}.site-navbar .nav-link{padding-inline:.58rem!important}.book-media-wrap{min-height:305px}.book-cover-slot{max-width:195px}.book-description{min-height:6.2em}}
@media (max-width:991.98px){
  .site-navbar .navbar-collapse{background:#041d31;padding:1rem;margin:0 -12px -8px}.site-navbar .navbar-brand{margin-right:0}.logo-slot{width:175px}
  .hero{aspect-ratio:auto;min-height:0;padding-top:56.25%;overflow:visible}.hero-image-slot{height:auto;aspect-ratio:16/9;bottom:auto}.hero:before,.hero:after{height:auto;aspect-ratio:16/9;bottom:auto}.hero .hero-content{min-height:0;height:auto;background:var(--navy-2);padding:2.2rem 1rem;margin-top:0}.hero .hero-content>div{max-width:680px}
  .feature-item+.feature-item{border-left:0;border-top:1px solid rgba(20,39,54,.14);padding-top:1rem;margin-top:1rem}
  .book-media-wrap{min-height:325px}.book-cover-slot{max-width:210px}.book-description{min-height:5.8em}
  .music-slot{max-width:420px}.line-row .text-lg-end{display:flex;gap:.65rem;flex-wrap:wrap}.line-row .text-lg-end .btn{flex:1 1 150px}
}
@media (max-width:767.98px){
  .section-pad{padding:1.6rem 0}.book-title{min-height:2.44em}.book-description{min-height:5.8em}.book-meta{white-space:normal}
  .feature-item{min-height:auto}.subscribe{padding:1.35rem 0}.subscribe .input-group{display:flex;flex-direction:column;gap:.55rem}.subscribe .form-control,.subscribe .btn{width:100%;border-radius:4px!important}.footer-nav span{display:none}.footer-nav a{margin:.28rem .45rem}
  .quote-band{min-height:160px}.contact-title{font-size:1.45rem}.connect-row{align-items:flex-start}
}
@media (max-width:575.98px){
  .container{padding-inline:1rem}.site-navbar{min-height:58px}.logo-slot{width:155px}.logo-slot .slot-label{font-size:.58rem;padding:.4rem}.hero{padding-top:62.5%}.hero-image-slot,.hero:before,.hero:after{aspect-ratio:8/5}.hero h1{font-size:2.65rem}.hero .subhead{font-size:1.35rem}.hero p{font-size:.96rem}.btn-gold,.btn-navy,.btn-outline-gold{width:100%;padding:.8rem 1rem}.hero .d-flex .btn{flex:1 1 100%}
  .section-title:before,.section-title:after{margin:0 .38rem}.book-media-wrap{min-height:0}.book-cover-slot{width:min(78vw,220px)}.book-title,.book-description,.book-meta{min-height:0}.book-item{max-width:330px;margin-inline:auto}.book-actions{width:100%}
  .poem-note{min-height:0}.story-slot,.music-slot{width:100%}.quote-band{min-height:150px}.quote-band .slot-label,.subscribe .slot-label{font-size:.58rem}.socials{gap:.55rem}
}

.about-heart-band{min-height:260px}
@media(max-width:991.98px){.about-heart-band{min-height:210px}}

/* -----------------------------------------------------------------------
   TYPOGRAPHY + PRECISION ALIGNMENT PASS (v3)
   The reference mockups combine a literary high-contrast serif, a classic
   readable serif, compact UI lettering, and handwritten accent notes.
------------------------------------------------------------------------ */
:root{
  --font-display:'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --font-body:'Libre Baskerville', Georgia, 'Times New Roman', serif;
  --font-ui:'Montserrat', Arial, sans-serif;
  --font-script:'Caveat','Segoe Print','Bradley Hand',cursive;
}

body{font-family:var(--font-body);font-size:15px;line-height:1.52}
h1,h2,h3,h4,h5,h6,.hero h1,.section-title,.contact-title,.featured-big{font-family:var(--font-display);font-weight:600;letter-spacing:-.01em}
.hero h1{font-weight:600;letter-spacing:-.025em}
.hero .subhead,.section-kicker,.quote-band blockquote,.quote-band cite{font-family:var(--font-display)}
.smallcaps,.btn,.site-navbar .nav-link,.footer-nav a,.subscribe .btn{font-family:var(--font-ui)}
.script,.footer-hand{font-family:var(--font-script)}

/* Navbar spacing more closely follows the reference. */
.site-navbar .container{display:flex;align-items:center}
.site-navbar .navbar-brand{display:flex;align-items:center;min-height:44px}
.site-navbar .navbar-nav{gap:.08rem}
.site-navbar .nav-link{display:flex;align-items:center;min-height:46px;font-size:.69rem;font-weight:500;letter-spacing:.045em}
.search-mark{width:34px;height:42px;display:inline-flex;align-items:center;justify-content:center;padding-left:0;font-size:.98rem}

/* Book rows: reserve two title lines consistently so descriptions line up. */
.book-title{font-family:var(--font-display);font-size:1.52rem;font-weight:600;line-height:1.08;min-height:2.16em;margin-bottom:.65rem}
.book-description{font-size:.88rem;line-height:1.48;min-height:5.92em}
.book-meta{font-size:.88rem}
.book-actions .btn{min-height:44px;display:flex;align-items:center;justify-content:center}

/* Footer: true center copyright + balanced icon circles. */
.footer-nav{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:.12rem .28rem}
.footer-nav a{display:inline-flex;align-items:center;min-height:28px;margin:0 .28rem;font-size:.69rem;letter-spacing:.035em}
.socials{display:flex;align-items:center;justify-content:center;gap:.72rem;margin:1.05rem 0 .85rem}
.socials a{width:39px;height:39px;flex:0 0 39px;border:1.25px solid #dbad58;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;padding:0;color:#f0ca79;font-family:initial;font-size:1.04rem;font-weight:400;line-height:1;transition:transform .18s ease,background-color .18s ease,color .18s ease}
.socials a i{display:block;line-height:1;transform:none}
.socials a:hover{background:rgba(214,166,79,.12);color:#ffe1a0;transform:translateY(-1px)}
.footer-bottom{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:end;min-height:38px;margin-top:.2rem;position:relative}
.footer-bottom .copyright{grid-column:2;justify-self:center;text-align:center;white-space:nowrap}
.footer-bottom .footer-hand{grid-column:3;justify-self:end;text-align:right;max-width:230px;font-size:1.28rem;line-height:1.05;letter-spacing:.01em}
.footer-hand{transform:rotate(-3deg)}

/* Iconography and button text sit on the same optical baseline. */
.btn i,.search-mark i,.connect-icon i,.feature-icon i{line-height:1;vertical-align:-.08em}
.btn-gold,.btn-navy,.btn-outline-gold{font-size:.68rem;font-weight:700;letter-spacing:.095em}

@media (max-width:991.98px){
  .site-navbar .nav-link{min-height:40px;padding-top:.5rem!important;padding-bottom:.5rem!important}
  .search-mark{height:36px;justify-content:flex-start;padding-left:.58rem}
  .footer-bottom{grid-template-columns:1fr;gap:.5rem;justify-items:center}
  .footer-bottom .copyright,.footer-bottom .footer-hand{grid-column:1;justify-self:center;text-align:center;white-space:normal}
  .footer-bottom .footer-hand{font-size:1.2rem;max-width:100%}
}
@media (max-width:767.98px){
  body{font-size:14.5px}
  .footer-nav{gap:.2rem .38rem}
  .footer-nav a{margin:.1rem .18rem;min-height:26px}
  .socials{gap:.62rem;margin:.9rem 0}
  .socials a{width:38px;height:38px;flex-basis:38px}
}
@media (max-width:575.98px){
  .book-title{font-size:1.48rem;min-height:0}
  .book-description{font-size:.9rem;min-height:0}
  .socials{gap:.52rem}
  .socials a{width:36px;height:36px;flex-basis:36px;font-size:.98rem}
}

/* ========================================================================
   V4 UI POLISH — softer corners, better card spacing, cleaner visual rhythm
   ======================================================================== */
:root{
  --radius-xs:8px;
  --radius-sm:12px;
  --radius-md:16px;
  --radius-lg:22px;
  --card-pad:1.35rem;
  --card-shadow:0 10px 30px rgba(36,28,18,.08);
  --card-shadow-hover:0 15px 38px rgba(36,28,18,.13);
}

/* Consistent rounded controls */
.btn-gold,.btn-navy,.btn-outline-gold,
.contact-form .form-control,.contact-form .form-select,
.subscribe .form-control,.subscribe .btn{
  border-radius:10px;
}
.btn-gold,.btn-navy,.btn-outline-gold{
  padding:.84rem 1.22rem;
  transition:transform .18s ease,box-shadow .18s ease,background-color .18s ease;
}
.btn-gold:hover,.btn-navy:hover,.btn-outline-gold:hover{
  transform:translateY(-1px);
  box-shadow:0 7px 16px rgba(3,24,42,.13);
}

/* Placeholders/images: rounded everywhere except full-width background bands. */
.logo-slot{border-radius:10px}
.book-cover-slot,.poetry-cover-slot,.story-slot,.music-slot,.about-collage-slot{
  border-radius:14px;
}
.hero-image-slot,.banner-image-slot,.subscribe-image-slot{border-radius:0}
.hero-image-slot .slot-label,.banner-image-slot .slot-label,.subscribe-image-slot .slot-label{
  border-radius:8px;
}

/* More generous section rhythm without changing the reference proportions. */
.section-pad{padding:2.65rem 0}
.section-kicker{margin-bottom:1.9rem}

/* BOOKS — each item becomes a polished, evenly-spaced card.
   Existing fixed title/description heights are preserved so all rows align. */
.book-grid{--bs-gutter-x:1.45rem;--bs-gutter-y:1.6rem}
.book-item{
  background:rgba(255,255,255,.36);
  border:1px solid rgba(84,60,30,.13);
  border-radius:18px;
  padding:1.3rem 1.15rem 1.2rem;
  box-shadow:var(--card-shadow);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.book-item:hover{
  transform:translateY(-3px);
  box-shadow:var(--card-shadow-hover);
  border-color:rgba(214,166,79,.34);
}
.book-media-wrap{margin-bottom:1.15rem}
.book-title{margin-bottom:.7rem}
.book-description{padding:0 .2rem;margin-bottom:.8rem}
.book-meta{margin:.15rem 0 .95rem}
.book-actions{gap:.6rem!important}
.book-actions .btn{border-radius:10px}

/* General story/content cards */
.soft-card{
  border-radius:16px;
  border-color:rgba(89,61,27,.13);
  box-shadow:var(--card-shadow);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.soft-card:hover{
  transform:translateY(-3px);
  box-shadow:var(--card-shadow-hover);
  border-color:rgba(214,166,79,.3);
}
.soft-card .card-body{padding:1.35rem 1.35rem 1.45rem}
.soft-card .story-slot,.soft-card .image-slot{border-radius:0}
.soft-card h3,.soft-card h4{margin-bottom:.65rem}
.soft-card p:last-of-type{margin-bottom:1rem}

/* Poetry notes */
.poem-note{
  border-radius:16px;
  padding:1.45rem 1.4rem 1.35rem;
  min-height:265px;
  box-shadow:var(--card-shadow);
  transition:transform .2s ease,box-shadow .2s ease;
}
.poem-note:hover{transform:translateY(-3px);box-shadow:var(--card-shadow-hover)}
.poem-note h4{margin-bottom:.8rem}

/* Music rows: more separation and breathing room. */
.line-row{
  border:1px solid rgba(19,40,58,.11)!important;
  border-radius:15px;
  padding:1.1rem 1.15rem;
  margin-bottom:.9rem;
  background:rgba(255,255,255,.27);
  box-shadow:0 5px 16px rgba(40,30,16,.045);
}
.line-row:last-child{margin-bottom:0}
.line-row .btn{border-radius:9px}
.play-circle{width:38px;height:38px;flex-basis:38px}

/* Feature strips: give each item its own comfortable area. */
.feature-strip{padding:2rem 0}
.feature-strip .row{--bs-gutter-x:1rem;--bs-gutter-y:1rem}
.feature-item{
  min-height:140px;
  padding:1.25rem 1.15rem;
  border:1px solid rgba(20,39,54,.1);
  border-radius:14px;
  background:rgba(255,255,255,.23);
}
.feature-item+.feature-item{border-left:1px solid rgba(20,39,54,.1)}
.feature-item h4{margin:.7rem 0 .4rem}

/* About/contact surfaces */
.life-card{
  padding:1.55rem;
  border-radius:16px;
  box-shadow:var(--card-shadow);
}
.life-line{gap:1rem;margin:.95rem 0}
.contact-form{
  padding:1.5rem;
  border:1px solid rgba(89,61,27,.12);
  border-radius:16px;
  background:rgba(255,255,255,.24);
  box-shadow:0 7px 24px rgba(40,30,16,.055);
}
.contact-form .form-control,.contact-form .form-select{padding:.82rem 1rem}
.connect-row{
  margin:.8rem 0;
  padding:.95rem 1rem;
  border-radius:14px;
  background:rgba(255,255,255,.22);
  border:1px solid rgba(89,61,27,.09);
}
.connect-icon{box-shadow:0 5px 15px rgba(76,53,23,.12)}

/* Subscribe: less cramped on every breakpoint. */
.subscribe{padding:2rem 0}
.subscribe p{margin-bottom:1.15rem}
.subscribe .input-group{gap:.45rem}
.subscribe .form-control{border-radius:10px!important}
.subscribe .btn{border-radius:10px!important}

/* Footer icons get a slightly softer, premium treatment. */
.socials{gap:.82rem;margin:1.15rem 0 .95rem}
.socials a{
  width:42px;height:42px;flex-basis:42px;
  border-radius:50%;
  background:rgba(255,255,255,.025);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025);
}
.socials a:hover{transform:translateY(-2px);box-shadow:0 6px 14px rgba(0,0,0,.16)}

@media (max-width:991.98px){
  .section-pad{padding:2.25rem 0}
  .book-item{padding:1.2rem 1rem 1.1rem}
  .feature-item{min-height:0}
}

@media (max-width:767.98px){
  .book-grid{--bs-gutter-y:1.2rem}
  .soft-card .card-body{padding:1.2rem}
  .line-row{padding:1rem;margin-bottom:.75rem}
  .contact-form{padding:1.2rem}
  .feature-strip{padding:1.6rem 0}
  .feature-item{padding:1.1rem}
  .socials a{width:40px;height:40px;flex-basis:40px}
}

@media (max-width:575.98px){
  .section-pad{padding:1.9rem 0}
  .book-item{border-radius:16px;padding:1.15rem .95rem 1rem}
  .book-media-wrap{margin-bottom:.9rem}
  .book-title{margin-bottom:.55rem}
  .book-description{margin-bottom:.65rem}
  .book-meta{margin-bottom:.8rem}
  .poem-note{min-height:0;padding:1.25rem}
  .life-card,.contact-form{border-radius:14px}
  .connect-row{padding:.85rem}
  .subscribe{padding:1.65rem 0}
  .socials{gap:.62rem}
  .socials a{width:38px;height:38px;flex-basis:38px}
}

/* -----------------------------------------------------------------------
   ABOUT — "THE HEART BEHIND THE NAME" HEIGHT PASS (v5)
   Match the reference banner's 1536 × 390 proportion on desktop instead of
   holding the section to the old short fixed height. The content stays
   vertically centered and mobile gets enough room for comfortable wrapping.
------------------------------------------------------------------------ */
.about-heart-band{
  min-height:0;
  aspect-ratio:1536 / 390;
  display:flex;
  align-items:center;
  padding:2.4rem 0;
}
.about-heart-band > .container{width:100%}
.about-heart-band h2{margin-bottom:.35rem}
.about-heart-band p{line-height:1.6;margin-bottom:1rem}

@media (max-width:991.98px){
  .about-heart-band{
    aspect-ratio:auto;
    min-height:330px;
    padding:3rem 0;
  }
}
@media (max-width:767.98px){
  .about-heart-band{min-height:310px;padding:2.6rem 0}
  .about-heart-band .col-lg-6{max-width:680px;margin-inline:auto}
}
@media (max-width:575.98px){
  .about-heart-band{min-height:290px;padding:2.35rem 0}
}

/* ========================================================================
   V6 FINAL HOME — original supplied home composition + approved v5 system
   ======================================================================== */
.home-page{
  background:var(--navy);
}

/* The original home uses Playfair/Lato, while navigation/footer retain the
   approved v5 Montserrat/Cormorant/Libre/Caveat system. */
.home-original-hero,
.home-featured-books,
.home-content-grid,
.home-newsletter{
  --home-display:'Playfair Display', Georgia, 'Times New Roman', serif;
  --home-body:'Lato', Arial, sans-serif;
  --home-script:'Cormorant Garamond', Georgia, serif;
}

/* ORIGINAL HERO --------------------------------------------------------- */
.home-original-hero{
  position:relative;
  isolation:isolate;
  min-height:580px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:#0b1426;
}
.home-hero-image-slot{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
  border-radius:0;
  z-index:-3;
  background:#15324b;
}
.home-hero-image-slot img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
}
.home-hero-image-slot .slot-label{
  position:absolute;
  left:1rem;
  bottom:.9rem;
  border-radius:8px;
  background:rgba(2,19,34,.72);
  color:#f0ce86;
}
.home-hero-overlay{
  position:absolute;
  inset:0;
  z-index:-2;
  background:rgba(11,20,38,.38);
}
.home-original-hero-content{
  min-height:580px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
  padding:3.25rem 1.5rem;
  color:var(--text-cream,#e8dcc8);
}
.home-original-hero h1{
  font-family:var(--home-display);
  font-size:clamp(3rem,5vw,4.6rem);
  font-weight:500;
  line-height:1.06;
  letter-spacing:-.025em;
  color:#d8b568;
  margin:0 0 .65rem;
  text-shadow:0 2px 20px rgba(0,0,0,.52);
}
.home-hero-subtitle{
  font-family:var(--home-script);
  font-size:clamp(1.7rem,3vw,2.45rem);
  font-style:italic;
  font-weight:500;
  line-height:1.12;
  color:#dfbd75;
  margin:0 0 1.15rem;
  text-shadow:0 2px 12px rgba(0,0,0,.45);
}
.home-hero-description{
  font-family:var(--home-body);
  font-size:clamp(1rem,1.45vw,1.12rem);
  font-weight:300;
  line-height:1.72;
  color:#f2e8d9;
  max-width:470px;
  margin:0 auto 2rem;
  opacity:.96;
}
.home-original-hero .btn{
  min-width:170px;
  border-radius:10px;
}

/* FEATURED BOOKS -------------------------------------------------------- */
.home-featured-books{
  position:relative;
  background:
    radial-gradient(circle at 15% 8%,rgba(255,255,255,.42),transparent 28%),
    linear-gradient(rgba(255,255,255,.11),rgba(255,255,255,.11)),
    var(--paper);
  padding:3.4rem 0 3.8rem;
}
.home-section-heading{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:1rem;
  margin-bottom:2.65rem;
}
.home-section-heading h2{
  margin:0;
  font-family:var(--home-display);
  font-size:clamp(1.45rem,2.1vw,1.75rem);
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--navy);
  text-align:center;
  white-space:nowrap;
}
.home-heading-line{
  width:80px;
  max-width:8vw;
  height:1px;
  background:rgba(4,29,49,.42);
  position:relative;
  flex:0 1 80px;
}
.home-featured-book-card{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  padding:1.15rem;
  border:1px solid rgba(89,61,27,.12);
  border-radius:18px;
  background:rgba(255,255,255,.27);
  box-shadow:0 10px 30px rgba(36,28,18,.08);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.home-featured-book-card:hover{
  transform:translateY(-3px);
  box-shadow:0 15px 38px rgba(36,28,18,.13);
  border-color:rgba(214,166,79,.32);
}
.home-book-cover-slot{
  width:min(100%,280px);
  aspect-ratio:280/300;
  border-radius:14px;
  box-shadow:0 8px 24px rgba(0,0,0,.14);
  background:#eee5d7;
}
.home-book-cover-slot img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
}
.home-book-copy{
  display:flex;
  flex-direction:column;
  align-items:center;
  flex:1;
  width:100%;
  padding:.95rem .35rem .15rem;
}
.home-book-copy h3{
  font-family:var(--home-display);
  font-size:1.88rem;
  font-weight:600;
  line-height:1.1;
  color:var(--navy);
  margin:0 0 .65rem;
}
.home-book-copy p{
  font-family:var(--home-body);
  font-size:1rem;
  line-height:1.55;
  color:#555;
  margin:0 0 1rem;
}
.home-book-copy .btn{margin-top:auto}
.home-book-copy-empty{min-height:164px}

/* FOUR ORIGINAL CONTENT PANELS ----------------------------------------- */
.home-content-panel{
  position:relative;
  isolation:isolate;
  min-height:420px;
  overflow:hidden;
  display:flex;
  align-items:stretch;
  background:#0b2035;
}
.home-panel-image-slot{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
  border-radius:0;
  z-index:-3;
  background:#17344d;
}
.home-panel-image-slot img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
}
.home-panel-image-slot .slot-label{
  position:absolute;
  left:1rem;
  bottom:.9rem;
  border-radius:8px;
  background:rgba(2,19,34,.72);
  color:#f0ce86;
}
.home-panel-overlay{
  position:absolute;
  inset:0;
  z-index:-2;
  background:linear-gradient(90deg,rgba(4,22,39,.82),rgba(4,22,39,.56));
}
.home-panel-content{
  width:100%;
  padding:3rem clamp(2rem,5vw,4rem) 3.25rem;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  color:#f2e8d9;
}
.home-panel-content h3{
  font-family:var(--home-display);
  font-size:clamp(1.6rem,2.5vw,2rem);
  font-weight:600;
  letter-spacing:.055em;
  text-transform:uppercase;
  color:#e2b866;
  margin:0 0 .9rem;
}
.home-panel-subtitle{
  font-family:var(--home-script);
  font-size:clamp(1.28rem,2vw,1.55rem);
  font-style:italic;
  line-height:1.2;
  color:#f0e1ca;
  margin:0 0 1.45rem;
}
.home-panel-list{
  width:100%;
  max-width:460px;
  margin:0 0 1.4rem;
  font-family:var(--home-body);
  font-size:.98rem;
  line-height:1.4;
}
.home-panel-list li{
  display:flex;
  align-items:center;
  gap:.72rem;
  margin-bottom:.78rem;
  color:#f0e5d5;
}
.home-panel-list li i{
  width:24px;
  height:24px;
  flex:0 0 24px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#e2b866;
}
.home-panel-list-spacious li{
  padding-left:.1rem;
  margin-bottom:.88rem;
}
.home-content-panel .btn{
  border-radius:10px;
  margin-top:.15rem;
}

/* NEWSLETTER ------------------------------------------------------------ */
.home-newsletter{
  min-height:260px;
  display:flex;
  align-items:center;
  padding:3.2rem 0;
}
.home-newsletter h3{
  font-family:var(--home-display);
  font-size:clamp(1.75rem,2.6vw,2.15rem);
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#e2b866;
  margin-bottom:.55rem;
}
.home-newsletter p{
  font-family:var(--home-script);
  font-size:1.25rem;
  font-style:italic;
}
.home-newsletter .form-control{
  font-family:var(--home-body);
}

/* RESPONSIVE ------------------------------------------------------------ */
@media (max-width:1199.98px){
  .home-original-hero{min-height:540px}
  .home-original-hero-content{min-height:540px}
  .home-content-panel{min-height:400px}
}

@media (max-width:991.98px){
  .home-original-hero{
    min-height:500px;
  }
  .home-original-hero-content{
    min-height:500px;
    padding-block:4rem;
  }
  .home-featured-books{padding:3rem 0 3.2rem}
  .home-book-copy-empty{min-height:0}
  .home-content-panel{min-height:390px}
  .home-panel-content{padding:2.75rem 2rem 3rem}
}

@media (max-width:767.98px){
  .home-original-hero{
    min-height:470px;
  }
  .home-original-hero-content{
    min-height:470px;
    padding:3.5rem 1.15rem;
  }
  .home-original-hero h1{font-size:clamp(2.7rem,11vw,3.5rem)}
  .home-section-heading{gap:.7rem;margin-bottom:2rem}
  .home-section-heading h2{font-size:1.25rem;letter-spacing:.08em;white-space:normal}
  .home-heading-line{max-width:52px}
  .home-featured-books{padding:2.5rem 0 2.7rem}
  .home-featured-book-card{padding:1rem}
  .home-content-panel{min-height:370px}
  .home-panel-content{padding:2.45rem 1.5rem 2.7rem}
  .home-panel-content h3{letter-spacing:.035em}
  .home-newsletter{min-height:0;padding:2.6rem 0}
}

@media (max-width:575.98px){
  .home-original-hero{
    min-height:440px;
  }
  .home-original-hero-content{
    min-height:440px;
    padding:3rem 1rem;
  }
  .home-original-hero .btn{width:100%;max-width:250px}
  .home-book-cover-slot{width:min(100%,300px)}
  .home-featured-book-card{max-width:340px;margin-inline:auto}
  .home-content-panel{min-height:350px}
  .home-panel-content{padding:2.2rem 1.25rem 2.45rem}
  .home-panel-list{font-size:.94rem}
  .home-newsletter .input-group{display:flex;flex-direction:column;gap:.6rem}
  .home-newsletter .input-group>.form-control,
  .home-newsletter .input-group>.btn{width:100%;border-radius:10px!important}
}


/* ========================================================================
   V7 REAL ASSET PASS — supplied artwork inserted without cropping
   ======================================================================== */
.image-slot.has-image{
  background:transparent;
  border:0;
}
.image-slot.has-image img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
}

/* Use the supplied hero artwork's native ratio on desktop so no pixels are cut. */
.hero-with-exact-asset{min-height:0}
.hero-stories{aspect-ratio:2172/573}
.hero-poetry{aspect-ratio:2167/719}

/* Supplied panoramic quote artwork also keeps its native ratio on wide screens. */
.quote-band-stories{min-height:190px;aspect-ratio:2172/347}
.quote-band-poetry{min-height:190px;aspect-ratio:2508/374}

/* The supplied music thumbnails are slightly wider than 16:9; preserve them. */
.music-slot.has-image{aspect-ratio:1684/873}

/* Keep transparent PNGs and photographs visually clean inside rounded UI. */
.story-slot.has-image,.music-slot.has-image,.poetry-cover-slot.has-image{
  background:transparent;
}

@media (max-width:991.98px){
  /* On tablet/mobile the layout intentionally separates artwork from text.
     Contain is retained so the full supplied image remains visible. */
  .hero-with-exact-asset{aspect-ratio:auto;min-height:0}
  .quote-band-stories,.quote-band-poetry{aspect-ratio:auto;min-height:180px}
}
@media (max-width:575.98px){
  .quote-band-stories,.quote-band-poetry{min-height:160px}
}

/* ========================================================================
   V8 COMPLETE SUPPLIED ARTWORK PASS
   ======================================================================== */
.logo-slot.has-image{width:220px;height:54px;aspect-ratio:auto;border:0;background:transparent;box-shadow:none}
.logo-slot.has-image img{width:100%;height:100%;object-fit:contain;object-position:left center}
.home-original-hero{min-height:0;aspect-ratio:2752/1536}
.home-original-hero-content{min-height:0;height:100%}
.hero-music{aspect-ratio:2169/725}.hero-about{aspect-ratio:2167/634}.hero-contact{aspect-ratio:1983/793}.hero-books{aspect-ratio:2172/629}
.quote-band-music{min-height:190px;aspect-ratio:2176/374}.quote-band-about{min-height:260px;aspect-ratio:2172/545}.quote-band-contact{min-height:190px;aspect-ratio:2161/517}.quote-band-books{min-height:190px;aspect-ratio:2164/435}
.subscribe-about{min-height:145px;aspect-ratio:2172/325}.subscribe-books{min-height:145px;aspect-ratio:2167/268}
.about-collage-slot.has-image{aspect-ratio:1194/1317}.story-slot.has-image{aspect-ratio:1672/941}.music-slot.has-image{aspect-ratio:1684/873}.book-cover-slot.book-cover-bunny-real{aspect-ratio:1183/1471}.book-cover-slot.book-cover-coming-real{aspect-ratio:1123/1438}.home-book-cover-slot.has-image{aspect-ratio:473/528}
.story-slot.has-image,.music-slot.has-image,.about-collage-slot.has-image,.book-cover-slot.has-image,.home-book-cover-slot.has-image,.poetry-cover-slot.has-image{overflow:hidden}
.story-slot.has-image img,.music-slot.has-image img,.about-collage-slot.has-image img,.book-cover-slot.has-image img,.home-book-cover-slot.has-image img,.poetry-cover-slot.has-image img,.hero-image-slot.has-image img,.banner-image-slot.has-image img,.subscribe-image-slot.has-image img,.home-hero-image-slot.has-image img,.home-panel-image-slot.has-image img{object-fit:contain!important;object-position:center!important}
@media (max-width:991.98px){.logo-slot.has-image{width:180px;height:46px}.home-original-hero{aspect-ratio:auto;min-height:0;padding-top:56.25%;overflow:visible}.home-original-hero .home-hero-image-slot{height:auto;aspect-ratio:16/9;bottom:auto}.home-original-hero-content{height:auto;min-height:0;background:#0b1426;padding:2.4rem 1rem}.hero-music,.hero-about,.hero-contact,.hero-books{aspect-ratio:auto}.quote-band-music,.quote-band-about,.quote-band-contact,.quote-band-books,.subscribe-about,.subscribe-books{aspect-ratio:auto}}
@media (max-width:575.98px){.logo-slot.has-image{width:155px;height:42px}.home-original-hero{padding-top:62.5%}.home-original-hero .home-hero-image-slot{aspect-ratio:8/5}}

/* ========================================================================
   HOME CONTENT GRID — locked to the supplied reference
   Only this 2 × 2 section is affected.
   ======================================================================== */
.home-content-grid{
  width:100%;
  overflow:hidden;
  background:#08182a;
}
.home-content-grid > .row{
  margin:0;
}
.home-content-grid .home-content-panel{
  min-height:0;
  height:clamp(360px,20.4vw,430px);
  border-radius:0;
  overflow:hidden;
  background:#08182a;
}
.home-content-grid .home-panel-image-slot{
  inset:0;
  border-radius:0;
  overflow:hidden;
}
.home-content-grid .home-panel-image-slot.has-image img{
  width:100%;
  height:100%;
  object-fit:cover!important;
  object-position:center center!important;
}
.home-content-grid .home-panel-overlay{
  background:linear-gradient(90deg,
    rgba(3,18,33,.76) 0%,
    rgba(3,18,33,.56) 48%,
    rgba(3,18,33,.37) 100%);
}
.home-content-grid .home-panel-content{
  height:100%;
  padding:50px 50px 44px;
  justify-content:flex-start;
  align-items:flex-start;
}
.home-content-grid .home-panel-content h3{
  font-family:var(--home-display);
  font-size:clamp(1.45rem,1.35vw,1.72rem);
  line-height:1.12;
  font-weight:600;
  letter-spacing:.055em;
  text-transform:uppercase;
  color:#e5b65d;
  margin:0 0 16px;
}
.home-content-grid .home-panel-subtitle{
  font-family:var(--home-script);
  font-size:clamp(1.14rem,1.05vw,1.36rem);
  line-height:1.22;
  font-style:italic;
  color:#eadac4;
  margin:0 0 25px;
}
.home-content-grid .home-panel-list{
  width:auto;
  max-width:520px;
  margin:0 0 19px;
  font-family:var(--home-body);
  font-size:clamp(.94rem,.84vw,1.03rem);
  line-height:1.35;
}
.home-content-grid .home-panel-list li{
  min-height:24px;
  margin:0 0 10px;
  gap:10px;
  color:#eee3d4;
}
.home-content-grid .home-panel-list li i{
  width:24px;
  height:24px;
  flex:0 0 24px;
  color:#e5b65d;
}
.home-content-grid .home-panel-list-spacious li{
  padding-left:0;
  margin-bottom:12px;
}
.home-content-grid .home-content-panel .btn{
  min-width:194px;
  padding:13px 28px;
  border-radius:10px;
  margin-top:0;
  font-family:var(--home-body);
  font-size:.76rem;
  font-weight:700;
  letter-spacing:.18em;
  text-transform:uppercase;
}

@media (max-width:1199.98px){
  .home-content-grid .home-content-panel{
    height:380px;
  }
  .home-content-grid .home-panel-content{
    padding:44px 40px 40px;
  }
}
@media (max-width:991.98px){
  .home-content-grid .home-content-panel{
    height:390px;
  }
  .home-content-grid .home-panel-content{
    padding:44px 36px 40px;
  }
}
@media (max-width:575.98px){
  .home-content-grid .home-content-panel{
    height:380px;
  }
  .home-content-grid .home-panel-content{
    padding:36px 24px 32px;
  }
  .home-content-grid .home-panel-content h3{
    font-size:1.35rem;
  }
  .home-content-grid .home-panel-list{
    font-size:.92rem;
  }
  .home-content-grid .home-content-panel .btn{
    min-width:0;
    width:auto;
    padding:12px 22px;
  }
}
