/* Landing-page-only layout. Colors/fonts/reset come from styles.css so this
   page looks like part of the same product, not a bolted-on microsite. */

.landing-wrap{ max-width:1100px; margin:0 auto; padding:28px 24px 0; }

.landing-top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:clamp(40px,8vw,88px); }
.landing-top .brand{ font-size:20px; }
.top-signin{ font-family:'Work Sans', sans-serif; font-size:13.5px; font-weight:600; color:var(--ink); text-decoration:none; padding:8px 16px; border:1px solid var(--line); border-radius:8px; }
.top-signin:hover{ background:var(--surface-2); }

.hero{ text-align:center; margin-bottom:clamp(36px,7vw,64px); }
.hero-eyebrow{ font-size:11.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-muted); margin-bottom:16px; }
.hero h1{ font-size:clamp(32px,6vw,54px); line-height:1.12; letter-spacing:-.01em; margin:0 0 18px; }
.hero h1 .line2{ color:var(--accent); display:block; }
.hero-sub{ font-family:'Work Sans', sans-serif; font-size:clamp(14.5px,2vw,17px); line-height:1.6; color:var(--ink-muted); max-width:620px; margin:0 auto 30px; }
.hero-ctas{ display:flex; align-items:center; justify-content:center; gap:12px; flex-wrap:wrap; }
.cta-primary, .cta-secondary{ font-family:'Work Sans', sans-serif; font-weight:600; font-size:14.5px; text-decoration:none; padding:13px 24px; border-radius:9px; display:inline-flex; align-items:center; gap:6px; }
.cta-primary{ background:var(--ink); color:var(--bg); }
.cta-primary:hover{ background:var(--accent); color:var(--accent-ink); }
.cta-secondary{ background:none; color:var(--ink); border:1px solid var(--line); }
.cta-secondary:hover{ background:var(--surface-2); }

.sample-label{ text-align:center; font-size:11.5px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-muted); margin-bottom:12px; }
.sample-tiles{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:clamp(40px,7vw,72px); }
@media (max-width:700px){ .sample-tiles{ grid-template-columns:repeat(2,1fr); } }
.sample-tiles .tile{ text-align:center; align-items:center; }

.dark-panel{ background:#14181A; color:#E9EAE3; border-radius:16px; padding:clamp(24px,4vw,44px); margin-bottom:clamp(40px,7vw,72px); }
.dark-panel .panel-head{ text-align:center; margin-bottom:clamp(28px,4vw,40px); }
.dark-panel .panel-head h2{ color:#F5F6F2; font-size:clamp(20px,3vw,26px); margin-bottom:8px; }
.dark-panel .panel-head p{ font-family:'Work Sans', sans-serif; color:#98A29A; font-size:13.5px; }
.panel-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
@media (max-width:760px){ .panel-grid{ grid-template-columns:1fr; gap:24px; } }
.panel-feature .feature-icon{ width:34px; height:34px; border-radius:9px; background:rgba(217,168,87,.16); color:#D9A857; display:flex; align-items:center; justify-content:center; margin-bottom:14px; }
.panel-feature h3{ font-size:15px; color:#F5F6F2; margin-bottom:8px; }
.panel-feature p{ font-family:'Work Sans', sans-serif; font-size:13.5px; line-height:1.6; color:#98A29A; margin:0; }

.feature-row{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-bottom:clamp(40px,7vw,72px); }
@media (max-width:760px){ .feature-row{ grid-template-columns:1fr; } }
.feature-row .card h3{ font-size:15.5px; margin-bottom:8px; }
.feature-row .card p{ font-family:'Work Sans', sans-serif; font-size:13.5px; line-height:1.6; color:var(--ink-muted); margin:0; }

.platform-note{ display:flex; align-items:center; gap:20px; background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:clamp(20px,4vw,32px); margin-bottom:clamp(40px,7vw,72px); }
@media (max-width:600px){ .platform-note{ flex-direction:column; text-align:center; } }
.platform-note img{ height:56px; width:auto; flex-shrink:0; }
.platform-note h3{ font-size:15.5px; margin-bottom:6px; }
.platform-note p{ font-family:'Work Sans', sans-serif; font-size:13.5px; line-height:1.6; color:var(--ink-muted); margin:0; }

.closing{ text-align:center; padding:clamp(20px,4vw,32px) 0 clamp(56px,8vw,88px); }
.closing h2{ font-size:clamp(20px,3vw,28px); margin-bottom:8px; }
.closing p{ font-family:'Work Sans', sans-serif; font-size:13.5px; color:var(--ink-muted); margin-bottom:24px; }

.landing-footer{ text-align:center; font-size:12px; color:var(--ink-muted); padding:20px 24px 40px; border-top:1px solid var(--line); }