:root { --ink:#17241f; --muted:#60706a; --paper:#f7f7f2; --lime:#d7fb68; --green:#1a5a44; --line:#dce3dc; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; line-height:1.55; }
.site-header, main > section, footer { max-width:1180px; margin:auto; }
.site-header { min-height:136px; display:flex; align-items:center; justify-content:space-between; padding:18px 30px; }
.brand { display:flex; align-items:center; gap:18px; color:var(--ink); font-size:3.75rem; font-weight:800; letter-spacing:-.065em; line-height:1; text-decoration:none; white-space:nowrap; }
.app-icon { width:76px; height:76px; flex:0 0 76px; border-radius:18px; object-fit:cover; box-shadow:0 6px 16px #17241f2b; }
.language-select { width:180px; min-height:44px; padding:8px 34px 8px 10px; border:1px solid var(--line); border-radius:8px; background:var(--paper); color:var(--green); font:inherit; font-size:1rem; font-weight:700; }
footer a:hover { text-decoration:underline; }
.long-brand { font-size:clamp(2rem,4vw,3.2rem); }
.hero { display:grid; min-height:620px; grid-template-columns:1fr .9fr; align-items:center; gap:70px; padding:72px 56px 90px; }
.eyebrow { margin:0 0 15px; color:var(--green); font-size:.875rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.hero h1, h2 { margin:0; letter-spacing:-.055em; line-height:1.04; }
.hero h1 { max-width:690px; font-size:clamp(3.2rem,6vw,5.7rem); }
.hero h1 em { color:var(--green); font-style:normal; }
.lead { max-width:555px; margin:27px 0 32px; color:var(--muted); font-size:1.13rem; }
.store-links { display:flex; flex-wrap:wrap; gap:12px; }
.store-badge-link { display:block; flex:0 0 auto; height:48px; line-height:0; text-decoration:none; transition:transform .18s,box-shadow .18s; }
.store-badge-link:hover { box-shadow:0 8px 18px #17241f2e; transform:translateY(-2px); }
.store-badge { display:block; width:auto; height:48px; max-width:100%; }
.app-store-badge-link { width:161px; overflow:hidden; }
.app-store-badge { max-width:none; height:161px; margin-top:-57px; }
.calculator-wrap { width:min(100%,350px); justify-self:center; aspect-ratio:940 / 1672; border-radius:28px; background:#000; box-shadow:20px 22px 0 #c9d3c9; transform:rotate(4deg); overflow:hidden; }
.calculator-hero { display:block; width:100%; height:100%; object-fit:cover; }
.features { padding:105px 56px; border-top:1px solid var(--line); }
.section-intro { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:46px; }
.section-intro h2, .concept h2, .closing h2 { font-size:clamp(2.5rem,4.4vw,4.25rem); }
.feature-grid { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line); }
.feature-grid article { min-height:210px; margin-right:24px; padding:29px 24px 14px 0; border-right:1px solid var(--line); }
.feature-grid article:last-child { margin:0; border:0; }
.feature-number { color:var(--green); font-size:.875rem; font-weight:800; }
.feature-grid h3 { margin:30px 0 9px; font-size:1.19rem; letter-spacing:-.03em; }
.feature-grid p { margin:0; color:var(--muted); font-size:1.03rem; }
.concept { display:grid; max-width:none; grid-template-columns:.9fr 1fr; gap:100px; padding:108px max(56px,calc((100vw - 1068px)/2)); background:var(--green); color:#fff; }
.concept > div { max-width:530px; }
.concept .eyebrow, .concept-copy .emphasis { color:var(--lime); }
.concept h2 { max-width:430px; }
.concept-copy { color:#d4e1db; font-size:1.12rem; }
.concept-copy p { margin:0 0 19px; }
.concept-copy .emphasis { font-weight:750; }
.faq { display:grid; grid-template-columns:.7fr 1.3fr; gap:80px; padding:88px 56px 62px; border-bottom:1px solid var(--line); }
.faq-heading h2 { font-size:clamp(2.25rem,4vw,3.6rem); }
.faq-list article { padding:0 0 23px; margin:0 0 23px; border-bottom:1px solid var(--line); }
.faq-list article:last-child { margin-bottom:0; border-bottom:0; }
.faq-list h3 { margin:0 0 7px; font-size:1.08rem; letter-spacing:-.02em; }
.faq-list p { margin:0; color:var(--muted); font-size:1.06rem; }
.closing { padding:105px 30px; text-align:center; }
.closing h2 { margin-bottom:15px; }
.closing > p:not(.eyebrow) { margin:0 0 29px; color:var(--muted); font-size:1.1rem; }
.closing .store-links { justify-content:center; }
footer { display:flex; justify-content:space-between; gap:20px; padding:25px 30px; border-top:1px solid var(--line); color:var(--muted); font-size:.92rem; }
footer nav { display:flex; gap:20px; }
footer a { min-height:40px; display:inline-flex; align-items:center; padding:6px 2px; color:var(--ink); text-decoration:none; }
a:focus-visible { border-radius:3px; outline:3px solid #e6ab00; outline-offset:4px; }
.language-select:focus-visible { outline:3px solid #e6ab00; outline-offset:4px; }
[dir="rtl"] .store-links { direction:ltr; }
@media (max-width:760px) {
  .site-header { min-height:88px; padding:12px 20px; }
  .brand, .long-brand { min-width:0; gap:11px; font-size:clamp(1.25rem,5vw,2.05rem); }.brand span { overflow:hidden; text-overflow:ellipsis; }.app-icon { width:48px; height:48px; flex-basis:48px; border-radius:12px; }.language-select { width:145px; }
  .hero { grid-template-columns:1fr; gap:53px; padding:50px 24px 75px; }
  .hero h1 { overflow-wrap:break-word; font-size:clamp(3rem,14vw,4.4rem); }.lead { font-size:1.08rem; }
  .hero .store-links { flex-direction:column; align-items:center; }
  .calculator-wrap { width:min(76vw,310px); box-shadow:10px 12px 0 #c9d3c9; transform:rotate(1.5deg); }
  .features { padding:72px 24px; }.section-intro { display:block; }.section-intro .eyebrow { margin-bottom:11px; }
  .feature-grid { grid-template-columns:1fr; }.feature-grid article { min-height:0; margin:0; padding:24px 0; border-right:0; border-bottom:1px solid var(--line); }
  .feature-grid article:nth-child(2) { margin:0; border-right:0; }.feature-grid article:nth-child(n+3) { border-bottom:1px solid var(--line); }.feature-grid article:last-child { border-bottom:0; }.feature-grid h3 { margin-top:18px; }
  .concept { grid-template-columns:1fr; gap:36px; padding:75px 24px; }.faq { grid-template-columns:1fr; gap:30px; padding:64px 24px 45px; }.closing { padding:75px 24px; }
  footer { display:block; padding:25px 20px; }footer nav { flex-wrap:wrap; gap:15px; margin-top:13px; }
}
@media (max-width:360px) {
  .site-header { flex-wrap:wrap; gap:8px; padding:10px 15px; }.brand, .long-brand { gap:7px; font-size:1.13rem; }.app-icon { width:38px; height:38px; flex-basis:38px; border-radius:10px; }.language-select { width:132px; min-height:40px; font-size:.94rem; }.hero { padding-right:18px; padding-left:18px; }
  .store-links { flex-direction:column; align-items:center; }.closing .store-badge-link { justify-self:center; }.features { padding-right:18px; padding-left:18px; }
  .feature-grid { grid-template-columns:1fr; }.feature-grid article, .feature-grid article:nth-child(2) { margin:0; padding:22px 0; border-right:0; border-bottom:1px solid var(--line); }.feature-grid article:last-child { border-bottom:0; }
  .concept, .faq { padding-right:18px; padding-left:18px; }
}
