/* =============================
  The Sovereign Miner — styles
============================= */


/* ====== Base / Tokens ====== */
:root{
  --gold:#d9b24a; --charcoal:#111214; --paper:#f4e9d8; --ink:#eae4d6;
  --accent:#2c2c2c; --muted:#9aa3ad;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
.sm-body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:#e9ecef;background:var(--charcoal);line-height:1.65}
img{max-width:100%;display:block}
a{color:#c9d7ff;text-decoration:none}
a:hover{opacity:.9}
.sm-container{max-width:1180px;margin:0 auto;padding:0 24px}

/* ====== Header ====== */
.sm-header{position:sticky;top:0;z-index:40;background:rgba(17,18,20,.85);backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid rgba(255,255,255,.06)}
.sm-header__inner{display:flex;align-items:center;justify-content:space-between;min-height:70px}
.sm-brand{display:flex;align-items:center;gap:10px;color:#fff}
.sm-logo{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:8px;background:linear-gradient(135deg,#2a2a2a,#0f0f0f);font-weight:800;letter-spacing:.5px}
.sm-brand__text{font-family:"Libre Baskerville",serif;font-size:1rem}
.sm-nav{display:flex;gap:16px;align-items:center}

/* Buttons */
.sm-btn{display:inline-block;padding:10px 16px;border-radius:10px;font-weight:700;border:1px solid rgba(255,255,255,.12);transition:transform .15s ease,opacity .2s ease}
.sm-btn:hover{transform:translateY(-1px)}
.sm-btn--gold{background:var(--gold);color:#1b1b1b;border-color:transparent}
.sm-btn--ghost{background:transparent;color:#fff}
.sm-btn--link{background:transparent;border:0;padding:0;color:#fff;text-decoration:underline}
.sm-link{opacity:.85}

/* ====== Hero ====== */
.sm-hero{position:relative;isolation:isolate;min-height:78vh;display:flex;align-items:center}
/* style.css */
/* DEBUG: show the hero image clearly */
/* FINAL: subtle overlay + light tone */
.sm-hero__media{
  position:absolute; inset:0;
  background:
    radial-gradient(1200px 600px at 10% 10%, rgba(217,178,74,.20), transparent 60%),
    url('/images/hero_parchment.jpg') center/cover no-repeat;
  filter:brightness(.75); opacity:.9; z-index:-2;
}
.sm-hero::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.55));
  z-index:-1;
}


.sm-hero__grid{display:grid;grid-template-columns:1.2fr .8fr;gap:36px;align-items:center}
.sm-hero__copy h1{font-family:"Libre Baskerville",serif;font-size:clamp(28px,5vw,48px);line-height:1.15;color:#fff;margin-bottom:10px}
.sm-hero__copy p{max-width:720px;color:#e6e6e6}
.sm-actions{margin-top:16px;display:flex;gap:12px;flex-wrap:wrap}

/* Ensure the book area has perspective and enough space */
.sm-hero__book{
  display:grid; place-items:center;
  perspective: 1200px;          /* 3D depth */
  min-height: 460px;            /* prevents grid from collapsing */
  overflow: visible;            /* allow spine to sit outside */
}

/* Book wrapper: size + 3D pose */
.book3d{
  position: relative;
  width: 320px;                 /* was min(300px,86%) — make it fixed for now */
  height: 440px;                /* taller so it reads like a book */
  transform: rotateY(-18deg) rotateX(4deg);
  transform-style: preserve-3d;
  transition: transform .35s ease;
}
.book3d:hover{ transform: rotateY(-14deg) rotateX(0deg) translateY(-2px); }

/* Spine (left edge with gold stripe) */
.book3d__spine{
  position:absolute; left:-22px; top:0; height:100%; width:22px;
  background:linear-gradient(180deg,#4b2c17,#2d1a0e);
  border-top-left-radius:8px; border-bottom-left-radius:8px;
  box-shadow:inset -6px 0 12px rgba(255,255,255,.04);
  z-index: 0;
}
.book3d__spine::after{
  content:""; position:absolute; top:10px; bottom:10px; left:7px; width:3px;
  background:linear-gradient(180deg,#f5d76e,#d9b24a,#fff2c1,#a67c00);
  border-radius:2px; opacity:.9;
}

/* Leather cover with inset gold border */
.book3d__cover{
  position:relative; height:100%;
  border-radius:8px;
  background:
    url('/images/leather-texture.jpg') center/cover no-repeat,
    linear-gradient(135deg,#6b4226,#3e2717);
  background-blend-mode:overlay;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding:24px;
  color:#f5e9dc;
  box-shadow:0 12px 42px rgba(0,0,0,.50), inset 0 0 20px rgba(255,255,255,.08);
  z-index: 1;                 /* above spine */
  overflow: visible;
}

/* Inset gold border (offset from the edge) */
.book3d__cover::after{
  content:""; position:absolute; inset:10px;   /* offset inward */
  border:2.5px solid;
  border-image:linear-gradient(135deg,#f5d76e,#d9b24a,#fff2c1,#a67c00) 1;
  border-radius:6px; pointer-events:none;
}

/* Title/author as gold “foil” text */
.book3d__title, .book3d__author{
  background:linear-gradient(135deg,#f5d76e 0%,#d9b24a 40%,#fff2c1 60%,#a67c00 100%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; text-fill-color:transparent;
}
.book3d__title{ font-family:"Libre Baskerville",serif; font-size:1.55rem; margin-bottom:6px; position:relative; }
.book3d__author{ opacity:.95; }

/* Optional subtle shimmer */
.book3d__title::after{
  content:""; position:absolute; top:0; left:-60%; width:200%; height:100%;
  background:linear-gradient(120deg,transparent 0%,rgba(255,255,255,.55) 50%,transparent 100%);
  transform:skewX(-20deg); animation:sm-foil 5s linear infinite; opacity:.28;
}
@keyframes sm-foil{ 0%{left:-60%} 100%{left:100%} }
.book3d__title{font-family:"Libre Baskerville",serif;font-size:1.45rem;margin-bottom:6px}
.book3d__author{opacity:.85}

.sm-scroll{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);color:#cfcfcf;opacity:.7}

/* ====== Sections ====== */
.sm-section{padding:72px 0;background:transparent}
.sm-section--alt{background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.02))}
.sm-eyebrow{font-family:"Libre Baskerville",serif;font-size:1.6rem;color:#fff;margin-bottom:18px}

.sm-grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.sm-card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:18px;color:#eaeaea}
.sm-card h3{font-family:"Libre Baskerville",serif;margin-bottom:8px;color:#fff}

/* Trinity */
.sm-trinity{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:10px}
.sm-trinity__item{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:18px;text-align:center}
.sm-trinity__icon{width:44px;height:44px;border-radius:10px;margin:0 auto 8px;display:grid;place-items:center;background:rgba(255,255,255,.06);font-weight:800}
.sm-badge{background:rgba(217,178,74,.18);color:#ffe7a2;border:1px solid rgba(217,178,74,.35);padding:2px 8px;border-radius:999px;font-size:.85rem}
.sm-cta-center{display:flex;justify-content:center;margin-top:18px}

/* Quote strip */
.sm-quote{background:linear-gradient(180deg,#0f0f0f,#111);padding:44px 0;border-top:1px solid rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.06)}
.sm-quote blockquote{max-width:820px;margin:0 auto;color:#eae4d6;text-align:center;font-family:"Libre Baskerville",serif;font-size:1.4rem}
.sm-quote footer{margin-top:6px;opacity:.7}

/* About */
.sm-about{
  display:grid;grid-template-columns:1.1fr .9fr;gap:22px;align-items:center
}
.sm-about__image{
  position:relative; height:320px; /* a bit taller for impact */
  border-radius:14px; overflow:hidden;
  background:
    radial-gradient(600px 220px at 20% 20%, rgba(217,178,74,.25), transparent 60%),
    url('/images/sovereignminer_og_image.jpg') center/cover no-repeat;
  filter:grayscale(.15) brightness(.9);
  box-shadow:0 10px 30px rgba(0,0,0,.35), inset 0 0 0 1px rgba(255,255,255,.06);
}
.sm-about__image::after{
  content:""; position:absolute; inset:0;
  background:radial-gradient(120% 120% at 70% 40%, transparent 40%, rgba(0,0,0,.25) 100%);
  pointer-events:none;
}

/* Footer */
.sm-footer{border-top:1px solid rgba(255,255,255,.06);background:#0e0f11}
.sm-footer__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:38px 0;color:#e7e7e7}
.sm-footer h5{font-family:"Libre Baskerville",serif;margin-bottom:8px;color:#fff}
.sm-footer li{margin:6px 0}
.sm-footer__bar{border-top:1px dashed rgba(255,255,255,.15);padding:12px 0;color:#aab0b6;font-size:.95rem}

/* ====== Responsive ====== */
@media (max-width:980px){
  .sm-hero__grid{grid-template-columns:1fr}
  .sm-hero{min-height:68vh}
  .sm-grid3,.sm-trinity,.sm-about{grid-template-columns:1fr}
  .book3d{margin-top:8px}
}
/***** Compact hero *****/
.sm-hero--compact{min-height:42vh;display:flex;align-items:center}
.sm-hero__compact{padding:48px 24px}
.sm-hero--compact .sm-hero__media{filter:brightness(.6)}


/***** Preorder layout *****/
.sm-pre{display:grid;grid-template-columns:1.1fr .9fr;gap:24px}
.sm-pre__card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:22px}
.sm-pre__side{display:grid;gap:18px}


/***** Form *****/
.sm-form{margin-top:8px}
.sm-form__grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.sm-field{display:flex;flex-direction:column;gap:6px}
.sm-field span{font-size:.95rem;color:#cfd5db}
.sm-field--full{grid-column:1/-1}
.sm-input{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);border-radius:10px;padding:12px 14px;color:#e9ecef}
.sm-input--area{resize:vertical}
.sm-submit{grid-column:1/-1;justify-self:start;margin-top:2px}
.sm-help{color:#aab0b6;margin-top:10px}
.sm-list{margin:8px 0 0 18px}


@media (max-width:980px){
.sm-pre{grid-template-columns:1fr}
.sm-form__grid{grid-template-columns:1fr}
}

.peek-ribbon{padding:40px 0;background:#111;color:#eee;text-align:center}
.peek-ribbon h2{margin:0 0 14px;font-weight:700;letter-spacing:.5px}
.peek-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:980px;margin:0 auto}
.peek-card{display:block;padding:16px 12px;border:1px solid #2a2a2a;border-radius:10px;background:#171717}
.peek-card:hover{border-color:#39FF14;box-shadow:0 0 0 1px #39FF1420}
@media(max-width:820px){.peek-grid{grid-template-columns:1fr}}
