/* ============================================================
   NextHill / ARCHIBEAUT — Brand Site Stylesheet
   Concept: "ECM構造美容" — beauty as architecture.
   Palette: pearl silver / champagne gold / dusty light blue
            with royal blue reserved for structural emphasis.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,400&family=Noto+Serif+JP:wght@400;500;600;700&family=Noto+Sans+JP:wght@300;400;500;600;700&family=Jost:wght@400;500;600&display=swap');

:root{
  /* --- palette --- */
  --pearl:        #F4F5F7;   /* base background — pearl silver */
  --pearl-deep:    #E4E7EB;   /* secondary panel silver */
  --pearl-line:    #D3D7DC;   /* hairlines on light bg */
  --ink:           #23262B;   /* primary text, near-black */
  --ink-soft:      #565C66;   /* secondary text */
  --gold:          #C6A466;   /* champagne gold — primary accent */
  --gold-soft:     #E9DBB8;   /* pale gold tint */
  --gold-deep:     #A6803F;   /* pressed / darker gold for contrast on light */
  --blue-dust:     #8EB9D4;   /* logo light blue — unified accent */
  --blue-dust-soft:#DCE9F1;   /* pale logo-blue panel */
  --logo-blue-deep:#5B93BD;   /* deepened logo blue, for readable text on light bg */
  --logo-blue-glow:#D7EBF5;   /* soft glow tint 1 */
  --logo-blue-glow2:#C3E0EE;  /* soft glow tint 2 */
  --royal:         #5C89A0;   /* dusty pearl blue — reserved deep accent (replaces navy) */
  --royal-soft:    #7FA3B6;   /* lighter dusty pearl blue, used for soft text/links on dark bg */
  --royal-shine:   #D8E7ED;   /* pearl shimmer highlight for gradients */
  --royal-gradient: linear-gradient(125deg, #4E7791 0%, #6B93A8 40%, #93B4C4 75%, #C3D9E2 100%);

  /* --- type --- */
  --f-display: 'Cormorant Garamond', 'Noto Serif JP', serif;
  --f-serif:   'Noto Serif JP', serif;
  --f-sans:    'Noto Sans JP', sans-serif;
  --f-util:    'Jost', 'Noto Sans JP', sans-serif;

  --container: 1120px;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--pearl);
  color:var(--ink);
  font-family:var(--f-sans);
  font-weight:300;
  line-height:1.9;
  letter-spacing:.02em;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }

.wrap{
  max-width:var(--container);
  margin:0 auto;
  padding:0 32px;
}

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:0.001ms !important; transition-duration:0.001ms !important; scroll-behavior:auto !important; }
}

/* -------------------- texture: pearl sheen background -------------------- */
.pearl-bg{
  background:
    radial-gradient(1200px 600px at 15% -10%, rgba(198,164,102,.10), transparent 60%),
    radial-gradient(900px 500px at 110% 10%, rgba(159,183,201,.16), transparent 55%),
    linear-gradient(180deg, var(--pearl) 0%, var(--pearl) 100%);
}

/* -------------------- header -------------------- */
.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(244,245,247,.86);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--pearl-line);
}
.site-header .wrap{
  display:flex; align-items:center; justify-content:space-between;
  height:130px;
}
.brand-mark{ display:flex; align-items:center; gap:12px; }
.logo-icon{ height:90px; width:auto; }
.logo-text{
  font-family:var(--f-serif); font-weight:700; font-size:36px; letter-spacing:.01em;
  background:linear-gradient(135deg, #6B7078 0%, #9AA0A8 35%, #C7CCD2 55%, #7D828A 75%, #565C66 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.footer-logo-row{ display:flex; align-items:center; gap:14px; margin-bottom:18px; }
.footer-logo-row .logo-icon{ height:64px; }
.footer-logo-row .logo-text{ font-size:30px; }
.logo-text-footer{
  background:none; -webkit-background-clip:unset; background-clip:unset;
  color:#F4F5F7 !important; -webkit-text-fill-color:#F4F5F7;
}
.brand-mark .div{ width:1px; height:22px; background:var(--pearl-line); }
.brand-mark .archi{
  font-family:var(--f-display); font-style:italic; font-weight:500;
  letter-spacing:.08em; font-size:15px; color:var(--gold-deep);
}
nav.main-nav{ display:flex; gap:40px; align-items:center; }
nav.main-nav a{
  font-family:var(--f-util); font-size:13px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--ink-soft);
  position:relative; padding-bottom:4px;
  transition:color .25s ease;
}
nav.main-nav a:hover, nav.main-nav a.active{ color:var(--gold-deep); }
nav.main-nav a::after{
  content:''; position:absolute; left:0; bottom:0; height:1px; width:0;
  background:var(--gold); transition:width .3s ease;
}
nav.main-nav a:hover::after, nav.main-nav a.active::after{ width:100%; }
.nav-cta{
  font-family:var(--f-util); font-size:12px; letter-spacing:.12em;
  text-transform:uppercase; padding:10px 22px; border:1px solid var(--royal);
  color:var(--royal); border-radius:2px; white-space:nowrap;
  transition:background .25s ease, color .25s ease;
}
.nav-cta:hover{ background:var(--royal); color:var(--pearl); }
.nav-toggle{ display:none; }

@media (max-width: 860px){
  nav.main-nav{ position:fixed; inset:130px 0 0 0; background:var(--pearl);
    flex-direction:column; justify-content:flex-start; align-items:flex-start;
    padding:40px 32px; gap:28px; transform:translateX(100%);
    transition:transform .35s ease; }
  nav.main-nav.open{ transform:translateX(0); }
  .nav-toggle{
    display:flex; flex-direction:column; gap:5px; background:none; border:none;
    cursor:pointer; padding:8px; z-index:60;
  }
  .nav-toggle span{ width:22px; height:1px; background:var(--ink); display:block; }
}

/* -------------------- eyebrow / section labels -------------------- */
.eyebrow{
  font-family:var(--f-util); font-size:12px; letter-spacing:.28em;
  text-transform:uppercase; color:var(--gold-deep);
  display:flex; align-items:center; gap:14px; margin-bottom:22px;
}
.eyebrow::before{ content:''; width:32px; height:1px; background:var(--gold); }

h1,h2,h3,h4{ font-family:var(--f-serif); font-weight:600; margin:0; color:var(--ink); }
.display{
  font-family:var(--f-display); font-weight:500; font-style:italic;
}

/* -------------------- hero -------------------- */
.hero{
  position:relative; min-height:92vh; display:flex; align-items:center;
  overflow:hidden;
  background:
    radial-gradient(1000px 700px at 80% 0%, rgba(198,164,102,.14), transparent 55%),
    radial-gradient(900px 600px at 5% 100%, rgba(159,183,201,.20), transparent 55%),
    var(--pearl);
}
.hero .blueprint{
  position:absolute; inset:0; z-index:0; opacity:.55;
}
.hero-content{ position:relative; z-index:2; padding:120px 0 90px; }
.hero .eyebrow{ color:var(--blue-dust); }
.hero .eyebrow::before{ background:var(--blue-dust); }
.hero h1{
  font-size:clamp(40px,6vw,76px); line-height:1.15; letter-spacing:.01em;
  max-width:780px;
}
.hero h1 em{
  font-family:var(--f-display); font-style:italic; color:var(--gold-deep); font-weight:500;
}
.hero p.lead{
  margin-top:28px; max-width:640px; font-size:16px; color:var(--ink-soft);
  font-weight:300; letter-spacing:.03em; line-height:1.9;
}
.hero-actions{ margin-top:44px; display:flex; gap:20px; flex-wrap:wrap; align-items:center; }

.btn-img-link{
  display:inline-block;
  transition:transform .3s ease, filter .3s ease;
}
.btn-img-link:hover{ transform:translateY(-3px); filter:brightness(1.06); }
.btn-img{ display:block; width:300px; height:auto; }
@media (max-width:560px){
  .btn-img{ width:240px; }
}

.btn{
  display:inline-flex; align-items:center; gap:14px;
  font-family:var(--f-util); letter-spacing:.05em;
  padding:14px 28px; border-radius:8px; transition:all .3s ease;
  position:relative; overflow:hidden;
}
.btn-icon{ display:flex; align-items:center; flex-shrink:0; }
.btn-copy{ display:flex; flex-direction:column; gap:8px; }
.btn-label{ font-family:var(--f-serif); font-size:16px; letter-spacing:.05em; font-weight:600; }
.btn-divider{ display:block; }

.btn-primary{
  background:linear-gradient(135deg,#0c1e63 0%,#1d40ab 45%,#0a1a58 100%);
  border:1.5px solid #d4b25a;
  box-shadow:0 8px 20px rgba(10,20,70,.35), inset 0 0 12px rgba(255,255,255,.06);
}
.btn-primary .btn-label{ color:#f2dfae; }
.btn-primary:hover{ box-shadow:0 10px 28px rgba(10,20,70,.5); border-color:#f0d68a; transform:translateY(-2px); }

.btn-ghost{
  background:linear-gradient(135deg,#fffdf8 0%,#f5efe0 100%);
  border:1.5px solid #c9a227;
  box-shadow:0 8px 20px rgba(0,0,0,.08);
}
.btn-ghost .btn-label{ color:#2a2a2a; }
.btn-ghost:hover{ box-shadow:0 10px 28px rgba(0,0,0,.14); border-color:#e9cd82; transform:translateY(-2px); }

.hero-foundation{
  position:absolute; left:0; right:0; bottom:0; height:1px; background:
  linear-gradient(90deg, transparent, var(--gold) 20%, var(--gold) 80%, transparent);
}

/* -------------------- generic sections -------------------- */
section{ padding:120px 0; position:relative; }
section.tight{ padding:80px 0; }
.section-blue{ background:linear-gradient(180deg, var(--blue-dust-soft), var(--pearl)); }
.section-royal{
  position:relative; overflow:hidden;
  background:var(--royal-gradient); color:var(--pearl);
}
.section-royal::before{
  content:''; position:absolute; inset:-20%; z-index:0; pointer-events:none;
  background:linear-gradient(120deg, transparent 42%, rgba(233,219,184,.20) 50%, rgba(207,226,234,.16) 54%, transparent 62%);
  background-size:260% 260%;
  animation:shimmerMove 9s ease-in-out infinite;
}
.section-royal > .wrap{ position:relative; z-index:1; }
.section-royal h2,.section-royal h3,.section-royal h4{ color:var(--ink); }
.section-royal .eyebrow{ color:var(--gold-deep); }
.section-royal .eyebrow::before{ background:var(--gold-deep); }
.section-royal p{ color:#2E4A56; }
@keyframes shimmerMove{
  0%{ background-position:0% 0%; }
  50%{ background-position:100% 60%; }
  100%{ background-position:0% 0%; }
}

.section-head{ max-width:680px; margin-bottom:64px; }
.section-head h2{ font-size:clamp(30px,4vw,46px); line-height:1.35; }
.section-head p{ margin-top:20px; color:var(--ink-soft); font-size:15.5px; }

hr.hairline{ border:none; border-top:1px solid var(--pearl-line); margin:0; }

/* -------------------- philosophy / statement blocks -------------------- */
.statement{
  font-family:var(--f-serif); font-size:clamp(22px,3vw,32px); line-height:1.9;
  color:var(--ink); max-width:820px;
}
.statement strong{ color:var(--gold-deep); font-weight:600; }

.quote-block{
  border-left:1px solid var(--gold); padding-left:28px; margin:36px 0;
  font-family:var(--f-serif); font-size:19px; color:var(--ink); line-height:1.85;
}

/* -------------------- two column -------------------- */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
@media (max-width: 900px){ .split{ grid-template-columns:1fr; gap:48px; } }
.split.rev{ direction:rtl; } .split.rev > *{ direction:ltr; }

/* -------------------- blueprint / structure diagram -------------------- */
.blueprint-frame{
  border:1px solid var(--pearl-line); background:var(--pearl-deep);
  padding:36px; position:relative;
}
.blueprint-frame::before{
  content:''; position:absolute; inset:10px; border:1px solid rgba(198,164,102,.35);
  pointer-events:none;
}
.structure-diagram{ width:100%; height:auto; display:block; }
.structure-diagram .beam{ stroke:var(--gold-deep); }
.structure-diagram .column{ stroke:var(--royal); }
.structure-diagram .label{ font-family:'Jost', sans-serif; fill:var(--ink-soft); font-size:11px; letter-spacing:.08em; }
.structure-diagram .dim{ stroke:var(--blue-dust); stroke-dasharray:2 3; }

/* -------------------- ingredient cards -------------------- */
.ingredient-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  background:var(--pearl-line); border:1px solid var(--pearl-line); margin-top:60px;
}
@media (max-width:960px){ .ingredient-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .ingredient-grid{ grid-template-columns:1fr; } }
.ingredient-card{
  background:var(--pearl); padding:38px 28px; transition:background .3s ease;
}
.ingredient-card:hover{ background:#fff; }
.ingredient-card .num{
  font-family:var(--f-display); font-style:italic; font-size:14px; color:var(--blue-dust);
  letter-spacing:.1em;
}
.ingredient-card .role{
  font-family:var(--f-serif); font-size:20px; margin:14px 0 8px; color:var(--royal);
}
.ingredient-card .name{ font-size:14px; color:var(--ink); font-weight:500; margin-bottom:10px; }
.ingredient-card p{ font-size:13px; color:var(--ink-soft); line-height:1.85; margin:0; }

/* -------------------- feature rows (quality) -------------------- */
.feature-row{
  display:grid; grid-template-columns:200px 1fr; gap:40px; padding:36px 0;
  border-top:1px solid var(--pearl-line);
}
.feature-row:last-child{ border-bottom:1px solid var(--pearl-line); }
@media (max-width:700px){ .feature-row{ grid-template-columns:1fr; gap:10px; } }
.feature-row .tag{
  font-family:var(--f-util); font-size:12px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--gold-deep); padding-top:4px;
}
.feature-row h4{ font-size:19px; margin-bottom:10px; }
.feature-row p{ color:var(--ink-soft); font-size:14.5px; margin:0; }

/* -------------------- spec table -------------------- */
.spec-table{ width:100%; border-collapse:collapse; margin-top:20px; }
.spec-table tr{ border-top:1px solid var(--pearl-line); }
.spec-table tr:last-child{ border-bottom:1px solid var(--pearl-line); }
.spec-table th,.spec-table td{ text-align:left; padding:18px 10px; font-size:14.5px; vertical-align:top; }
.spec-table th{
  width:180px; font-family:var(--f-util); font-weight:500; letter-spacing:.06em;
  color:var(--ink-soft); font-size:12.5px; text-transform:uppercase;
}

/* -------------------- pricing -------------------- */
.price-grid{ display:grid; grid-template-columns:1fr 1fr; gap:32px; margin-top:56px; }
@media (max-width:700px){ .price-grid{ grid-template-columns:1fr; } }
.price-card{
  border:1px solid var(--pearl-line); background:#fff; padding:44px 40px;
  position:relative; transition:transform .3s ease, box-shadow .3s ease;
}
.price-card.featured{ border-color:var(--gold); }
.price-card.featured::after{
  content:'RECOMMENDED'; position:absolute; top:-1px; right:-1px;
  background:var(--gold); color:#fff; font-family:var(--f-util); font-size:10px;
  letter-spacing:.14em; padding:6px 14px;
}
.price-card:hover{ transform:translateY(-4px); box-shadow:0 24px 48px rgba(22,36,74,.08); }
.price-card .plan{ font-family:var(--f-util); font-size:12px; letter-spacing:.16em; color:var(--ink-soft); text-transform:uppercase; }
.price-card .amount{ font-family:var(--f-serif); font-size:40px; margin:18px 0 6px; color:var(--royal); }
.price-card .amount span{ font-size:14px; color:var(--ink-soft); font-family:var(--f-sans); }
.price-card .desc{ font-size:13.5px; color:var(--ink-soft); margin-bottom:26px; }

.coming-soon-badge{
  display:inline-flex; align-items:center; gap:10px; font-family:var(--f-util);
  font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--royal);
  border:1px solid var(--blue-dust); padding:12px 24px; margin-top:8px;
}
.coming-soon-badge::before{ content:''; width:6px; height:6px; border-radius:50%; background:var(--blue-dust); }

/* -------------------- company profile table -------------------- */
.profile-table{ width:100%; border-collapse:collapse; }
.profile-table tr{ border-top:1px solid var(--pearl-line); }
.profile-table tr:last-child{ border-bottom:1px solid var(--pearl-line); }
.profile-table th,.profile-table td{ padding:22px 16px; text-align:left; font-size:14.5px; }
.profile-table th{
  width:180px; font-family:var(--f-util); font-weight:500; font-size:12px;
  letter-spacing:.1em; text-transform:uppercase; color:var(--gold-deep);
  vertical-align:top;
}

/* -------------------- founder message -------------------- */
.founder{
  display:grid; grid-template-columns:280px 1fr; gap:64px; align-items:start;
}
@media (max-width:800px){ .founder{ grid-template-columns:1fr; } }
.founder-frame{
  aspect-ratio:3/4; background:var(--pearl-deep); border:1px solid var(--pearl-line);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--f-display); font-style:italic; color:var(--blue-dust); font-size:14px;
  text-align:center; padding:20px;
}

/* -------------------- timeline (mission steps) -------------------- */
.value-list{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--pearl-line); border:1px solid var(--pearl-line); margin-top:20px;}
@media (max-width:800px){ .value-list{ grid-template-columns:1fr; } }
.value-item{ background:var(--pearl); padding:30px 26px; font-size:14px; color:var(--ink-soft); }
.value-item b{ display:block; color:var(--ink); font-family:var(--f-serif); font-size:16px; margin-bottom:8px; font-weight:600; }

/* -------------------- footer -------------------- */
.site-footer{
  position:relative; overflow:hidden;
  background:var(--royal-gradient); color:#2E4A56; padding:80px 0 30px;
}
.site-footer::before{
  content:''; position:absolute; inset:-20%; z-index:0; pointer-events:none;
  background:linear-gradient(120deg, transparent 42%, rgba(233,219,184,.16) 50%, rgba(207,226,234,.14) 54%, transparent 62%);
  background-size:260% 260%;
  animation:shimmerMove 11s ease-in-out infinite;
}
.site-footer > .wrap{ position:relative; z-index:1; }
.footer-grid{ display:grid; grid-template-columns:2fr 1fr 1fr; gap:60px; margin-bottom:56px; }
@media (max-width:760px){ .footer-grid{ grid-template-columns:1fr; gap:36px; } }
.footer-grid h5{
  font-family:var(--f-util); font-size:12px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--gold-deep); margin:0 0 20px;
}
.footer-grid a{ display:block; font-size:13.5px; color:#2E4A56; margin-bottom:12px; opacity:.85; }
.footer-grid a:hover{ opacity:1; color:#12303D; }
.footer-brand img{ height:40px; margin-bottom:18px; }
.footer-brand p{ font-size:13px; line-height:1.9; color:#3D5C68; max-width:320px; }
.footer-legal{
  border-top:1px solid rgba(20,50,60,.18); padding-top:26px;
  font-size:11.5px; color:#4C6874; line-height:2;
}
.footer-legal p{ margin:0 0 6px; }
.footer-bottom{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px;
  margin-top:20px; font-size:11.5px; color:#4C6874; }

/* -------------------- reveal on scroll -------------------- */
.reveal{ opacity:0; transform:translateY(24px); transition:opacity .8s ease, transform .8s ease; }
.reveal.in{ opacity:1; transform:translateY(0); }

/* -------------------- page hero (sub pages) -------------------- */
.page-hero{ padding:180px 0 90px; position:relative; }
.page-hero .eyebrow{ color:var(--blue-dust); }
.page-hero .eyebrow::before{ background:var(--blue-dust); }
.page-hero h1{ font-size:clamp(34px,5vw,58px); max-width:760px; line-height:1.3; }
.page-hero p.lead{ margin-top:24px; max-width:600px; color:var(--ink-soft); font-size:15.5px; }

.badge-row{ display:flex; gap:14px; flex-wrap:wrap; margin-top:36px; }
.badge{
  font-family:var(--f-util); font-size:11.5px; letter-spacing:.08em; text-transform:uppercase;
  border:1px solid var(--pearl-line); padding:10px 16px; color:var(--ink-soft);
}

/* ============================================================
   LP (Landing Page) components — bigger type, glass transparency
   ============================================================ */

/* -------------------- glass card (透明感) -------------------- */
.glass{
  background:rgba(255,255,255,.46);
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  border:1px solid rgba(255,255,255,.65);
  box-shadow:0 30px 60px -20px rgba(30,58,71,.18), inset 0 1px 0 rgba(255,255,255,.9);
}
.glass-dark{
  background:rgba(255,255,255,.10);
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  border:1px solid rgba(255,255,255,.28);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35);
}

/* -------------------- LP hero -------------------- */
.lp-hero{
  position:relative; min-height:100vh; display:flex; align-items:center; overflow:hidden;
  background:
    radial-gradient(1100px 750px at 82% -6%, rgba(198,164,102,.20), transparent 55%),
    radial-gradient(950px 650px at 0% 105%, rgba(159,183,201,.28), transparent 55%),
    var(--pearl);
}
.lp-hero .blueprint{
  position:absolute; inset:0; z-index:0; opacity:.5;
}
.lp-hero-content{ position:relative; z-index:2; padding:150px 0 100px; }
.lp-kicker{
  display:inline-flex; align-items:center; gap:16px; font-family:var(--f-util);
  font-size:13px; letter-spacing:.32em; text-transform:uppercase; color:var(--gold-deep);
  margin-bottom:30px;
}
.lp-kicker::before{ content:''; width:44px; height:1px; background:var(--gold); }
.lp-hero h1{
  font-family:var(--f-serif); font-weight:700; color:var(--ink);
  font-size:clamp(46px,7.4vw,104px); line-height:1.06; letter-spacing:-.01em; max-width:920px;
}
.lp-hero h1 .accent{
  font-family:var(--f-display); font-style:italic; font-weight:500; color:var(--gold-deep);
}
.lp-hero .lp-sub{
  margin-top:32px; max-width:680px; font-size:clamp(16px,1.5vw,18px); line-height:1.9;
  color:var(--ink-soft); font-weight:300;
}
.lp-hero .lp-stats{ display:flex; gap:56px; margin-top:56px; flex-wrap:wrap; }
.lp-stat b{
  display:block; font-family:var(--f-serif); font-size:clamp(28px,3vw,38px); color:var(--royal);
  font-weight:700; line-height:1;
}
.lp-stat span{
  display:block; margin-top:10px; font-family:var(--f-util); font-size:11.5px;
  letter-spacing:.1em; text-transform:uppercase; color:var(--ink-soft);
}

/* -------------------- big statement -------------------- */
.lp-statement{
  font-family:var(--f-serif); font-weight:700; color:var(--ink);
  font-size:clamp(30px,4.6vw,58px); line-height:1.45; letter-spacing:-.005em;
}
.lp-statement .mark{ color:var(--gold-deep); }
.lp-statement .mark-blue{ color:var(--royal); }

.lp-eyebrow{
  font-family:var(--f-util); font-size:13px; letter-spacing:.3em; text-transform:uppercase;
  color:var(--gold-deep); display:flex; align-items:center; gap:16px; margin-bottom:28px;
}
.lp-eyebrow::before{ content:''; width:44px; height:1px; background:var(--gold); }

.lp-section-head{ max-width:760px; margin-bottom:72px; }
.lp-section-head p.desc{ margin-top:26px; font-size:17px; line-height:2; color:var(--ink-soft); }

/* -------------------- pain point / empathy cards -------------------- */
.pain-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:2px; background:var(--pearl-line); border:1px solid var(--pearl-line); margin-top:20px; }
@media (max-width:900px){ .pain-grid{ grid-template-columns:1fr; } }
.pain-card{ background:var(--pearl); padding:44px 34px; }
.pain-card .q{ font-family:var(--f-display); font-style:italic; font-size:22px; color:var(--gold-deep); line-height:1.6; }
.pain-card p{ margin-top:16px; font-size:14.5px; color:var(--ink-soft); line-height:1.9; }

/* -------------------- ingredient LP cards (glass) -------------------- */
.ing-lp-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:22px; margin-top:64px; }
@media (max-width:860px){ .ing-lp-grid{ grid-template-columns:1fr; } }
.ing-lp-card{
  padding:38px 40px; position:relative; border-radius:2px;
}
.ing-lp-card .row1{ display:flex; align-items:baseline; gap:18px; }
.ing-lp-card .idx{ font-family:var(--f-display); font-style:italic; font-size:34px; color:var(--gold); font-weight:500; }
.ing-lp-card .role-tag{
  font-family:var(--f-util); font-size:11px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--royal); border:1px solid var(--royal); padding:5px 12px;
}
.ing-lp-card h3{ font-size:24px; margin:18px 0 6px; }
.ing-lp-card .dose{ font-family:var(--f-util); font-size:12px; letter-spacing:.06em; color:var(--gold-deep); margin-bottom:14px; }
.ing-lp-card p{ font-size:14.5px; color:var(--ink-soft); line-height:1.9; margin:0; }
.ing-doc-link{
  display:inline-block; margin-top:16px; font-family:var(--f-util); font-size:12px;
  letter-spacing:.06em; color:var(--gold-deep); border-bottom:1px solid var(--gold);
  padding-bottom:2px; transition:opacity .25s ease;
}
.ing-doc-link:hover{ opacity:.7; }

/* -------------------- quality proof strip -------------------- */
.proof-strip{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:rgba(255,255,255,.25); margin-top:60px; }
@media (max-width:860px){ .proof-strip{ grid-template-columns:repeat(2,1fr); } }
.proof-item{ padding:34px 26px; text-align:center; }
.proof-item .big{ font-family:var(--f-serif); font-size:32px; color:var(--pearl); font-weight:700; }
.proof-item .cap{ margin-top:10px; font-family:var(--f-util); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--gold-soft); }

/* -------------------- usage steps -------------------- */
.usage-row{ display:grid; grid-template-columns:repeat(3,1fr); gap:36px; margin-top:56px; }
@media (max-width:860px){ .usage-row{ grid-template-columns:1fr; } }
.usage-step{ text-align:left; }
.usage-step .n{ font-family:var(--f-display); font-style:italic; font-size:44px; color:var(--gold); line-height:1; }
.usage-step h4{ font-size:19px; margin:18px 0 10px; }
.usage-step p{ font-size:14.5px; color:var(--ink-soft); margin:0; }

/* -------------------- FAQ -------------------- */
.faq-item{ border-top:1px solid var(--pearl-line); padding:28px 0; }
.faq-item:last-child{ border-bottom:1px solid var(--pearl-line); }
.faq-item .qline{ display:flex; gap:18px; font-family:var(--f-serif); font-size:18px; color:var(--ink); }
.faq-item .qline .qmark{ font-family:var(--f-display); font-style:italic; color:var(--gold-deep); font-size:22px; flex-shrink:0; }
.faq-item .aline{ display:flex; gap:18px; margin-top:14px; }
.faq-item .aline .amark{ font-family:var(--f-display); font-style:italic; color:var(--royal); font-size:18px; flex-shrink:0; }
.faq-item .aline p{ margin:0; font-size:14.5px; color:var(--ink-soft); line-height:1.9; }

/* -------------------- final CTA banner -------------------- */
.final-cta{
  position:relative; overflow:hidden; text-align:center; padding:140px 0;
  background:var(--royal-gradient);
}
.final-cta::before{
  content:''; position:absolute; inset:-20%; z-index:0; pointer-events:none;
  background:linear-gradient(120deg, transparent 42%, rgba(233,219,184,.28) 50%, rgba(255,255,255,.22) 54%, transparent 62%);
  background-size:260% 260%; animation:shimmerMove 8s ease-in-out infinite;
}
.final-cta > .wrap{ position:relative; z-index:1; }
.final-cta h2{ font-size:clamp(30px,4.4vw,50px); color:var(--ink); max-width:760px; margin:0 auto; }
.final-cta p{ margin-top:22px; font-size:16px; color:#2E4A56; }
.final-cta .btn{ margin-top:44px; }