/* =========================================================
   HOME PAGE (index.html) — styles specific to this page.
   Shared chrome (nav/buttons/footer/etc.) lives in base.css.
   ========================================================= */

/* ===== HERO ===== */
.hero{background:var(--ink); color:var(--ink-text); padding:96px 0 0; position:relative; overflow:hidden;}
.hero .wrap{display:grid; grid-template-columns:1.1fr 1fr; gap:56px; align-items:center; padding-bottom:80px;}
.hero h1{font-size:48px; margin-bottom:20px; color:var(--ink-text);}
.hero h1 em{font-style:normal; color:var(--brass);}
.hero .tagline{
  font-family:'IBM Plex Mono',monospace; font-size:13.5px; color:#C7CEDF;
  margin-bottom:22px; padding-left:14px; border-left:2px solid var(--brass);
}
.hero p.lead{font-size:16.5px; color:var(--ink-mute); max-width:500px; margin-bottom:34px;}
.hero-cta{display:flex; gap:14px; margin-bottom:8px;}

.seal-wrap{position:relative; display:flex; justify-content:center; align-items:center; height:420px;}
.doc-card{
  position:absolute; width:180px; background:var(--paper); color:var(--paper-text);
  border-radius:8px; padding:16px 16px 18px; box-shadow:0 14px 30px rgba(0,0,0,0.35);
  border:1px solid var(--paper-line);
}
.doc-card .tab{
  font-family:'IBM Plex Mono',monospace; font-size:9.5px; color:var(--brass-dark);
  letter-spacing:0.04em; margin-bottom:8px; text-transform:uppercase;
}
.doc-card .line{height:6px; background:var(--paper-2); border-radius:3px; margin-bottom:6px;}
.doc-card .line.short{width:60%;}
.doc-card .stamp-mini{
  margin-top:10px; display:inline-flex; align-items:center; gap:5px;
  font-family:'IBM Plex Mono',monospace; font-size:9.5px; color:var(--forest);
}
.doc-1{transform:rotate(-9deg) translate(-108px,-38px);}
.doc-2{transform:rotate(7deg) translate(96px,10px);}
.seal{position:relative; z-index:2; width:220px; height:220px;}
@keyframes rotate360{to{transform:rotate(360deg);}}
.seal .ring{animation:rotate360 40s linear infinite; transform-origin:110px 110px;}
@media (prefers-reduced-motion:reduce){.seal .ring{animation:none;}}

/* ===== MARQUEE STRIP ===== */
.marquee-strip{background:var(--forest-dark); border-top:1px solid var(--ink-line); border-bottom:1px solid var(--ink-line); overflow:hidden; padding:14px 0;}
.marquee-track{display:flex; width:max-content; gap:0; animation:scroll-left 34s linear infinite;}
@keyframes scroll-left{from{transform:translateX(0);} to{transform:translateX(-50%);}}
@media (prefers-reduced-motion:reduce){.marquee-track{animation:none;}}
.marquee-track span{
  font-family:'IBM Plex Mono',monospace; font-size:13px; color:#D6DEF2;
  padding:0 22px; white-space:nowrap; display:flex; align-items:center; gap:22px;
}
.marquee-track span::after{content:"•"; color:var(--brass); margin-left:22px;}

/* ===== ABOUT (teaser) ===== */
.about-grid{display:grid; grid-template-columns:1.3fr 1fr; gap:56px; align-items:start;}
.about-grid p{color:var(--paper-mute); margin-bottom:16px; font-size:15.5px;}
.about-grid p:last-of-type{margin-bottom:0;}
.pull{
  font-family:'Lora',serif; font-size:19px; font-weight:600; color:var(--paper-text);
  border-left:3px solid var(--brass); padding-left:18px; margin:26px 0; line-height:1.5;
}
.vm-card{background:var(--ink); color:var(--ink-text); border-radius:16px; padding:32px;}
.vm-card h3{font-family:'IBM Plex Mono',monospace; font-size:11.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--brass); font-weight:400; margin-bottom:12px;}
.vm-card .vtext{font-size:15px; color:var(--ink-mute); margin-bottom:26px; padding-bottom:26px; border-bottom:1px solid var(--ink-line);}
.vm-card ol{list-style:none; counter-reset:m;}
.vm-card ol li{counter-increment:m; font-size:14px; color:var(--ink-mute); padding-left:28px; position:relative; margin-bottom:14px;}
.vm-card ol li::before{content:counter(m,decimal-leading-zero); position:absolute; left:0; top:0; font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--brass);}
.vm-card ol li:last-child{margin-bottom:0;}

/* ===== WHY CHOOSE (teaser, ink) ===== */
.why-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--ink-line); border:1px solid var(--ink-line); border-radius:14px; overflow:hidden;}
.why-card{background:var(--ink); padding:30px 26px;}
.why-card:hover{background:var(--ink-2);}
.why-card .num{font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--brass); margin-bottom:16px;}
.why-card h3{font-size:16.5px; margin-bottom:9px; font-weight:600;}
.why-card p{font-size:13.5px; color:var(--ink-mute);}

/* ===== SERVICES (teaser, folder style) ===== */
.svc-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.svc-card{
  background:var(--paper); border:1px solid var(--paper-line); border-radius:0 10px 10px 10px;
  padding:28px 24px 26px; position:relative;
}
.svc-card::before{
  content:attr(data-tab); position:absolute; top:-15px; left:0;
  background:var(--forest); color:#E8ECF7; font-family:'IBM Plex Mono',monospace;
  font-size:10px; letter-spacing:0.05em; padding:5px 12px; border-radius:6px 6px 0 0;
}
.svc-card h3{font-size:17.5px; margin:6px 0 10px; font-weight:600;}
.svc-card p{font-size:14px; color:var(--paper-mute);}

/* ===== VALUES (ink strip) ===== */
.values-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:22px;}
.value{text-align:center; padding:20px 10px;}
.value .vring{
  width:56px; height:56px; border-radius:50%; border:1.4px solid var(--brass);
  display:flex; align-items:center; justify-content:center; margin:0 auto 18px;
  font-family:'Lora',serif; font-weight:600; color:var(--brass); font-size:18px;
}
.value h3{font-size:15.5px; margin-bottom:8px;}
.value p{font-size:13px; color:var(--ink-mute);}

/* ===== RESPONSIVE (home only) ===== */
@media (max-width:980px){
  .hero .wrap{grid-template-columns:1fr;}
  .seal-wrap{height:300px; order:-1;}
  .about-grid{grid-template-columns:1fr;}
  .why-grid{grid-template-columns:repeat(2,1fr);}
  .svc-grid{grid-template-columns:repeat(2,1fr);}
  .values-grid{grid-template-columns:repeat(3,1fr);}
}
@media (max-width:600px){
  .hero h1{font-size:33px;}
  .why-grid{grid-template-columns:1fr;}
  .svc-grid{grid-template-columns:1fr;}
  .values-grid{grid-template-columns:repeat(2,1fr);}
  .doc-card{width:140px;}
}