@font-face { font-family: "Schibsted Grotesk"; font-weight: 400; font-style: normal; font-display: swap; src: url("/assets/fonts/SchibstedGrotesk_400Regular.ttf") format("truetype"); }
@font-face { font-family: "Schibsted Grotesk"; font-weight: 600; font-style: normal; font-display: swap; src: url("/assets/fonts/SchibstedGrotesk_600SemiBold.ttf") format("truetype"); }
@font-face { font-family: "Schibsted Grotesk"; font-weight: 800; font-style: normal; font-display: swap; src: url("/assets/fonts/SchibstedGrotesk_800ExtraBold.ttf") format("truetype"); }

:root { --forest:#0E5A3A; --deep:#0B4A30; --ink:#14211A; --soft:#55645B; --canvas:#EEF0EA; --paper:#fff; --sun:#F4C21B; --sunsoft:#FCEFC2; --mint:#E3EFE7; --line:#DDE2D8; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; font-family:"Schibsted Grotesk", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; color:var(--ink); background:var(--paper); line-height:1.55; -webkit-font-smoothing:antialiased; }
html[data-lang="en"] [lang="fr"], html[data-lang="fr"] [lang="en"], html:not([data-lang]) [lang="fr"] { display:none !important; }
a { color:var(--forest); }
img { max-width:100%; display:block; }
.wrap { width:100%; max-width:1180px; margin:0 auto; padding:0 24px; }
.eyebrow { display:inline-block; font-size:13px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--forest); background:var(--mint); padding:6px 12px; border-radius:20px; }
h1, h2, h3 { margin:0; letter-spacing:-.03em; line-height:1.08; font-weight:800; }
h1 { font-size:clamp(38px, 6vw, 68px); }
h2 { font-size:clamp(28px, 4vw, 42px); }
h3 { font-size:20px; letter-spacing:-.02em; }
p { margin:0; }
.lead { font-size:clamp(17px, 2vw, 20px); color:var(--soft); max-width:560px; }

/* header */
.nav { position:sticky; top:0; z-index:50; background:rgba(255,255,255,.92); backdrop-filter:saturate(1.4) blur(10px); border-bottom:1px solid var(--line); }
.nav .wrap { display:flex; align-items:center; gap:28px; height:72px; }
.nav img.logo { height:34px; width:auto; }
.screen .bar img { width:auto; }
.nav nav { display:flex; gap:22px; margin-left:12px; }
.nav nav a { color:var(--ink); text-decoration:none; font-weight:600; font-size:15px; }
.nav nav a:hover { color:var(--forest); }
.nav .right { margin-left:auto; display:flex; align-items:center; gap:14px; }
.lang { display:flex; gap:2px; background:var(--canvas); border-radius:20px; padding:3px; }
.lang button { border:0; background:transparent; color:var(--ink); font:inherit; font-weight:700; font-size:13px; min-width:42px; height:30px; border-radius:15px; cursor:pointer; }
.lang button[aria-pressed="true"] { background:var(--ink); color:#fff; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; text-decoration:none; font-weight:800; font-size:16px; padding:15px 26px; border-radius:30px; border:2px solid transparent; cursor:pointer; font-family:inherit; line-height:1; }
.btn.primary { background:var(--ink); color:#fff; }
.btn.primary:hover { background:#000; }
.btn.sun { background:var(--sun); color:var(--ink); }
.btn.ghost { background:transparent; color:var(--ink); border-color:var(--ink); }
.btn.small { padding:11px 20px; font-size:15px; }
.btn[aria-disabled="true"] { opacity:.6; cursor:default; }
.btn.light { background:#fff; color:var(--ink); }
.btn.lightghost { background:transparent; color:#fff; border-color:rgba(255,255,255,.7); }

/* hero */
.hero { position:relative; overflow:hidden; background:linear-gradient(180deg, var(--canvas) 0%, #fff 100%); padding:72px 0 88px; }
.hero .wrap { display:grid; grid-template-columns:1.1fr .9fr; gap:56px; align-items:center; }
.hero h1 em { font-style:normal; color:var(--forest); }
.hero .lead { margin:22px 0 32px; }
.cta { display:flex; flex-wrap:wrap; gap:12px; }
.hero .facts { display:flex; flex-wrap:wrap; gap:10px 26px; margin-top:34px; color:var(--soft); font-size:15px; font-weight:600; }
.hero .facts span { display:inline-flex; align-items:center; gap:8px; }
.dot { width:8px; height:8px; border-radius:50%; background:var(--forest); display:inline-block; }
.visual { position:relative; display:flex; justify-content:center; }
.phone { position:relative; width:300px; border-radius:42px; background:#fff; border:10px solid var(--ink); box-shadow:0 40px 80px rgba(20,33,26,.22); overflow:hidden; }
.screen { background:var(--canvas); padding:18px 14px 16px; display:flex; flex-direction:column; gap:12px; min-height:540px; }
.screen .bar { display:flex; align-items:center; justify-content:space-between; }
.screen .bar img { height:22px; }
.screen .q { display:flex; align-items:center; gap:8px; background:#fff; border-radius:24px; padding:11px 14px; font-size:13px; color:var(--soft); box-shadow:0 1px 0 var(--line); }
.screen .chips { display:flex; gap:6px; flex-wrap:wrap; }
.screen .chips > span { font-size:11px; font-weight:700; background:#fff; border-radius:16px; padding:6px 10px; }
.screen .chips > span.on { background:var(--ink); color:#fff; }
.screen .grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.pcard { background:#fff; border-radius:14px; padding:7px; display:flex; flex-direction:column; gap:5px; }
.pcard img { width:100%; height:auto; aspect-ratio:1; object-fit:cover; border-radius:10px; }
.pcard b { font-size:12px; line-height:1.2; }
.pcard > span { font-size:12px; font-weight:800; }
.pcard > i { font-style:normal; font-size:10px; color:var(--soft); }
.float { position:absolute; background:#fff; border-radius:18px; box-shadow:0 18px 40px rgba(20,33,26,.18); padding:14px 16px; }
.float.code { right:-70px; bottom:60px; }
.float.code small { display:block; font-size:11px; font-weight:700; color:var(--soft); margin-bottom:8px; }
.float.code .boxes { display:flex; gap:5px; }
.float.code .boxes b { width:30px; height:38px; border-radius:9px; background:var(--canvas); display:flex; align-items:center; justify-content:center; font-size:18px; font-weight:800; }
.float.rate { left:-112px; top:330px; display:flex; align-items:center; gap:10px; font-weight:800; font-size:14px; }
.float.rate .stars { color:var(--sun); letter-spacing:2px; font-size:16px; }
.float.rate small { display:block; font-weight:600; color:var(--soft); font-size:11px; }

/* sections */
section { padding:88px 0; }
.head { max-width:640px; margin-bottom:44px; display:grid; gap:14px; }
.head.center { margin-inline:auto; text-align:center; justify-items:center; }
.cats { display:grid; grid-template-columns:repeat(6, 1fr); gap:16px; }
.cat { color:var(--ink); text-decoration:none; transition:transform .15s; display:flex; flex-direction:column; align-items:center; gap:14px; padding:26px 12px; border-radius:20px; background:var(--canvas); text-align:center; font-weight:800; }
.cat:hover { transform:translateY(-3px); }
.cat .ic { width:64px; height:64px; border-radius:50%; background:var(--mint); position:relative; }
.cat .ic::after, .ico::after { content:""; position:absolute; inset:0; margin:auto; width:30px; height:30px; background:var(--forest); -webkit-mask:var(--m) center/contain no-repeat; mask:var(--m) center/contain no-repeat; }
.steps { display:grid; grid-template-columns:repeat(4, 1fr); gap:20px; counter-reset:step; }
.step { background:#fff; border:1px solid var(--line); border-radius:22px; padding:28px 24px; display:grid; gap:12px; align-content:start; }
.step .n { width:40px; height:40px; border-radius:50%; background:var(--ink); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:800; }
.step p { color:var(--soft); font-size:16px; }
.alt { background:var(--canvas); }
.split { display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; }
.list { display:grid; gap:18px; margin:28px 0 34px; padding:0; list-style:none; }
.list li { display:flex; gap:14px; align-items:flex-start; }
.list .ico { flex:none; width:44px; height:44px; border-radius:50%; background:var(--mint); position:relative; }
.list b { display:block; font-size:17px; }
.list span.t { color:var(--soft); font-size:15px; }
.panel { background:var(--deep); color:#fff; border-radius:28px; padding:40px; position:relative; overflow:hidden; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='52' height='52'%3E%3Cpath d='M26 2 50 26 26 50 2 26Z' fill='none' stroke='%232F7A55' stroke-width='2'/%3E%3Cpath d='M26 12 40 26 26 40 12 26Z' fill='none' stroke='%232F7A55' stroke-width='2'/%3E%3Cpath d='M26 20 32 26 26 32 20 26Z' fill='%23F4C21B'/%3E%3C/svg%3E"); }
.panel .inner { background:var(--deep); border-radius:20px; padding:28px; display:grid; gap:10px; }
.panel .big { font-size:clamp(40px,5vw,60px); font-weight:800; letter-spacing:-.03em; line-height:1; }
.panel .big small { font-size:.4em; font-weight:600; opacity:.8; }
.panel p { color:rgba(255,255,255,.85); }
.safety { display:grid; grid-template-columns:repeat(3, 1fr); gap:20px; }
.card { background:#fff; border:1px solid var(--line); border-radius:22px; padding:28px; display:grid; gap:12px; align-content:start; }
.card .ico { width:52px; height:52px; border-radius:50%; background:var(--mint); position:relative; }
.card p { color:var(--soft); }
.faq { max-width:820px; margin:0 auto; display:grid; gap:12px; }
details { background:#fff; border:1px solid var(--line); border-radius:18px; padding:0 22px; }
details[open] { border-color:var(--forest); }
summary { cursor:pointer; list-style:none; font-weight:800; font-size:18px; padding:20px 0; display:flex; justify-content:space-between; gap:16px; }
summary::-webkit-details-marker { display:none; }
summary::after { content:"+"; font-size:26px; line-height:1; color:var(--forest); }
details[open] summary::after { content:"–"; }
details p { color:var(--soft); padding-bottom:22px; max-width:680px; }
.final { background:var(--forest); color:#fff; text-align:center; padding:96px 0; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='52' height='52'%3E%3Cpath d='M26 2 50 26 26 50 2 26Z' fill='none' stroke='%2314704A' stroke-width='2'/%3E%3Cpath d='M26 12 40 26 26 40 12 26Z' fill='none' stroke='%2314704A' stroke-width='2'/%3E%3C/svg%3E"); }
.final .box { background:var(--forest); display:inline-grid; gap:22px; padding:36px 48px; border-radius:28px; justify-items:center; }
.final h2 { max-width:640px; }
.final p { color:rgba(255,255,255,.85); max-width:520px; }
.final .cta { justify-content:center; }

/* footer */
footer { background:#14211A; color:rgba(255,255,255,.78); padding:64px 0 28px; font-size:15px; }
footer .cols { display:grid; grid-template-columns:1.5fr repeat(4, 1fr); gap:32px; }
footer img { height:32px; width:auto; margin-bottom:14px; }
footer h4 { margin:0 0 14px; color:#fff; font-size:15px; }
footer a { display:block; color:rgba(255,255,255,.78); text-decoration:none; margin-bottom:10px; }
footer a:hover { color:#fff; }
footer .bottom { margin-top:40px; padding-top:20px; border-top:1px solid rgba(255,255,255,.14); display:flex; flex-wrap:wrap; gap:12px 24px; justify-content:space-between; align-items:center; font-size:13px; }
footer #social { display:flex; flex-wrap:wrap; gap:6px 18px; }
footer #social a { display:inline; margin:0; }
footer .lang { background:rgba(255,255,255,.14); }
footer .lang button { color:#fff; }
footer .lang button[aria-pressed="true"] { background:#fff; color:var(--ink); }

@media (max-width: 960px) {
  .hero .wrap, .split { grid-template-columns:1fr; gap:44px; }
  .steps { grid-template-columns:1fr 1fr; }
  .cats { grid-template-columns:repeat(3, 1fr); }
  .safety { grid-template-columns:1fr; }
  footer .cols { grid-template-columns:1fr 1fr; }
  .nav nav { display:none; }
  .float.code { right:0; }
  .float.rate { left:0; }
}
@media (max-width: 560px) {
  .wrap { padding:0 18px; }
  section { padding:64px 0; }
  .hero { padding:44px 0 64px; }
  .steps { grid-template-columns:1fr; }
  .cats { grid-template-columns:1fr 1fr; }
  .nav .wrap { gap:12px; height:64px; }
  .nav .btn { display:none; }
  .panel { padding:22px; }
  .final .box { padding:24px 8px; }
  footer .cols { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } }

/* icons: drawn with the founder's icon pack, coloured by the page */
.i-furniture { --m:url(/assets/icons/furniture.svg); }
.i-beds { --m:url(/assets/icons/beds.svg); }
.i-kitchen { --m:url(/assets/icons/kitchen.svg); }
.i-appliances { --m:url(/assets/icons/appliances.svg); }
.i-decor { --m:url(/assets/icons/decor.svg); }
.i-other { --m:url(/assets/icons/other.svg); }
.i-search { --m:url(/assets/icons/search.svg); }
.i-handoff { --m:url(/assets/icons/handoff.svg); }
.i-shield-check { --m:url(/assets/icons/shield-check.svg); }
.i-camera { --m:url(/assets/icons/camera.svg); }
.i-tag { --m:url(/assets/icons/tag.svg); }
.i-heart { --m:url(/assets/icons/heart.svg); }
.i-flag { --m:url(/assets/icons/flag.svg); }
.i-lock { --m:url(/assets/icons/lock.svg); }
.i-mail { --m:url(/assets/icons/mail.svg); }
.i-map-pin { --m:url(/assets/icons/map-pin.svg); }
.i-check-circle { --m:url(/assets/icons/check-circle.svg); }
.i-send { --m:url(/assets/icons/send.svg); }
.i-wallet { --m:url(/assets/icons/wallet.svg); }
.i-deals { --m:url(/assets/icons/deals.svg); }
.i-verified { --m:url(/assets/icons/verified.svg); }
.i-star { --m:url(/assets/icons/star.svg); }

/* Waitlist */
.waitlist { padding:72px 0 8px; }
.wl-box { background:var(--sunsoft); border-radius:28px; padding:40px 44px; display:grid; gap:14px; text-align:center; justify-items:center; }
.wl-box h2 { margin:0; }
.wl-box > p { margin:0; color:var(--soft); max-width:560px; }
#wl-form { width:100%; max-width:760px; display:grid; gap:12px; }
.wl-row { display:flex; flex-wrap:wrap; gap:10px; justify-content:center; }
.wl-row input[type=email], .wl-row select { font:inherit; font-size:16px; padding:14px 18px; border-radius:30px; border:2px solid var(--line); background:#fff; color:var(--ink); min-height:52px; }
.wl-row input[type=email] { flex:1 1 260px; min-width:0; }
.wl-row select { flex:0 1 220px; }
.wl-row input:focus, .wl-row select:focus { outline:3px solid var(--forest); outline-offset:1px; }
.wl-row .btn { border:0; cursor:pointer; font-family:inherit; }
.wl-row .btn[disabled] { opacity:.6; cursor:default; }
.hp { position:absolute; left:-9999px; width:1px; height:1px; opacity:0; }
.sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.wl-note { margin:0; font-size:13px; color:var(--soft); }
.wl-note a { color:var(--forest); }
.wl-msg { margin:0; min-height:1.4em; font-weight:700; color:var(--forest); }
.wl-msg.error { color:#A12C1F; }
@media (max-width:640px) { .wl-box { padding:28px 18px; } .wl-row select, .wl-row .btn { flex:1 1 100%; } }
