/* ------------------------------
   Pepimo landing page
--------------------------------- */
:root {
  --bg: #0b1119;
  --bg-soft: #111a28;
  --panel: #172235;
  --panel-2: #1c2940;
  --line: rgba(157, 180, 215, .16);
  --text: #f6f8fb;
  --muted: #9aa9be;
  --coral: #ff6f57;
  --coral-2: #ff8b73;
  --green: #42d7a6;
  --blue: #4d8cff;
  --shadow: 0 30px 90px rgba(0,0,0,.35);
  --radius: 22px;
  --shell: min(1180px, calc(100% - 40px));
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--text);
  background:
    radial-gradient(circle at 50% -20%, rgba(61, 86, 126, .24), transparent 37%),
    var(--bg);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.55;
  overflow-x: hidden;
}
body.light {
  --bg: #f5f7fb;
  --bg-soft: #edf1f7;
  --panel: #ffffff;
  --panel-2: #f2f5fa;
  --line: rgba(25, 41, 63, .12);
  --text: #111827;
  --muted: #657188;
  --shadow: 0 30px 80px rgba(36, 49, 72, .12);
}
a { color: inherit; text-decoration: none; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }
:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--coral) 78%, white);
  outline-offset: 4px;
}
.skip-link {
  position: fixed; top: 12px; left: 12px; z-index: 200;
  padding: 10px 14px; border-radius: 10px;
  color: #fff; background: var(--coral);
  transform: translateY(-160%); transition: transform .2s ease;
}
.skip-link:focus { transform: translateY(0); }
.section-shell { width: var(--shell); margin-inline: auto; position: relative; }
.noise {
  position: fixed; inset: 0; pointer-events: none; z-index: 100;
  opacity: .04;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E");
}

.site-header {
  position: fixed; inset: 0 0 auto; height: 74px; z-index: 50;
  display: flex; align-items: center; gap: 34px;
  padding: 0 max(24px, calc((100vw - 1180px) / 2));
  border-bottom: 1px solid transparent;
  transition: .25s ease;
}
.site-header.scrolled {
  background: color-mix(in srgb, var(--bg) 86%, transparent);
  backdrop-filter: blur(18px);
  border-color: var(--line);
}
.site-header .brand { flex: 0 0 auto; }
.brand { display: inline-flex; align-items: center; }
.brand-logo { width: auto; height: 29px; display: block; }
.brand-logo-light { display: none; }
body.light .brand-logo-dark { display: none; }
body.light .brand-logo-light { display: block; }
.desktop-nav { display: flex; gap: 28px; margin-right: auto; }
.desktop-nav a { color: var(--muted); font-size: 14px; font-weight: 650; transition: .2s; }
.desktop-nav a:hover { color: var(--text); }
.header-actions { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.theme-toggle {
  width: 40px; height: 40px; border-radius: 12px; cursor: pointer;
  color: var(--text); background: var(--panel); border: 1px solid var(--line);
}
.btn {
  display: inline-flex; justify-content: center; align-items: center; gap: 9px;
  min-height: 42px; padding: 0 18px; border-radius: 12px;
  font-size: 14px; font-weight: 750; border: 1px solid transparent;
  transition: transform .2s, box-shadow .2s, background .2s;
}
.btn:hover { transform: translateY(-2px); }
.btn-primary {
  color: #fff; background: linear-gradient(135deg, var(--coral), #ff5d46);
  box-shadow: 0 12px 28px rgba(255,111,87,.25);
}
.btn-primary:hover { box-shadow: 0 16px 34px rgba(255,111,87,.35); }
.btn-secondary { background: var(--panel); border-color: var(--line); }
.btn-ghost { border-color: var(--line); background: transparent; }
.btn-lg { min-height: 52px; padding-inline: 23px; border-radius: 14px; }
.btn-full { width: 100%; }
.menu-toggle, .mobile-menu { display: none; }

.hero {
  min-height: 900px; padding: 150px 0 110px;
  display: grid; grid-template-columns: .86fr 1.14fr; gap: 54px; align-items: center;
}
.hero-copy { position: relative; z-index: 2; }
.eyebrow {
  width: fit-content; display: flex; align-items: center; gap: 10px;
  margin-bottom: 22px; padding: 8px 12px; border: 1px solid var(--line);
  border-radius: 999px; color: var(--muted); font-size: 12px; font-weight: 800;
  letter-spacing: .05em; text-transform: uppercase; background: color-mix(in srgb, var(--panel) 72%, transparent);
}
.eyebrow.simple { padding: 0; border: 0; border-radius: 0; background: none; color: var(--coral); }
.status-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 5px rgba(66,215,166,.11); }
h1, h2, h3, p { margin-top: 0; }
h1 {
  margin-bottom: 24px; max-width: 700px;
  font-size: clamp(48px, 5.7vw, 78px); line-height: .98; letter-spacing: -.055em;
}
h1 span { color: var(--coral); }
.hero-lead { max-width: 580px; color: var(--muted); font-size: 19px; }
.hero-ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.trust-row { display: flex; gap: 16px; align-items: center; margin-top: 38px; }
.avatar-stack { display: flex; }
.avatar-stack span {
  width: 36px; height: 36px; display: grid; place-items: center;
  margin-left: -8px; border-radius: 50%; color: #fff; background: #22344f;
  border: 3px solid var(--bg); font-size: 10px; font-weight: 800;
}
.avatar-stack span:first-child { margin-left: 0; background: #6d7fa0; }
.avatar-stack span:nth-child(2) { background: #4b638b; }
.avatar-stack span:nth-child(3) { background: #7b5b6f; }
.avatar-stack span:last-child { background: var(--coral); }
.stars { color: #ffd364; letter-spacing: 2px; font-size: 12px; }
.trust-row p { margin: 2px 0 0; color: var(--muted); font-size: 12px; }

.hero-visual { position: relative; min-width: 730px; transform: perspective(1600px) rotateY(-4deg) rotateX(2deg); transform-origin: center; }
.app-window {
  position: relative; overflow: hidden; border: 1px solid rgba(130,157,196,.22);
  border-radius: 18px; background: #0d141e; box-shadow: var(--shadow);
}
.app-topbar {
  height: 46px; display: flex; align-items: center; gap: 24px; padding: 0 16px;
  background: #172235; border-bottom: 1px solid #293852;
}
.app-logo { display: flex; align-items: center; }
.app-logo img { display: block; width: auto; height: 13px; }
.app-tabs { display: flex; gap: 18px; font-size: 9px; color: #9cacbf; }
.app-tabs .active { color: #fff; position: relative; }
.app-tabs .active:after { content:""; position:absolute; left:0; right:0; bottom:-15px; height:2px; background: var(--coral); }
.app-avatar { margin-left: auto; width: 25px; height: 25px; display:grid; place-items:center; border-radius:8px; background:#223149; font-size:8px; }
.app-body { display: grid; grid-template-columns: 135px 1fr; min-height: 495px; }
.app-sidebar { padding: 12px 10px; border-right: 1px solid #293852; background: #101721; }
.property-thumb { height: 68px; position: relative; overflow:hidden; border-radius:9px; background: linear-gradient(135deg,#e9e4dc,#b8bec5); }
.thumb-window { position:absolute; left:15px; top:8px; width:52px; height:38px; background:linear-gradient(#b9d7e8,#e9f1f4); border:5px solid #faf8f2; box-shadow: 50px 5px 0 0 #f6f3ed; }
.thumb-floor { position:absolute; inset:auto 0 0; height:20px; background:linear-gradient(10deg,#c3a582,#e7d4bc); }
.saved-pill { padding: 7px; margin:8px 0; text-align:center; border-radius:6px; background:#1d2b40; color:#b8c8dc; font-size:7px; }
.side-item { display:flex; justify-content:space-between; margin-top:6px; padding:9px; border-radius:6px; color:#c1ccda; background:#1a273a; font-size:7px; }
.side-item.active { outline: 1px solid rgba(255,111,87,.35); }
.app-main { padding: 13px; }
.score-panel { display:grid; grid-template-columns:145px 1fr; min-height:118px; overflow:hidden; border:1px solid #2a3a53; border-radius:10px; background:#172235; }
.score-block { padding:15px; border-right:1px solid #293852; }
.score-block > span, .mini-label { display:block; color:#8fa0b7; font-size:6px; font-weight:800; letter-spacing:.08em; }
.score-block strong { display:block; margin:4px 0; color:var(--green); font-size:31px; line-height:1; }
.score-block small { font-size:10px; color:#95a5b9; }
.score-line { height:4px; border-radius:10px; background:#2d3d52; }
.score-line i { display:block; width:100%; height:100%; border-radius:inherit; background:var(--green); }
.score-block em { display:inline-block; margin-top:9px; padding:3px 6px; color:var(--green); background:rgba(66,215,166,.1); border-radius:4px; font-style:normal; font-size:6px; }
.verdict-block { padding:14px 16px; }
.verdict-block h3 { margin:5px 0 9px; font-size:11px; letter-spacing:-.02em; }
.checks { display:flex; gap:5px; flex-wrap:wrap; }
.checks span { padding:5px 7px; border:1px solid #2b3a50; border-radius:5px; color:#b9c6d7; font-size:6px; }
.checks span::first-letter { color:var(--green); }
.verdict { display:flex; gap:8px; align-items:center; margin-top:8px; padding:8px; border-radius:6px; border:1px solid rgba(66,215,166,.18); background:rgba(66,215,166,.07); }
.verdict-icon { width:18px; height:18px; display:grid; place-items:center; border-radius:50%; background:rgba(66,215,166,.16); color:var(--green); font-size:8px; }
.verdict b { display:block; color:var(--green); font-size:6px; }
.verdict p { margin:1px 0 0; color:#a9b8ca; font-size:6px; }
.control-row { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-top:8px; }
.range-card { display:flex; align-items:center; gap:9px; padding:6px 10px; border:1px solid #2a3a53; border-radius:7px; background:#172235; font-size:6px; color:#9faec0; }
.range { flex:1; height:4px; position:relative; background:#39475a; border-radius:20px; }
.range i { display:block; height:100%; border-radius:inherit; background:var(--coral); }
.range b { position:absolute; top:50%; width:8px; height:8px; border-radius:50%; transform:translate(-50%,-50%); background:var(--coral); }
.range-card strong { color:var(--coral); }
.metric-tabs { display:flex; gap:5px; margin-top:8px; }
.metric-tabs span { padding:6px 9px; border-radius:6px; background:#1a2638; color:#91a0b4; font-size:6px; }
.metric-tabs .active { color:#fff; background:var(--coral); }
.metrics-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:7px; margin-top:8px; }
.metrics-grid article { padding:10px; border-radius:8px; border:1px solid #2b3950; background:#172235; }
.metrics-grid small { display:block; color:#8f9fb3; font-size:5px; font-weight:800; }
.metrics-grid strong { display:block; margin-top:3px; font-size:12px; }
.metrics-grid p { margin:1px 0 0; color:#8393a7; font-size:5px; }
.coral { color:var(--coral); } .green { color:var(--green); }
.chart-card { height:125px; margin-top:8px; padding:9px; border-radius:8px; border:1px solid #2b3950; background:#172235; }
.chart-title { color:#e7edf6; font-size:7px; font-weight:700; }
.chart-card svg { width:100%; height:98px; overflow:visible; }
.grid-lines line { stroke:#2b3950; stroke-width:1; }
.line { fill:none; stroke-width:2; }
.blue { stroke:var(--blue); } .coral-line { stroke:#ef6e73; } .green-line { stroke:var(--green); }
.floating-card {
  position:absolute; z-index:4; padding:14px 16px; border:1px solid rgba(145,169,207,.23);
  border-radius:14px; background:rgba(24,35,53,.9); backdrop-filter:blur(16px); box-shadow:0 16px 35px rgba(0,0,0,.3);
}
.floating-card span, .floating-card small { display:block; color:#9eacc0; font-size:9px; }
.floating-card strong { display:block; color:#fff; }
.floating-profit { right:-35px; bottom:34px; }
.floating-profit strong { color:var(--green); font-size:20px; }
.floating-score { left:-30px; top:95px; display:flex; gap:10px; align-items:center; }
.ring { width:42px; height:42px; display:grid; place-items:center; border:4px solid var(--green); border-radius:50%; color:var(--green); font-weight:800; }
.floating-score strong { font-size:13px; }
.orb { position:absolute; border-radius:50%; filter:blur(4px); opacity:.7; }
.orb-one { width:260px; height:260px; right:-90px; top:-80px; background:radial-gradient(circle,rgba(255,111,87,.28),transparent 67%); }
.orb-two { width:320px; height:320px; left:30px; bottom:-100px; background:radial-gradient(circle,rgba(77,140,255,.16),transparent 68%); }

.logo-strip { padding: 28px 0 80px; border-top:1px solid var(--line); }
.logo-strip > p { text-align:center; color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.12em; }
.logo-values { display:grid; grid-template-columns:repeat(4,1fr); gap:15px; margin-top:26px; }
.logo-values span { text-align:center; color:#cbd4e1; font-weight:700; font-size:14px; }

.product-section, .features-section, .pricing-section { padding: 120px 0; }
.section-heading { display:flex; justify-content:space-between; gap:50px; align-items:end; margin-bottom:54px; }
.section-heading h2 { margin:0; font-size:clamp(38px,5vw,62px); line-height:1.02; letter-spacing:-.045em; }
.section-heading > p { max-width:470px; margin:0 0 7px; color:var(--muted); font-size:16px; }
.section-heading.compact { margin-bottom:42px; }
.section-heading.centered { display:block; text-align:center; }
.section-heading.centered .eyebrow { margin-inline:auto; }
.section-heading.centered > p { margin:18px auto 0; }

.feature-bento { display:grid; grid-template-columns:1.25fr .75fr; gap:18px; }
.bento-card {
  position:relative; overflow:hidden; min-height:390px; padding:32px;
  border:1px solid var(--line); border-radius:var(--radius); background:linear-gradient(145deg,var(--panel),color-mix(in srgb,var(--panel) 80%,#0c121c));
}
.bento-large { grid-row:span 2; min-height:798px; display:flex; flex-direction:column; justify-content:space-between; }
.icon-box {
  width:44px; height:44px; display:grid; place-items:center; margin-bottom:24px;
  border-radius:12px; background:rgba(77,140,255,.13); color:#8eb5ff; font-size:22px;
}
.coral-bg { color:var(--coral); background:rgba(255,111,87,.12); }
.bento-card h3 { max-width:470px; margin-bottom:12px; font-size:28px; line-height:1.1; letter-spacing:-.035em; }
.bento-card p { max-width:500px; color:var(--muted); }
.mini-verdict { padding:18px; border-radius:18px; border:1px solid var(--line); background:rgba(10,16,25,.44); box-shadow:0 25px 70px rgba(0,0,0,.25); }
.mini-score { padding:20px; border-bottom:1px solid var(--line); }
.mini-score span, .mini-result span { display:block; color:var(--muted); font-size:10px; font-weight:800; letter-spacing:.08em; }
.mini-score strong { display:block; margin:8px 0; color:var(--green); font-size:58px; line-height:1; }
.mini-score small { font-size:18px; color:var(--muted); }
.mini-progress { height:7px; background:#2a394c; border-radius:10px; }
.mini-progress i { display:block; width:94%; height:100%; border-radius:inherit; background:var(--green); }
.mini-result { padding:20px; }
.mini-result span { color:var(--green); }
.mini-result strong { display:block; margin:5px 0; font-size:19px; }
.spark-chart { position:absolute; left:20px; right:20px; bottom:12px; height:120px; }
.spark-chart svg { width:100%; height:100%; }
.spark-chart polyline { fill:none; stroke:var(--green); stroke-width:3; }
.spark-chart path { fill:url(#none); fill:rgba(66,215,166,.08); }
.compare-pill { width:max-content; display:flex; padding:4px; border-radius:10px; background:var(--bg); }
.compare-pill span { padding:7px 13px; border-radius:8px; color:var(--muted); font-size:12px; }
.compare-pill span:first-child { color:#fff; background:var(--coral); }
.compare-bars { position:absolute; left:32px; right:32px; bottom:28px; }
.compare-bars > div { display:grid; grid-template-columns:95px 1fr 52px; align-items:center; gap:8px; margin-top:14px; color:var(--muted); font-size:10px; }
.compare-bars i { display:block; height:7px; position:relative; border-radius:10px; background:#2d3b4f; }
.compare-bars i:after { content:""; position:absolute; inset:0 auto 0 0; width:var(--w); border-radius:inherit; background:linear-gradient(90deg,var(--coral),var(--green)); }
.compare-bars b { color:var(--text); text-align:right; }

.workflow-section { padding:120px 0; background:var(--bg-soft); border-block:1px solid var(--line); }
.steps { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.steps article { position:relative; padding:20px; }
.step-number { margin-bottom:15px; color:var(--coral); font-weight:850; font-size:12px; }
.step-visual { height:260px; margin-bottom:25px; border:1px solid var(--line); border-radius:18px; background:var(--panel); }
.steps h3 { margin-bottom:8px; font-size:22px; }
.steps p { color:var(--muted); }
.visual-property { padding:24px; }
.fake-photo { height:135px; border-radius:12px; background:linear-gradient(135deg,#e9e4dc 0 52%,#c5c9cf 52%); position:relative; overflow:hidden; }
.fake-photo:before { content:""; position:absolute; left:35px; top:17px; width:72px; height:82px; border:9px solid white; background:linear-gradient(#b2d2e8,#f1f7fa); }
.fake-photo:after { content:""; position:absolute; inset:auto 0 0; height:36px; background:linear-gradient(12deg,#b89772,#e3c8aa); }
.fake-lines i { display:block; height:8px; margin-top:13px; border-radius:10px; background:#2a394d; }
.fake-lines i:nth-child(2) { width:75%; } .fake-lines i:nth-child(3) { width:45%; }
.visual-sliders { display:flex; flex-direction:column; justify-content:center; gap:25px; padding:30px; }
.visual-sliders > div { display:grid; grid-template-columns:45px 1fr 45px; align-items:center; gap:10px; color:var(--muted); font-size:11px; }
.visual-sliders i { height:5px; position:relative; border-radius:10px; background:#314054; }
.visual-sliders b { position:absolute; top:50%; width:13px; height:13px; transform:translate(-50%,-50%); border-radius:50%; background:var(--coral); }
.visual-sliders strong { color:var(--text); font-size:11px; text-align:right; }
.visual-result { display:flex; flex-direction:column; align-items:center; justify-content:center; }
.visual-result span { color:var(--muted); font-size:10px; font-weight:800; }
.visual-result strong { color:var(--green); font-size:70px; line-height:1.1; }
.visual-result small { color:var(--muted); font-size:18px; }
.visual-result p { margin:0; padding:6px 11px; color:var(--green); background:rgba(66,215,166,.1); border-radius:8px; font-size:11px; }

.feature-list { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-left:1px solid var(--line); }
.feature-list article { min-height:245px; padding:32px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.feature-icon { width:45px; height:45px; display:grid; place-items:center; margin-bottom:35px; border:1px solid var(--line); border-radius:12px; color:var(--coral); font-size:22px; }
.feature-list h3 { margin-bottom:9px; font-size:20px; }
.feature-list p { color:var(--muted); font-size:14px; }

.testimonial-section { padding:110px 0; border-block:1px solid var(--line); background:linear-gradient(135deg,rgba(255,111,87,.06),rgba(77,140,255,.05)); }
.testimonial-grid { display:grid; grid-template-columns:100px 1fr 240px; gap:35px; align-items:center; }
.quote-mark { color:var(--coral); font:110px/1 Georgia,serif; }
blockquote { grid-column:2/4; margin:0; max-width:900px; font-size:clamp(27px,3.3vw,46px); line-height:1.17; letter-spacing:-.035em; }
.testimonial-author { grid-column:2; display:flex; align-items:center; gap:12px; margin-top:18px; }
.author-avatar { width:46px; height:46px; display:grid; place-items:center; border-radius:50%; background:var(--panel-2); font-weight:800; }
.testimonial-author span { display:block; color:var(--muted); font-size:12px; }
.testimonial-stat { margin-top:18px; padding-left:24px; border-left:1px solid var(--line); }
.testimonial-stat strong { display:block; color:var(--green); font-size:28px; }
.testimonial-stat span { color:var(--muted); font-size:12px; }

.billing-switch {
  width:max-content; display:flex; gap:4px; margin:-20px auto 14px; padding:4px;
  border:1px solid var(--line); border-radius:13px; background:var(--bg-soft);
}
.billing-switch button {
  min-width:112px; padding:10px 15px; border:0; border-radius:9px; cursor:pointer;
  color:var(--muted); background:transparent; font-size:13px; font-weight:800;
}
.billing-switch button span { color:var(--green); }
.billing-switch button.active { color:#fff; background:var(--coral); box-shadow:0 8px 22px rgba(255,111,87,.2); }
.billing-switch button.active span { color:#fff; }
.pricing-path, .pricing-footnote { text-align:center; color:var(--muted); font-size:12px; }
.pricing-path { margin:0 auto 45px; }
.pricing-footnote { margin:22px auto 0; }
.pricing-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; align-items:stretch; }
.price-card { position:relative; display:flex; flex-direction:column; padding:32px; border:1px solid var(--line); border-radius:var(--radius); background:var(--panel); }
.price-card.featured { transform:translateY(-14px); border-color:rgba(255,111,87,.5); box-shadow:0 25px 70px rgba(255,111,87,.09); }
.popular { position:absolute; top:0; right:25px; padding:6px 10px; transform:translateY(-50%); border-radius:999px; background:var(--coral); color:white; font-size:9px; font-weight:850; letter-spacing:.08em; }
.price-label { color:var(--coral); font-size:12px; font-weight:850; text-transform:uppercase; letter-spacing:.08em; }
.price-card h3 { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px; margin:8px 0 2px; font-size:42px; }
.price-card h3 small { color:var(--muted); font-size:14px; }
.billing-detail { min-height:38px; margin:0 0 10px; color:var(--green); font-size:11px; font-weight:700; }
.price-sub { min-height:72px; color:var(--muted); }
.price-card ul { flex:1; min-height:170px; padding:18px 0 0; margin:0 0 24px; list-style:none; border-top:1px solid var(--line); }
.price-card li { margin:12px 0; color:#cad3df; font-size:14px; }
.price-card li:before { content:"✓"; margin-right:10px; color:var(--green); }

.final-cta {
  overflow:hidden; margin-bottom:100px; padding:90px max(35px,8vw);
  text-align:center; border:1px solid var(--line); border-radius:30px; background:linear-gradient(145deg,var(--panel),#101926);
}
.cta-content { position:relative; z-index:2; max-width:880px; margin:auto; }
.final-cta .eyebrow { margin-inline:auto; }
.final-cta h2 { font-size:clamp(36px,5vw,64px); line-height:1.03; letter-spacing:-.05em; }
.final-cta p { color:var(--muted); font-size:17px; }
.centered-actions { justify-content:center; }
.cta-glow { position:absolute; width:600px; height:600px; left:50%; bottom:-500px; transform:translateX(-50%); border-radius:50%; background:var(--coral); filter:blur(100px); opacity:.22; }

.site-footer { padding:60px 0 28px; display:grid; grid-template-columns:1.2fr 1fr; gap:70px; border-top:1px solid var(--line); }
.footer-brand p { max-width:420px; margin-top:22px; color:var(--muted); }
.footer-links { display:grid; grid-template-columns:repeat(3,1fr); gap:25px; }
.footer-links strong, .footer-links a { display:block; }
.footer-links strong { margin-bottom:13px; font-size:13px; }
.footer-links a { margin:9px 0; color:var(--muted); font-size:13px; }
.footer-bottom { grid-column:1/-1; display:flex; justify-content:space-between; padding-top:25px; border-top:1px solid var(--line); color:var(--muted); font-size:11px; }

.reveal { opacity:0; transform:translateY(28px); transition:opacity .65s ease,transform .65s ease; }
.reveal.visible { opacity:1; transform:none; }

@media (max-width: 1050px) {
  .hero { grid-template-columns:1fr; padding-top:130px; }
  .hero-copy { max-width:750px; }
  .hero-visual { min-width:0; width:100%; max-width:850px; margin:auto; transform:none; }
  .feature-bento { grid-template-columns:1fr 1fr; }
  .bento-large { grid-column:1/-1; min-height:670px; }
}
@media (max-width: 820px) {
  :root { --shell:min(100% - 28px,1180px); }
  .desktop-nav, .desktop-only { display:none; }
  .menu-toggle { display:flex; width:40px; height:40px; flex-direction:column; justify-content:center; gap:5px; border:1px solid var(--line); border-radius:11px; background:var(--panel); }
  .menu-toggle span { width:17px; height:2px; margin:auto; background:var(--text); }
  .mobile-menu { position:absolute; top:65px; left:14px; right:14px; padding:12px; border:1px solid var(--line); border-radius:14px; background:var(--panel); box-shadow:var(--shadow); }
  .mobile-menu.open { display:grid; }
  .mobile-menu a { padding:12px; color:var(--muted); }
  .hero { min-height:auto; padding-bottom:80px; }
  .hero-visual { overflow:hidden; }
  .app-window { min-width:720px; transform:scale(.82); transform-origin:left top; margin-bottom:-95px; }
  .floating-card { display:none; }
  .logo-values { grid-template-columns:1fr 1fr; }
  .section-heading { display:block; }
  .section-heading > p { margin-top:20px; }
  .feature-bento { grid-template-columns:1fr; }
  .bento-large { grid-column:auto; min-height:600px; }
  .steps, .pricing-grid { grid-template-columns:1fr; }
  .feature-list { grid-template-columns:1fr 1fr; }
  .testimonial-grid { grid-template-columns:55px 1fr; }
  blockquote { grid-column:2; }
  .testimonial-author { grid-column:2; }
  .testimonial-stat { grid-column:2; }
  .site-footer { grid-template-columns:1fr; }
}
@media (max-width: 560px) {
  .site-header { padding-inline:14px; }
  .header-actions .btn-primary { display:none; }
  h1 { font-size:47px; }
  .hero-lead { font-size:17px; }
  .hero-ctas .btn { width:100%; }
  .app-window { transform:scale(.64); margin-bottom:-175px; }
  .logo-values, .feature-list { grid-template-columns:1fr; }
  .bento-large { min-height:530px; }
  .mini-score strong { font-size:48px; }
  .testimonial-grid { grid-template-columns:1fr; }
  .quote-mark { height:50px; }
  blockquote, .testimonial-author, .testimonial-stat { grid-column:1; }
  .testimonial-stat { padding-left:0; border-left:0; }
  .pricing-section, .product-section, .features-section, .workflow-section { padding:85px 0; }
  .footer-links { grid-template-columns:1fr 1fr; }
  .footer-bottom { flex-direction:column; gap:8px; }
  .billing-switch { width:100%; }
  .billing-switch button { flex:1; min-width:0; }
}

/* ------------------------------
   Création de compte & callback
--------------------------------- */
.auth-body {
  min-height:100vh;
  background:
    radial-gradient(circle at 12% 20%, rgba(255,111,87,.13), transparent 34%),
    radial-gradient(circle at 88% 80%, rgba(77,140,255,.11), transparent 38%),
    var(--bg);
}
.auth-page, .callback-page { position:relative; z-index:1; width:min(1180px,calc(100% - 40px)); min-height:100vh; margin:auto; }
.auth-header { height:90px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
.auth-back, .callback-back { color:var(--muted); font-size:13px; font-weight:700; }
.auth-back:hover, .callback-back:hover { color:var(--text); }
.auth-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(420px,.82fr); gap:80px; align-items:center; min-height:calc(100vh - 90px); padding:54px 0 72px; }
.auth-offer h1 { max-width:650px; margin:14px 0 18px; font-size:clamp(44px,5.4vw,76px); line-height:.98; letter-spacing:-.055em; }
.auth-offer > p { max-width:600px; margin:0 0 34px; color:var(--muted); font-size:17px; }
.selected-offer {
  max-width:560px; padding:24px; border:1px solid rgba(255,111,87,.38);
  border-radius:18px; background:linear-gradient(145deg,rgba(255,111,87,.1),var(--panel));
  box-shadow:0 25px 70px rgba(0,0,0,.18);
}
.selected-offer-details { display:grid; grid-template-columns:1fr auto; gap:4px 20px; }
.selected-offer-details > span, .selected-offer-empty > span { grid-column:1/-1; color:var(--muted); font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.selected-offer strong { font-size:30px; letter-spacing:-.03em; }
.selected-offer b { align-self:center; color:var(--coral); font-size:18px; }
.selected-offer small { color:var(--muted); font-size:12px; }
.selected-offer-details small:nth-of-type(1) { grid-column:1; }
.selected-offer-details small:nth-of-type(2) { grid-column:2; text-align:right; }
.selected-offer-empty { display:grid; gap:7px; }
.selected-offer-empty strong { font-size:23px; }
.offer-choices { display:flex; flex-wrap:wrap; gap:8px; margin:16px 0 14px; }
.offer-choices button {
  padding:8px 13px; border:1px solid var(--line); border-radius:999px; cursor:pointer;
  color:var(--muted); background:transparent; font:inherit; font-size:12px; font-weight:750;
}
.offer-choices button:hover, .offer-choices button.active { color:var(--text); border-color:rgba(255,111,87,.55); background:rgba(255,111,87,.09); }
.auth-billing { max-width:560px; margin:0 0 28px; }
.auth-billing > span { display:block; margin-bottom:8px; color:var(--muted); font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.auth-billing-switch { width:100%; margin:0; }
.auth-billing-switch button { flex:1; min-width:0; }
.auth-benefits { display:grid; gap:12px; padding:0; margin:0; list-style:none; color:var(--muted); font-size:14px; }
.auth-benefits span { display:inline-grid; width:22px; height:22px; place-items:center; margin-right:8px; border-radius:50%; color:var(--green); background:rgba(66,215,166,.11); font-weight:900; }
.auth-card, .callback-card {
  padding:38px; border:1px solid var(--line); border-radius:24px;
  background:color-mix(in srgb,var(--panel) 92%,transparent);
  box-shadow:0 35px 100px rgba(0,0,0,.28); backdrop-filter:blur(18px);
}
.auth-card h2 { margin:0 0 7px; font-size:34px; line-height:1.05; letter-spacing:-.04em; }
.auth-card-lead { margin:0 0 25px; color:var(--muted); font-size:14px; }
.auth-tabs { display:flex; padding:5px; border-radius:13px; background:var(--bg-soft); }
.auth-tabs button { flex:1; padding:11px 10px; border:0; border-radius:9px; color:var(--muted); background:transparent; cursor:pointer; font-weight:800; }
.auth-tabs button.active { color:white; background:var(--coral); box-shadow:0 9px 24px rgba(255,111,87,.22); }
.auth-form { display:grid; gap:15px; }
.auth-name-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.auth-form label { display:grid; gap:7px; }
.auth-form label > span { color:var(--muted); font-size:11px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; }
.auth-form input {
  width:100%; height:49px; padding:0 14px; border:1px solid var(--line); border-radius:11px;
  color:var(--text); background:var(--bg-soft); outline:none; font:inherit;
}
.auth-form input:focus { border-color:rgba(255,111,87,.7); box-shadow:0 0 0 3px rgba(255,111,87,.1); }
.password-rules { margin:-7px 0 0; color:var(--muted); font-size:10px; line-height:1.45; }
.auth-status { padding:11px 13px; border:1px solid var(--line); border-radius:10px; color:var(--muted); background:var(--bg-soft); font-size:12px; line-height:1.5; }
.auth-status[data-kind="error"] { color:#ff9d8c; border-color:rgba(255,111,87,.45); background:rgba(255,111,87,.08); }
.auth-status[data-kind="success"] { color:var(--green); border-color:rgba(66,215,166,.38); background:rgba(66,215,166,.08); }
.auth-submit { min-height:50px; margin-top:3px; cursor:pointer; }
.auth-submit:disabled { cursor:wait; opacity:.62; transform:none; }
.auth-alternate {
  display:block; width:max-content; max-width:100%; margin:17px auto 0; padding:9px 13px;
  border:1px solid var(--line); border-radius:999px; color:var(--muted); text-align:center; font-size:12px;
}
.auth-alternate:hover { color:var(--text); border-color:rgba(255,111,87,.45); background:rgba(255,111,87,.07); }
.auth-alternate strong { color:var(--coral); }
.auth-legal { margin:17px 0 0; color:var(--muted); text-align:center; font-size:10px; line-height:1.5; }
.auth-success { padding:25px 0 14px; text-align:center; }
.success-icon { width:64px; height:64px; display:grid; place-items:center; margin:0 auto 25px; border-radius:50%; color:#072219; background:var(--green); box-shadow:0 16px 45px rgba(66,215,166,.25); font-size:29px; font-weight:900; }
.auth-success .eyebrow, .callback-card .eyebrow { margin-inline:auto; }
.auth-success h2 { margin:18px 0 10px; }
.auth-success > p { margin:0 auto 24px; max-width:390px; color:var(--muted); }
.auth-success .auth-status { margin-bottom:14px; text-align:left; }
.auth-success > small { display:block; margin-top:13px; color:var(--muted); }
.callback-page { display:grid; place-items:center; padding:65px 0; }
.callback-page > .brand { position:absolute; top:30px; left:0; }
.callback-card { width:min(100%,550px); text-align:center; }
.callback-card h1 { margin:20px 0 12px; font-size:38px; line-height:1.05; letter-spacing:-.045em; }
.callback-card > p { color:var(--muted); }
.callback-offer { display:grid; gap:4px; margin:27px 0; padding:18px; border:1px solid var(--line); border-radius:14px; background:var(--bg-soft); }
.callback-offer span { color:var(--muted); font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.callback-offer strong { font-size:25px; }
.callback-offer b { color:var(--coral); }
.callback-offer small { color:var(--muted); }
.callback-card .auth-status { margin-bottom:14px; text-align:left; }
.callback-back { display:inline-block; margin-top:18px; }
[hidden] { display:none !important; }

@media (max-width: 900px) {
  .auth-layout { grid-template-columns:1fr; gap:45px; padding-top:45px; }
  .auth-offer h1 { max-width:720px; }
  .selected-offer { max-width:none; }
}
@media (max-width: 560px) {
  .auth-page, .callback-page { width:min(100% - 24px,1180px); }
  .auth-header { height:72px; }
  .auth-layout { min-height:calc(100vh - 72px); padding:35px 0 50px; }
  .auth-offer h1 { font-size:43px; }
  .auth-offer > p { font-size:15px; }
  .auth-card, .callback-card { padding:24px 20px; border-radius:19px; }
  .auth-card h2 { font-size:30px; }
  .auth-name-grid { grid-template-columns:1fr; }
  .selected-offer-details { grid-template-columns:1fr; }
  .selected-offer b, .selected-offer-details small:nth-of-type(2) { grid-column:1; text-align:left; }
  .callback-page { padding-top:100px; }
  .callback-page > .brand { top:28px; }
  .callback-card h1 { font-size:32px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
  .reveal { opacity: 1; transform: none; }
}