/* ═══════════════════════════════════════════
   ADDITIONY — Shared Stylesheet
   ═══════════════════════════════════════════ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}

:root{
  --white:#FFFFFF;--off:#F8F7F5;--line:#E4E3DF;
  --mid:#C0BEBC;--muted:#8C8A87;--body:#3A3935;--dark:#111110;
  --fd:'Cormorant Garamond',Georgia,serif;
  --fb:'DM Sans',sans-serif;--fm:'DM Mono',monospace;
}

body{font-family:var(--fb);background:var(--white);color:var(--body);
  font-size:15px;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden}

/* ── INTRO (index only) */
#intro{position:fixed;inset:0;background:var(--dark);z-index:9999;
  display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none}
#intro.hide{animation:introOut 0.9s cubic-bezier(.76,0,.24,1) 0.3s forwards}
@keyframes introOut{0%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(-10px)}}
.intro-logo{font-family:var(--fd);font-size:clamp(44px,9vw,100px);font-weight:300;
  letter-spacing:0.25em;text-transform:uppercase;color:var(--white);
  opacity:0;animation:logoIn 1.3s cubic-bezier(.22,1,.36,1) 0.5s forwards}
@keyframes logoIn{0%{opacity:0;letter-spacing:0.55em}100%{opacity:1;letter-spacing:0.25em}}
.intro-line{width:0;height:0.5px;background:rgba(255,255,255,0.18);
  margin-top:2rem;animation:lineGrow 1s ease 0.9s forwards}
@keyframes lineGrow{to{width:130px}}
.intro-sub{font-family:var(--fm);font-size:11px;letter-spacing:0.2em;
  text-transform:uppercase;color:rgba(255,255,255,0.35);margin-top:1.25rem;
  opacity:0;animation:fadeUp 0.8s ease 1.3s forwards}
@keyframes fadeUp{0%{opacity:0;transform:translateY(8px)}100%{opacity:1;transform:translateY(0)}}

/* ── HEADER */
header{position:fixed;top:0;left:0;right:0;z-index:500;height:64px;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 2.5rem;transition:background 0.4s,border-color 0.4s}
header.on-dark{background:transparent;border-bottom:0.5px solid rgba(255,255,255,0.08)}
header.scrolled,header.light{background:rgba(255,255,255,0.96);
  backdrop-filter:blur(10px);border-bottom:0.5px solid var(--line)}
.logo{font-family:var(--fd);font-size:20px;font-weight:400;letter-spacing:0.16em;
  text-transform:uppercase;color:var(--white);text-decoration:none;transition:color 0.3s;cursor:pointer}
header.scrolled .logo,header.light .logo{color:var(--dark)}
nav{display:flex;align-items:center}
.nav-item{font-family:var(--fb);font-size:11px;font-weight:400;letter-spacing:0.11em;
  text-transform:uppercase;color:rgba(255,255,255,0.6);padding:0 1.2rem;height:64px;
  display:inline-flex;align-items:center;border-right:0.5px solid rgba(255,255,255,0.08);
  transition:color 0.2s,background 0.2s;cursor:pointer;
  background:none;border-top:none;border-bottom:none;border-left:none;
  text-decoration:none}
.nav-item:first-of-type,.nav-item:first-child{border-left:0.5px solid rgba(255,255,255,0.08)}
.nav-item:hover{color:var(--white);background:rgba(255,255,255,0.06)}
header.scrolled .nav-item,header.light .nav-item{
  color:var(--muted);border-right-color:var(--line)}
header.scrolled .nav-item:first-of-type,header.scrolled .nav-item:first-child,
header.light .nav-item:first-of-type,header.light .nav-item:first-child{border-left-color:var(--line)}
header.scrolled .nav-item:hover,header.light .nav-item:hover{color:var(--dark);background:var(--off)}
.nav-item.active{color:var(--dark)!important;background:var(--off)!important}
header.on-dark .nav-item.active{color:var(--white)!important;background:rgba(255,255,255,0.1)!important}
.nav-cta{background:var(--white)!important;color:var(--dark)!important;border-color:transparent!important}
.nav-cta:hover{opacity:0.82!important;background:var(--white)!important}

/* ── PAGE HERO (inner pages) */
.page-hero{
  padding:140px 2.5rem 5rem;
  border-bottom:0.5px solid var(--line);
  display:grid;grid-template-columns:200px 1fr;gap:2rem;align-items:end;
  background:var(--white);
}
.ph-index{font-family:var(--fm);font-size:10px;letter-spacing:0.16em;
  text-transform:uppercase;color:var(--muted);padding-bottom:8px;
  border-bottom:0.5px solid var(--line)}
.ph-title{font-family:var(--fd);font-size:clamp(52px,7vw,96px);font-weight:300;
  color:var(--dark);line-height:1.0;letter-spacing:-0.01em}
.ph-title em{font-style:italic;color:var(--muted)}
.ph-subtitle{font-family:var(--fm);font-size:11px;letter-spacing:0.12em;
  text-transform:uppercase;color:var(--muted);margin-top:1.5rem}

/* ── SECTION BASE */
section{border-top:0.5px solid var(--line)}
.sec-head{display:grid;grid-template-columns:200px 1fr;padding:4rem 2.5rem;
  border-bottom:0.5px solid var(--line);gap:2rem;align-items:start}
.sec-label{font-family:var(--fm);font-size:10px;letter-spacing:0.16em;
  text-transform:uppercase;color:var(--muted);padding-top:8px}
.sec-title{font-family:var(--fd);font-size:clamp(40px,5vw,68px);font-weight:300;
  color:var(--dark);line-height:1.05;letter-spacing:-0.01em}
.sec-title em{font-style:italic;color:var(--muted)}

/* ── BODY TEXT HELPERS */
.lead{font-family:var(--fd);font-size:clamp(22px,2.8vw,36px);font-weight:300;
  color:var(--dark);line-height:1.35}
.body-text{font-size:14px;font-weight:300;color:var(--muted);line-height:1.95}
.tag{font-family:var(--fm);font-size:10px;letter-spacing:0.14em;
  text-transform:uppercase;color:var(--muted)}
.mono-label{font-family:var(--fm);font-size:10px;letter-spacing:0.12em;
  text-transform:uppercase;color:var(--muted)}

/* ── TWO COL */
.two-col{display:grid;grid-template-columns:1fr 1fr}
.col-pad{padding:4rem 2.5rem}
.col-pad-r{padding:4rem 2.5rem;border-right:0.5px solid var(--line)}
.col-dark{background:var(--dark)}
.col-off{background:var(--off)}

/* ── FEATURE LIST */
.feat-list{display:flex;flex-direction:column;border-top:0.5px solid var(--line);margin-top:2.5rem}
.feat-item{display:grid;grid-template-columns:32px 1fr;gap:1.5rem;
  align-items:start;padding:1.25rem 0;border-bottom:0.5px solid var(--line)}
.feat-num{font-family:var(--fm);font-size:10px;color:var(--mid);padding-top:2px}
.feat-title{font-size:13px;font-weight:500;color:var(--dark);margin-bottom:4px;letter-spacing:0.03em}
.feat-desc{font-size:12px;color:var(--muted);font-weight:300;line-height:1.7}

/* ── CARD GRID */
.card-grid{display:grid;grid-template-columns:repeat(3,1fr)}
.card{padding:3rem 2.5rem;border-right:0.5px solid var(--line);
  border-bottom:0.5px solid var(--line);display:flex;flex-direction:column;gap:1.25rem}
.card:nth-child(3n){border-right:none}
.card-num{font-family:var(--fm);font-size:10px;color:var(--mid);letter-spacing:0.1em}
.card-name{font-family:var(--fd);font-size:26px;font-weight:300;color:var(--dark);line-height:1.2}
.card-desc{font-size:13px;color:var(--muted);font-weight:300;line-height:1.85;flex:1}
.card-link{font-family:var(--fm);font-size:10px;letter-spacing:0.1em;
  text-transform:uppercase;color:var(--body);text-decoration:none;
  display:inline-flex;align-items:center;gap:8px;transition:gap 0.2s;
  cursor:pointer;border:none;background:none;padding:0;margin-top:0.5rem}
.card:hover .card-link{gap:16px}

/* ── STAT STRIP */
.stat-strip{background:var(--off);padding:3rem 2.5rem;
  display:grid;grid-template-columns:repeat(4,1fr);border-top:0.5px solid var(--line)}
.stat{padding:1.5rem 2rem;border-right:0.5px solid var(--line)}
.stat:last-child{border-right:none}
.stat-n{font-family:var(--fd);font-size:clamp(32px,4vw,52px);font-weight:300;
  color:var(--dark);line-height:1;margin-bottom:4px}
.stat-l{font-family:var(--fm);font-size:10px;letter-spacing:0.1em;
  text-transform:uppercase;color:var(--muted)}

/* ── PROCESS STEPS */
.process{display:flex;flex-direction:column}
.proc-step{display:grid;grid-template-columns:52px 1fr;gap:1.5rem;
  align-items:start;padding:1.75rem 0;border-bottom:0.5px solid var(--line)}
.proc-step:first-child{border-top:0.5px solid var(--line)}
.proc-n{font-family:var(--fd);font-size:36px;font-weight:300;color:var(--mid);line-height:1}
.proc-title{font-size:14px;font-weight:500;color:var(--dark);margin-bottom:6px;letter-spacing:0.04em}
.proc-desc{font-size:13px;color:var(--muted);font-weight:300;line-height:1.75}

/* ── QUOTE BLOCK */
.quote-block{padding:5rem 2.5rem;display:flex;flex-direction:column;justify-content:flex-end;gap:1.5rem}
.quote-text{font-family:var(--fd);font-size:clamp(28px,3.5vw,52px);font-weight:300;
  color:var(--white);line-height:1.2;letter-spacing:-0.01em}
.quote-text em{font-style:italic;color:rgba(255,255,255,0.38)}
.quote-src{font-family:var(--fm);font-size:10px;letter-spacing:0.12em;
  text-transform:uppercase;color:var(--muted)}

/* ── WHITE BOOK SECTION */
.wb-dark{background:var(--dark)}
.wb-left{padding:5rem 2.5rem;border-right:0.5px solid rgba(255,255,255,0.08);
  display:flex;flex-direction:column;justify-content:space-between}
.wb-label{font-family:var(--fm);font-size:10px;letter-spacing:0.16em;
  text-transform:uppercase;color:var(--muted);margin-bottom:2.5rem}
.wb-title{font-family:var(--fd);font-size:clamp(44px,6vw,80px);font-weight:300;
  color:var(--white);line-height:1.0;letter-spacing:-0.01em;margin-bottom:2.5rem}
.wb-title em{font-style:italic;color:rgba(255,255,255,0.32)}
.wb-desc{font-size:14px;font-weight:300;color:var(--muted);line-height:1.85;max-width:400px;margin-bottom:3rem}
.wb-dl{display:inline-flex;align-items:center;gap:16px;font-family:var(--fm);
  font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:var(--white);
  border:0.5px solid rgba(255,255,255,0.25);padding:14px 28px;text-decoration:none;
  transition:background 0.2s;cursor:pointer;background:none}
.wb-dl:hover{background:rgba(255,255,255,0.07)}
.wb-chapter{display:grid;grid-template-columns:60px 1fr auto;align-items:center;
  gap:1.5rem;padding:2rem 2.5rem;border-bottom:0.5px solid rgba(255,255,255,0.07);
  cursor:pointer;transition:background 0.2s;text-decoration:none}
.wb-chapter:hover{background:rgba(255,255,255,0.04)}
.wb-ch-num{font-family:var(--fd);font-size:32px;font-weight:300;color:rgba(255,255,255,0.12);line-height:1}
.wb-ch-title{font-size:14px;font-weight:400;color:var(--white);letter-spacing:0.02em}
.wb-ch-sub{font-family:var(--fm);font-size:10px;letter-spacing:0.08em;color:var(--muted);margin-top:3px}
.wb-ch-arrow{font-size:14px;color:rgba(255,255,255,0.22);transition:color 0.2s}
.wb-chapter:hover .wb-ch-arrow{color:rgba(255,255,255,0.7)}

/* ── CONTACT FORM */
.ct-form{display:flex;flex-direction:column;gap:1.25rem}
.ct-field{display:flex;flex-direction:column;gap:6px}
.ct-label{font-family:var(--fm);font-size:10px;letter-spacing:0.1em;text-transform:uppercase;color:var(--muted)}
.ct-input,.ct-select,.ct-textarea{font-family:var(--fb);font-size:14px;font-weight:300;
  color:var(--dark);background:var(--white);border:0.5px solid var(--line);
  padding:12px 14px;outline:none;transition:border-color 0.2s;width:100%}
.ct-input:focus,.ct-select:focus,.ct-textarea:focus{border-color:var(--dark)}
.ct-input::placeholder,.ct-textarea::placeholder{color:var(--mid)}
.ct-select{appearance:none;cursor:pointer}
.ct-textarea{resize:none;min-height:110px;line-height:1.6}
.ct-btn{font-family:var(--fb);font-size:11px;letter-spacing:0.14em;text-transform:uppercase;
  background:var(--dark);color:var(--white);border:none;padding:14px 32px;
  cursor:pointer;align-self:flex-start;transition:opacity 0.2s;margin-top:0.5rem}
.ct-btn:hover{opacity:0.72}

/* ── CONTACT INFO */
.ct-info{display:flex;flex-direction:column}
.ct-row{display:grid;grid-template-columns:96px 1fr;gap:1rem;
  padding:1.25rem 0;border-bottom:0.5px solid var(--line);align-items:start}
.ct-row:first-child{border-top:0.5px solid var(--line)}
.ct-key{font-family:var(--fm);font-size:10px;letter-spacing:0.1em;
  text-transform:uppercase;color:var(--muted);padding-top:2px}
.ct-val{font-size:13px;color:var(--body);font-weight:300;line-height:1.6}

/* ── FOOTER */
footer{border-top:0.5px solid var(--line);padding:3rem 2.5rem;
  display:grid;grid-template-columns:240px repeat(3,1fr);gap:3rem}
.ft-brand .logo-ft{font-family:var(--fd);font-size:18px;font-weight:400;
  letter-spacing:0.16em;text-transform:uppercase;color:var(--dark);
  text-decoration:none;display:block;margin-bottom:0.75rem;cursor:pointer}
.ft-tagline{font-family:var(--fd);font-size:13px;font-weight:300;
  color:var(--muted);font-style:italic;line-height:1.6}
.ft-col-title{font-family:var(--fm);font-size:10px;letter-spacing:0.12em;
  text-transform:uppercase;color:var(--muted);margin-bottom:1.25rem}
.ft-links{list-style:none;display:flex;flex-direction:column;gap:0.7rem}
.ft-links a{font-size:13px;font-weight:300;color:var(--body);
  text-decoration:none;transition:color 0.2s;cursor:pointer}
.ft-links a:hover{color:var(--dark)}
.ft-bottom{border-top:0.5px solid var(--line);padding:1.5rem 2.5rem;
  display:flex;justify-content:space-between;align-items:center}
.ft-copy{font-family:var(--fm);font-size:10px;letter-spacing:0.08em;color:var(--mid)}
.ft-sns{display:flex;gap:1.75rem}
.ft-sns a{font-family:var(--fm);font-size:10px;letter-spacing:0.1em;
  text-transform:uppercase;color:var(--mid);text-decoration:none;transition:color 0.2s}
.ft-sns a:hover{color:var(--dark)}

/* ── REVEAL ANIMATION */
.reveal{opacity:0;transform:translateY(28px);transition:opacity 0.75s ease,transform 0.75s ease}
.reveal.visible{opacity:1;transform:translateY(0)}

/* ── ABOUT VALUE LIST */
.value-list{display:flex;flex-direction:column}
.val-item{padding:2rem 0;border-bottom:0.5px solid var(--line);
  display:grid;grid-template-columns:52px 1fr;gap:1.5rem;align-items:start}
.val-item:first-child{border-top:0.5px solid var(--line)}
.val-n{font-family:var(--fd);font-size:28px;font-weight:300;color:var(--mid);line-height:1}
.val-title{font-size:13px;font-weight:500;color:var(--dark);letter-spacing:0.04em;margin-bottom:4px}
.val-desc{font-size:12px;color:var(--muted);font-weight:300;line-height:1.7}

/* ── MOBILE */
@media(max-width:900px){
  header{padding:0 1.25rem}
  .nav-item:not(.nav-cta){display:none}
  .page-hero{grid-template-columns:1fr;padding:110px 1.25rem 3rem}
  .sec-head{grid-template-columns:1fr;padding:3rem 1.25rem 2rem}
  .two-col{grid-template-columns:1fr}
  .col-pad,.col-pad-r{padding:3rem 1.25rem;border-right:none}
  .card-grid{grid-template-columns:1fr}
  .card{border-right:none}
  .stat-strip{grid-template-columns:1fr 1fr}
  .stat:nth-child(n+3){border-top:0.5px solid var(--line)}
  footer{grid-template-columns:1fr 1fr;padding:2rem 1.25rem}
  .ft-bottom{padding:1.5rem 1.25rem;flex-direction:column;gap:1rem;align-items:flex-start}
}