/* Tatmamotors · editorial retail website */
:root {
  --ink:#252b28; --muted:#616a63; --paper:#fcfbf8; --soft:#f0eee7;
  --line:#dcdfd7; --red:#a72b30; --red-dark:#852026; --green:#315c44;
  --sans:"Segoe UI",Arial,Helvetica,sans-serif;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:110px; }
body { margin:0; color:var(--ink); background:var(--paper); font:16px/1.7 var(--sans); -webkit-font-smoothing:antialiased; }
body.no-scroll { overflow:hidden; }
button,input,textarea { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
button { cursor:pointer; color:inherit; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; height:auto; }
h1,h2,h3,p,figure,blockquote { margin:0; }
h1,h2,h3 { line-height:1.1; letter-spacing:-.045em; font-weight:500; }
h2 { font-size:clamp(36px,3.7vw,52px); }
h3 { letter-spacing:-.025em; }
address { font-style:normal; }
::selection { color:var(--ink); background:#eed7d4; }
[hidden] { display:none!important; }
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible { outline:3px solid #aa3c43; outline-offset:5px; }
.wrap { width:min(1240px,calc(100% - 112px)); margin-inline:auto; }
.section { padding-block:100px; }
.eyebrow { display:flex; align-items:center; gap:11px; color:var(--red); font-size:10px; line-height:1.6; font-weight:650; letter-spacing:.16em; margin-bottom:24px; }
.eyebrow::before { content:""; width:22px; height:1px; background:currentColor; flex-shrink:0; }
.icon { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; vertical-align:middle; }
.icon-definitions { position:absolute; width:0; height:0; overflow:hidden; }
.skip-link { position:fixed; left:20px; top:12px; padding:12px 18px; z-index:100; background:var(--ink); color:white; border-radius:5px; transform:translateY(-150%); }
.skip-link:focus { transform:translateY(0); }
.button { display:inline-flex; align-items:center; justify-content:center; gap:20px; min-height:54px; padding:15px 23px; border:1px solid transparent; border-radius:5px; font-size:13px; line-height:1.5; font-weight:600; transition:background .2s,transform .2s,border-color .2s; }
.button:hover { transform:translateY(-2px); }
.button .icon { width:19px; height:19px; }
.button-accent,.button-header { color:#fff; background:var(--red); }
.button-accent:hover,.button-header:hover { background:var(--red-dark); }
.button-dark { background:var(--ink); color:#fff; }
.button-dark:hover { background:#404b43; }
.button-outline { background:transparent; border-color:#cbd1c8; }
.button-outline:hover { background:#fff; border-color:#7d9181; }
.button-outline .icon { color:var(--green); }
.button-small { min-height:44px; padding:10px 17px; gap:16px; font-size:12px; }
.text-link { display:inline-flex; align-items:center; justify-content:space-between; gap:18px; min-height:40px; padding:5px 0; border:0; border-bottom:1px solid #aeb7a9; background:transparent; font-size:13px; font-weight:550; line-height:1.5; }
.text-link .icon { width:18px; height:18px; }
.text-link:hover { color:var(--red); border-color:var(--red); }

/* Quiet, fixed header. Only the header contains the scooter logo. */
.site-header { position:sticky; top:0; z-index:30; height:92px; background:#fcfbf8f5; border-bottom:1px solid #e4e5dd; backdrop-filter:blur(14px); transition:box-shadow .2s; }
.site-header.is-sticky { box-shadow:0 4px 22px #25302608; }
.header-inner { display:flex; justify-content:space-between; align-items:center; gap:26px; height:100%; }
.brand { display:inline-flex; align-items:center; gap:11px; white-space:nowrap; line-height:1; }
.brand-scooter { width:68px; height:46px; object-fit:contain; }
.brand-wordmark { font-size:28px; letter-spacing:-1px; font-weight:400; font-kerning:normal; }
.brand-wordmark small { display:block; text-align:center; color:#626c61; font-size:7px; letter-spacing:.14em; font-weight:600; margin-top:9px; }
.desktop-nav { display:flex; gap:29px; margin-left:auto; margin-right:19px; }
.desktop-nav a { position:relative; font-size:12px; padding:10px 0; }
.desktop-nav a::after { content:""; position:absolute; bottom:3px; left:0; right:0; height:1px; background:var(--red); transform:scaleX(0); transform-origin:left; transition:transform .2s; }
.desktop-nav a:hover::after,.desktop-nav a.active::after { transform:scaleX(1); }
.menu-toggle { display:none; width:44px; height:44px; border:0; background:transparent; flex-direction:column; justify-content:center; align-items:center; gap:7px; }
.menu-toggle span { width:24px; height:1.5px; background:currentColor; transition:transform .2s; }
.menu-toggle[aria-expanded="true"] span:first-child { transform:translateY(4.25px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:last-child { transform:translateY(-4.25px) rotate(-45deg); }
.mobile-nav { position:fixed; top:92px; left:0; right:0; height:calc(100dvh - 92px); background:var(--paper); overflow:auto; padding:25px 6vw calc(30px + env(safe-area-inset-bottom)); }
.mobile-nav>a { display:flex; justify-content:space-between; align-items:center; padding:14px 0; border-bottom:1px solid var(--line); font-size:25px; line-height:1.4; letter-spacing:-.03em; }
.mobile-nav .mobile-phone,.mobile-nav .mobile-whatsapp { font-size:16px; justify-content:flex-start; gap:13px; letter-spacing:0; }
.mobile-nav .mobile-phone { margin-top:20px; color:var(--red); }
.mobile-nav .mobile-whatsapp { color:var(--green); }

/* Large photograph, open typography and a clear contact choice. */

/* Four different photographs, one per category. */
.section-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:65px; margin-bottom:46px; }
.section-heading>p { max-width:355px; color:var(--muted); font-size:14px; line-height:1.9; padding-bottom:3px; }
.offer-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:23px; }
.offer-card { min-width:0; }
.card-image-link { display:block; width:100%; padding:0; border:0; background:transparent; text-align:left; border-radius:8px; }
.card-image { display:block; position:relative; aspect-ratio:1; overflow:hidden; border-radius:8px; background:#e9e8e1; }
.card-image img { width:100%; height:100%; object-fit:contain; transition:transform .55s cubic-bezier(.2,.6,.2,1); }
.image-arrow { position:absolute; right:12px; bottom:12px; display:grid; place-items:center; width:36px; height:36px; border-radius:50%; background:#fffffff0; color:var(--ink); transition:background .2s,color .2s; }
.image-arrow .icon { width:17px; height:17px; }
.card-image-link:hover img { transform:scale(1.025); }
.card-image-link:hover .image-arrow { background:var(--red); color:#fff; }
.card-text { padding-top:23px; }
.card-kicker { color:#68745f; font-size:8px; letter-spacing:.1em; font-weight:600; margin-bottom:11px; }
.card-text h3 { font-size:30px; margin-bottom:13px; }
.card-text>p:not(.card-kicker) { color:var(--muted); font-size:13px; line-height:1.85; min-height:73px; margin-bottom:17px; }
.card-text .text-link { font-size:12px; }
.offer-note { display:flex; align-items:center; justify-content:space-between; gap:25px; border-top:1px solid var(--line); padding-top:22px; margin-top:39px; color:#66725d; font-size:11px; line-height:1.8; }

/* Human contact, expressed through text instead of a repeated brand image. */
.about { background:#28322c; color:#fff; }
.about-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:100px; }
.about-copy .eyebrow { color:#e9c0b7; }
.about-copy h2 { font-size:clamp(38px,4vw,56px); }
.about-copy h2 span { color:#c8d1c3; }
.about-copy p.lead { color:#fff; font-size:17px; margin-top:27px; }
.about-copy p:not(.eyebrow):not(.lead) { color:#c1cbbd; font-size:14px; line-height:1.9; margin-top:17px; max-width:430px; }
.about-copy .text-link { color:#fff; border-color:#879782; margin-top:28px; }
.about-copy .text-link:hover { border-color:#fff; }
.about-values article { display:flex; align-items:flex-start; gap:20px; padding-block:26px; border-bottom:1px solid #ffffff24; }
.about-values article:first-child { padding-top:0; }
.about-values article:last-child { padding-bottom:0; border:0; }
.value-icon { flex-shrink:0; width:28px; color:#dfb2a9; padding-top:3px; }
.value-icon .icon { width:23px; height:23px; }
.about-values h3 { font-size:21px; line-height:1.35; }
.about-values p { color:#c1cbbd; font-size:13px; line-height:1.9; margin-top:10px; }

/* Spare parts: useful request guidance instead of a second product photo. */
.parts { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:100px; }
.parts-copy h2 span { color:#687461; }
.parts-copy>p:not(.eyebrow) { color:var(--muted); font-size:15px; line-height:1.9; max-width:430px; margin-top:24px; }
.parts-copy>.button { margin-top:29px; }
.parts-copy>p.parts-small { font-size:11px; margin-top:16px; }
.parts-guide { background:#f0eee6; border:1px solid #e3e3d8; border-radius:10px; padding:35px 38px; }
.guide-label { color:#65715c; font-size:9px; letter-spacing:.12em; font-weight:600; margin-bottom:16px; }
.parts-guide h3 { font-size:30px; line-height:1.2; }
.parts-checklist { margin:25px 0 0; padding:0; list-style:none; }
.parts-checklist li { display:flex; align-items:flex-start; gap:21px; border-top:1px solid #d8dcd0; padding-block:19px; }
.parts-checklist li>span { color:var(--red); font-size:11px; padding-top:2px; }
.parts-checklist strong { font-size:14px; font-weight:600; }
.parts-checklist p { font-size:12px; color:var(--muted); margin-top:4px; line-height:1.8; }
.guide-whatsapp { display:flex; align-items:center; gap:12px; padding:17px 0 0; border-top:1px solid #d8dcd0; color:var(--green); font-size:13px; font-weight:600; }
.guide-whatsapp>.icon:first-child { width:20px; height:20px; }
.guide-whatsapp>.icon:last-child { width:18px; height:18px; margin-left:auto; }
.guide-whatsapp:hover { color:#193e29; }

/* Customer voices */

/* Simple next steps and native, keyboard-accessible FAQ. */
.process { background:#efeee7; border-block:1px solid #e0e2d7; padding-block:78px; }
.process .section-heading { margin-bottom:38px; }
.process .section-heading h2 { font-size:clamp(34px,3.2vw,45px); }
.steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:45px; }
.steps article { border-top:1px solid #cbd1c2; padding-top:20px; }
.step-number { display:flex; justify-content:space-between; align-items:center; color:#73816a; font-size:27px; font-weight:400; line-height:1; margin-bottom:25px; }
.step-number>span { color:var(--red); font-size:21px; }
.steps h3 { font-size:22px; line-height:1.25; margin-bottom:14px; }
.steps p { color:var(--muted); font-size:13px; line-height:1.85; }
.faq { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:100px; }
.faq>div>p:not(.eyebrow) { margin-block:26px 21px; color:var(--muted); font-size:14px; line-height:1.9; }
.faq-list details { border-bottom:1px solid var(--line); }
.faq-list details:first-child { border-top:1px solid var(--line); }
.faq-list summary { list-style:none; display:flex; justify-content:space-between; align-items:center; gap:25px; cursor:pointer; padding-block:23px; font-size:15px; font-weight:550; line-height:1.6; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary .icon { width:18px; height:18px; color:#71816a; transition:transform .2s; }
.faq-list details[open] summary .icon { transform:rotate(45deg); }
.faq-list details>p { color:var(--muted); font-size:14px; line-height:1.85; padding:0 35px 24px 0; }
.faq-list details>p a { text-decoration:underline; text-underline-offset:3px; }

/* Contact form and direct links */
.contact { background:#f0f0e9; border-top:1px solid #dce0d3; }
.inquiry-panel { min-width:0; scroll-margin-top:115px; }
.inquiry-form { background:#fff; border:1px solid #dce1d3; border-radius:10px; padding:36px; box-shadow:0 13px 40px #2d40240a; }
.inquiry-form .form-eyebrow { font-size:8px; margin-bottom:16px; }
.inquiry-form .form-eyebrow::before { width:17px; }
.inquiry-form h3 { font-size:30px; line-height:1.18; }
.form-intro { color:var(--muted); font-size:13px; line-height:1.85; margin:13px 0 26px; }
.inquiry-form fieldset { min-width:0; border:0; padding:0; margin:0; }
.inquiry-form legend,.field-label { display:block; color:var(--ink); font-size:12px; font-weight:600; margin-bottom:11px; }
.field-label { margin-top:21px; }
.field-label>span { font-size:11px; font-weight:400; color:#66735c; }
.topic-options { display:flex; flex-wrap:wrap; gap:8px; }
.topic-options label { position:relative; cursor:pointer; }
.topic-options input { position:absolute; opacity:0; width:1px; height:1px; }
.topic-options span { display:block; padding:9px 13px; border:1px solid #d8dfce; border-radius:4px; font-size:11px; line-height:1.5; }
.topic-options input:checked+span { color:#92262c; background:#faedeb; border-color:#bf6c70; }
.topic-options input:focus-visible+span { outline:3px solid #aa3c43; outline-offset:3px; }
.form-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; }
.text-input { display:block; width:100%; min-width:0; padding:12px 13px; background:#fcfcf9; border:1px solid #d4ddc9; border-radius:4px; color:var(--ink); font-size:14px; line-height:1.6; }
.text-input:not(textarea) { height:48px; }
textarea.text-input { resize:vertical; min-height:120px; }
.text-input::placeholder { color:#69765e; font-size:12px; }
.text-input:focus { outline:2px solid #ae565b; outline-offset:1px; border-color:#ae565b; }
.topic-hint { color:#69765e; font-size:11px; line-height:1.8; margin-top:10px; }
.privacy-check { display:flex; align-items:flex-start; gap:10px; color:#5e6c53; font-size:11px; line-height:1.8; margin-top:22px; }
.privacy-check input { width:17px; height:17px; flex-shrink:0; margin:3px 0 0; accent-color:var(--red); }
.privacy-check a { text-decoration:underline; text-underline-offset:3px; }
.form-submit { width:100%; min-height:55px; margin-top:24px; gap:15px; }
.form-submit>.icon:last-child { margin-left:auto; }
.form-submit:disabled { opacity:.7; cursor:wait; transform:none; }
.form-delivery-note,.form-required { color:#617054; font-size:10px; line-height:1.85; }
.form-delivery-note { margin-top:14px; }
.form-delivery-note strong { font-weight:500; overflow-wrap:anywhere; }
.form-required { margin-top:7px; }
.form-trap { position:absolute; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden; }
.form-status:empty { display:none; }
.form-status { background:#eef3e8; border:1px solid #d2ddc7; padding:15px; margin-top:18px; border-radius:4px; color:#3b4f2b; font-size:12px; line-height:1.8; }
.form-status.is-error { color:#82302b; background:#fff1ed; border-color:#e7c2b8; }
.status-actions { display:flex; align-items:center; flex-wrap:wrap; gap:15px; margin-top:10px; }
.status-actions a,.status-actions button { font:inherit; color:inherit; background:transparent; border:0; padding:0; text-decoration:underline; text-underline-offset:3px; }
.form-status textarea { width:100%; min-height:150px; display:block; border:1px solid #b9c5ad; padding:10px; margin-top:13px; font-size:12px; line-height:1.75; }

/* Footer and text-only category dialog */
.site-footer { background:#fff; border-top:1px solid #dce1d3; }
.footer-top { display:flex; align-items:center; justify-content:space-between; gap:25px; padding-block:35px; }
.footer-name { font-size:16px; font-weight:600; letter-spacing:-.015em; }
.footer-name span { color:#637358; font-weight:400; }
.footer-top>p { color:#627059; font-size:12px; }
.back-top { font-size:11px; color:#5f7054; }
.footer-bottom { display:flex; align-items:center; justify-content:space-between; gap:24px; padding-block:24px; border-top:1px solid #e1e7d9; color:#637358; font-size:10px; }
.footer-bottom>div { display:flex; align-items:center; flex-wrap:wrap; gap:24px; }
.footer-bottom a:hover { color:var(--red); }
.mobile-contact-bar { display:none; }
.category-dialog { width:min(620px,calc(100% - 40px)); max-height:calc(100dvh - 60px); padding:0; border:1px solid #dbe1d2; border-radius:12px; color:var(--ink); background:var(--paper); overflow:auto; }
.category-dialog::backdrop { background:#16241bc2; backdrop-filter:blur(4px); }
.dialog-close { position:absolute; top:17px; right:17px; width:40px; height:40px; display:grid; place-items:center; background:#e8ece1; border:0; border-radius:50%; font-size:27px; font-weight:300; line-height:1; }
.dialog-close:hover { background:#dbe1d2; }
.dialog-content { padding:45px; }
.dialog-content .eyebrow { padding-right:30px; margin-bottom:22px; font-size:9px; }
.dialog-content h2 { font-size:45px; margin-bottom:20px; }
.dialog-content>p { color:var(--muted); font-size:14px; line-height:1.85; }
.dialog-content h3 { font-size:20px; margin-top:28px; margin-bottom:16px; }
.dialog-content ul { color:var(--muted); margin:0 0 22px; padding-left:19px; font-size:14px; line-height:1.9; }
.dialog-content .dialog-note { color:#67765b; font-size:11px; border-top:1px solid var(--line); padding-top:18px; margin-bottom:26px; }
.dialog-content .button { width:100%; }
.legal-main { width:min(900px,calc(100% - 112px)); padding-block:60px 90px; }
.legal-main h1 { font-size:clamp(37px,5vw,58px); margin-top:35px; margin-bottom:18px; }
.legal-main .legal-date { color:var(--muted); font-size:12px; }
.legal-main h2 { font-size:25px; letter-spacing:-.025em; margin-top:36px; margin-bottom:16px; }
.legal-main p,.legal-main li,.legal-main address { font-size:14px; line-height:1.95; }
.legal-main p+p { margin-top:15px; }
.legal-main p a,.legal-main address a { text-decoration:underline; text-underline-offset:3px; overflow-wrap:anywhere; }

/* One continuous photograph with accessible, selectable page text. */
.hero { background:#f1eee7; }
.hero-stage { position:relative; width:100%; max-width:1920px; aspect-ratio:1942/809; margin-inline:auto; isolation:isolate; }
.hero-photograph { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hero-content { position:absolute; inset:0; display:flex; align-items:center; padding-block:40px; }
.hero-copy { width:47%; max-width:575px; }
.hero-eyebrow { color:#596257; font-size:10px; font-weight:600; line-height:1.5; letter-spacing:.18em; margin-bottom:26px; }
.hero h1 { font-family:Arial,Helvetica,sans-serif; font-size:clamp(50px,5.45vw,79px); line-height:1.08; letter-spacing:-.055em; font-weight:400; color:#29312b; }
.hero-lead { color:#4d574e; font-size:clamp(15px,1.25vw,18px); line-height:1.8; margin-top:26px; }
.hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:28px; margin-top:31px; }
.hero-actions .button { min-height:52px; padding-inline:23px; font-size:13px; font-weight:500; border-radius:3px; }
.hero-whatsapp { display:inline-flex; align-items:center; gap:8px; min-height:48px; border-bottom:1px solid #8d9788; color:#3c5141; font-size:13px; font-weight:500; transition:color .2s,border-color .2s; }
.hero-whatsapp .icon { width:18px; height:18px; }
.hero-whatsapp:hover { color:var(--red); border-color:var(--red); }
.hero-bottom { background:var(--paper); border-bottom:1px solid var(--line); }
.hero-bottom-inner { display:flex; justify-content:space-between; align-items:center; min-height:78px; gap:24px; font-size:12px; color:#5c665c; }
.hero-bottom-inner>p { color:#2f3b30; }
.hero-bottom-inner>p span { color:#687265; }
.hero-bottom-inner a { display:inline-flex; align-items:center; gap:9px; min-height:44px; }
.hero-bottom-inner a:hover { color:var(--red); }
.hero-bottom-inner .icon { width:17px; height:17px; }
.hero-call { color:#2f3b30; font-weight:600; white-space:nowrap; }


/* Direct contact and inquiry share one balanced surface. */
.contact-shell { display:grid; grid-template-columns:minmax(0,.98fr) minmax(0,1.02fr); align-items:stretch; overflow:hidden; border:1px solid #dce1d5; border-radius:12px; background:#fff; box-shadow:0 18px 55px #22352b09; }
.contact-aside { display:flex; flex-direction:column; min-width:0; padding:45px 44px 38px; background:#293f34; color:#f8f9f3; }
.contact-heading { margin-bottom:26px; }
.contact-heading .eyebrow { color:#c2cfba; font-size:9px; margin-bottom:23px; }
.contact-heading h2 { font-size:clamp(40px,3.8vw,54px); line-height:1.07; font-weight:400; letter-spacing:-.045em; }
.contact-heading h2 span { color:#c6d4bd; }
.contact-heading>p:not(.eyebrow) { max-width:380px; margin-top:23px; color:#d0d9cc; font-size:14px; line-height:1.85; }
.contact-methods { border-top:1px solid #ffffff25; }
.contact-method { display:flex; align-items:center; gap:16px; padding:21px 0; border-bottom:1px solid #ffffff25; }
.contact-method:last-child { border-bottom:0; }
.contact-icon { display:flex; flex-shrink:0; align-items:center; justify-content:center; width:42px; height:46px; color:#ccdac3; background:#ffffff08; border:1px solid #ffffff1a; border-radius:6px; transition:background .2s; }
.contact-icon .icon { width:20px; height:20px; }
.contact-method-copy { display:block; min-width:0; }
.contact-label { display:block; color:#bdccb5; font-size:8px; letter-spacing:.15em; font-weight:500; margin-bottom:5px; }
.contact-method strong { display:block; font-size:24px; line-height:1.35; font-weight:400; letter-spacing:-.025em; }
.contact-method strong.email-address { font-size:23px; overflow-wrap:anywhere; }
.contact-method small { display:block; color:#c2cfbc; font-size:11px; line-height:1.7; margin-top:4px; }
.contact-method .contact-arrow { width:18px; height:18px; margin-left:auto; color:#b7c9ac; transition:transform .2s; }
.contact-method:hover .contact-icon { background:#ffffff15; }
.contact-method:hover .contact-arrow { transform:translate(3px,-3px); }
.contact-aside a:focus-visible { outline-color:#d9e4cc; }
.visit { margin-top:auto; padding:23px; border:1px solid #ffffff25; border-radius:6px; background:#ffffff06; }
.visit-heading { display:flex; align-items:flex-start; gap:13px; }
.visit-heading>.icon { width:20px; height:20px; color:#c3d2ba; margin-top:3px; }
.visit h3 { font-size:19px; line-height:1.4; font-weight:400; letter-spacing:-.02em; }
.visit address { margin-top:7px; color:#d0d9cb; font-size:12px; line-height:1.8; }
.visit>p { font-size:11px; line-height:1.8; color:#c2cfbc; margin:14px 0 10px; }
.visit .text-link { width:100%; font-size:12px; border-color:#ffffff35; }
.visit .text-link:hover { color:#fff; border-color:#e1e9d8; }
.contact-shell .inquiry-form { height:100%; padding:45px 42px 38px; border:0; border-radius:0; box-shadow:none; }
.contact-shell .inquiry-form .form-eyebrow { margin-bottom:20px; font-size:8px; }
.contact-shell .inquiry-form h3 { font-size:30px; line-height:1.25; letter-spacing:-.035em; }
.contact-shell .form-intro { margin:12px 0 28px; }
.contact-shell .text-input { background:#f9faf6; }
.contact-shell .form-submit { border-radius:5px; }

/* Progressive enhancement: content is visible until JS opts it into reveal. */
.reveal-item { opacity:0; transform:translate3d(0,22px,0); transition:opacity .75s cubic-bezier(.22,1,.36,1),transform .75s cubic-bezier(.22,1,.36,1); }
.reveal-item.is-visible { opacity:1; transform:translate3d(0,0,0); }
.offer-card.reveal-item:nth-child(2),.steps>article.reveal-item:nth-child(2),.about-values>article.reveal-item:nth-child(2) { transition-delay:80ms; }
.offer-card.reveal-item:nth-child(3),.steps>article.reveal-item:nth-child(3),.about-values>article.reveal-item:nth-child(3) { transition-delay:160ms; }
.offer-card.reveal-item:nth-child(4) { transition-delay:240ms; }
.reveal-item.reveal-immediate { transition:none!important; }

@media (max-width:1150px) {
  .wrap { width:calc(100% - 72px); }
  .header-inner { gap:20px; }
  .brand-wordmark { font-size:25px; }
  .brand-scooter { width:62px; height:43px; }
  .desktop-nav { gap:20px; margin-right:7px; }
  .desktop-nav a { font-size:11px; }
  .offer-grid { gap:19px; }
  .card-text>p:not(.card-kicker) { min-height:94px; }
  .about-grid,.parts { gap:60px; }
  .faq { gap:65px; }
  .parts-guide { padding:31px; }
  .inquiry-form { padding:31px; }
  .inquiry-form h3 { font-size:28px; }
}
@media (max-width:900px) {
  .wrap { width:calc(100% - 48px); }
  .site-header { height:80px; }
  .desktop-nav { display:none; }
  .button-header { margin-left:auto; }
  .menu-toggle { display:flex; }
  .mobile-nav { top:80px; height:calc(100dvh - 80px); }
  .section { padding-block:76px; }
  .section-heading { gap:35px; margin-bottom:37px; }
  .section-heading>p { max-width:285px; font-size:13px; }
  .offer-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:37px 23px; }
  .card-text>p:not(.card-kicker) { min-height:50px; }
  .card-kicker { font-size:9px; }
  .about-grid,.parts { gap:40px; }
  .about-copy h2 { font-size:40px; }
  .about-copy p.lead { font-size:15px; }
  .about-copy p:not(.eyebrow):not(.lead) { font-size:13px; }
  .about-values article { gap:14px; }
  .about-values h3 { font-size:19px; }
  .about-values p { font-size:12px; }
  .parts-copy h2 { font-size:37px; }
  .parts-copy>p:not(.eyebrow) { font-size:13px; }
  .parts-guide { padding:26px; }
  .parts-guide h3 { font-size:27px; }
  .parts-checklist li { gap:15px; }
  .guide-label { font-size:8px; }
  .guide-whatsapp { font-size:11px; gap:9px; }
  .steps { gap:28px; }
  .steps h3 { font-size:20px; }
  .steps p { font-size:12px; }
  .faq { gap:43px; grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr); }
  .faq-list summary { font-size:14px; }
  .faq-list details>p { font-size:13px; }
  .inquiry-form { padding:27px 23px; }
  .inquiry-form h3 { font-size:26px; }
  .form-row { grid-template-columns:1fr; gap:0; }
  .footer-bottom>span:last-child { display:none; }
}
@media (max-width:640px) {
  html { scroll-padding-top:96px; }
  .wrap { width:calc(100% - 40px); }
  .site-header { height:76px; }
  .header-inner { gap:14px; }
  .brand { gap:9px; }
  .brand-scooter { width:59px; height:40px; }
  .brand-wordmark { font-size:24px; }
  .brand-wordmark small { font-size:6px; margin-top:7px; letter-spacing:.12em; }
  .button-header { display:none; }
  .menu-toggle { margin-left:auto; }
  .mobile-nav { top:76px; height:calc(100dvh - 76px); }
  .mobile-nav>a { font-size:23px; padding-block:13px; }
  .mobile-nav .mobile-phone,.mobile-nav .mobile-whatsapp { font-size:15px; }
  .section { padding-block:64px; }
  h2 { font-size:38px; }
  .eyebrow { font-size:9px; margin-bottom:23px; }
  .section-heading { display:block; margin-bottom:31px; }
  .section-heading>p { max-width:100%; font-size:14px; margin-top:21px; }
  .offer-grid { gap:31px 16px; }
  .card-image { border-radius:6px; }
  .image-arrow { width:31px; height:31px; right:9px; bottom:9px; }
  .image-arrow .icon { width:15px; height:15px; }
  .card-text { padding-top:18px; }
  .card-kicker { font-size:6.5px; letter-spacing:.03em; margin-bottom:9px; }
  .card-text h3 { font-size:26px; margin-bottom:11px; }
  .card-text>p:not(.card-kicker) { font-size:12px; line-height:1.8; min-height:87px; margin-bottom:12px; }
  .card-text .text-link { font-size:10px; gap:7px; width:100%; }
  .card-text .text-link .icon { width:16px; height:16px; }
  .offer-note { display:block; padding-top:19px; margin-top:27px; font-size:10px; }
  .about-grid { grid-template-columns:minmax(0,1fr); gap:39px; }
  .about-copy h2 { font-size:43px; }
  .about-copy p.lead { font-size:16px; }
  .about-copy p:not(.eyebrow):not(.lead) { font-size:14px; }
  .about-values { border-top:1px solid #ffffff24; padding-top:29px; }
  .about-values article { gap:19px; padding-block:23px; }
  .about-values h3 { font-size:21px; }
  .about-values p { font-size:13px; }
  .parts { grid-template-columns:minmax(0,1fr); gap:32px; }
  .parts-copy h2 { font-size:38px; }
  .parts-copy>p:not(.eyebrow) { font-size:14px; }
  .parts-copy>p.parts-small { font-size:11px; }
  .parts-guide { padding:29px 25px; border-radius:8px; }
  .parts-guide h3 { font-size:29px; }
  .guide-label { font-size:8px; }
  .parts-checklist li { padding-block:18px; gap:18px; }
  .guide-whatsapp { font-size:12px; }
  .process .section-heading h2 { font-size:36px; }
  .steps { grid-template-columns:minmax(0,1fr); gap:25px; }
  .steps article { position:relative; padding:22px 0 0 55px; }
  .step-number { position:absolute; top:24px; left:0; font-size:25px; margin:0; }
  .step-number>span { display:none; }
  .steps h3 { font-size:21px; margin-bottom:12px; }
  .steps p { font-size:13px; }
  .faq { grid-template-columns:minmax(0,1fr); gap:35px; }
  .faq>div>p:not(.eyebrow) { font-size:14px; margin-block:22px 17px; }
  .faq-list summary { padding-block:21px; font-size:14px; }
  .faq-list details>p { font-size:13px; padding-right:20px; }
  .inquiry-panel { scroll-margin-top:98px; }
  .inquiry-form { padding:29px 23px; border-radius:8px; }
  .inquiry-form h3 { font-size:28px; }
  .text-input { font-size:16px; }
  .form-submit { font-size:12px; padding-inline:16px; gap:12px; }
  .form-delivery-note,.form-required { font-size:10px; }
  .footer-top { flex-wrap:wrap; gap:17px; padding-block:30px; }
  .footer-top>p { order:3; width:100%; font-size:12px; }
  .footer-bottom { flex-direction:column-reverse; align-items:flex-start; padding-block:23px 100px; gap:19px; }
  .footer-bottom>div { gap:23px; }
  .mobile-contact-bar { position:fixed; inset:auto 0 0; z-index:25; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; background:#fffffff5; backdrop-filter:blur(12px); border-top:1px solid #d5decb; box-shadow:0 -3px 20px #24351a08; padding:9px 12px calc(9px + env(safe-area-inset-bottom)); transition:transform .2s; }
  .mobile-contact-bar a { display:flex; justify-content:center; align-items:center; gap:7px; min-height:46px; border:1px solid #d1dbc6; border-radius:4px; font-size:11px; font-weight:600; }
  .mobile-contact-bar .mobile-wa { color:#315a39; background:#edf4e9; border-color:#cadbc0; }
  .mobile-contact-bar a:last-child { background:var(--red); color:#fff; border-color:var(--red); }
  .mobile-contact-bar .icon { width:17px; height:17px; }
  .mobile-contact-bar.is-hidden { transform:translateY(120%); }
  .category-dialog { width:calc(100% - 28px); max-height:calc(100dvh - 36px); border-radius:9px; }
  .dialog-content { padding:37px 26px 28px; }
  .dialog-content h2 { font-size:38px; }
  .dialog-content>p,.dialog-content ul { font-size:13px; }
  .dialog-content h3 { font-size:19px; }
  .dialog-content .eyebrow { font-size:8px; }
  .dialog-close { top:12px; right:12px; width:36px; height:36px; }
  .legal-main { width:calc(100% - 40px); padding-block:42px 65px; }
  .legal-main h1 { font-size:37px; }
  .legal-main h2 { font-size:23px; }
  .legal-main p,.legal-main li,.legal-main address { font-size:13px; }
  .legal-body .footer-bottom { padding-bottom:28px; }
}
@media (max-width:360px) {
  .wrap { width:calc(100% - 32px); }
  .brand-scooter { width:52px; height:37px; }
  .brand-wordmark { font-size:22px; }
  .brand-wordmark small { font-size:5.7px; }
  h2,.parts-copy h2 { font-size:35px; }
  .card-text h3 { font-size:24px; }
  .card-text>p:not(.card-kicker) { min-height:108px; }
  .card-text .text-link { font-size:9px; }
  .card-kicker { font-size:6px; }
  .about-copy h2 { font-size:38px; }
  .parts-guide { padding:26px 21px; }
  .parts-guide h3 { font-size:27px; }
  .inquiry-form { padding:26px 18px; }
  .inquiry-form h3 { font-size:25px; }
  .mobile-contact-bar { padding-inline:9px; gap:6px; }
  .mobile-contact-bar a { gap:5px; font-size:10px; }
  .mobile-contact-bar .icon { width:16px; height:16px; }
}
@media (min-width:981px) and (max-width:1200px) {
  .hero-eyebrow { font-size:9px; margin-bottom:20px; }
  .hero-lead { margin-top:22px; }
  .hero-actions { gap:22px; margin-top:26px; }
  .hero-actions .button { padding-inline:19px; min-height:48px; font-size:12px; }
  .hero-whatsapp { min-height:44px; font-size:12px; }
  .hero-bottom-inner { font-size:11px; gap:18px; }
  .hero-bottom-inner>p span { display:none; }
}
@media (max-width:980px) {
  .hero-stage { display:flex; flex-direction:column; aspect-ratio:auto; }
  .hero-content { position:relative; inset:auto; order:0; width:min(680px,calc(100% - 80px)); padding-block:53px 28px; }
  .hero-copy { width:100%; max-width:100%; }
  .hero h1 { font-size:clamp(48px,8vw,68px); }
  .hero-eyebrow { margin-bottom:23px; font-size:9px; }
  .hero-lead { font-size:17px; margin-top:24px; }
  .hero-actions { margin-top:27px; }
  .hero-photograph { position:relative; order:1; inset:auto; height:clamp(320px,45vw,430px); object-fit:cover; object-position:right center; }
  .hero-bottom-inner { flex-wrap:wrap; justify-content:center; padding-block:15px; gap:0 30px; }
  .hero-bottom-inner>p { display:none; }
}
@media (max-width:640px) {
  .hero-content { width:calc(100% - 44px); padding-block:39px 20px; }
  .hero h1 { font-size:clamp(45px,11.4vw,68px); line-height:1.09; }
  .hero-eyebrow { font-size:8px; margin-bottom:22px; letter-spacing:.16em; }
  .hero-lead { font-size:14px; line-height:1.85; margin-top:22px; }
  .hero-actions { gap:22px; margin-top:23px; }
  .hero-actions .button { padding:13px 18px; min-height:48px; font-size:12px; gap:17px; }
  .hero-whatsapp { font-size:12px; min-height:43px; gap:7px; }
  .hero-photograph { height:clamp(260px,69vw,400px); }
  .hero-bottom-inner { padding-block:10px; gap:0 18px; font-size:11px; }
  .hero-bottom-inner a { min-height:38px; }
  .hero-bottom-inner .hero-address { font-size:10px; }
  .hero-bottom-inner .icon { width:15px; height:15px; }
}
@media (max-width:360px) {
  .hero-content { width:calc(100% - 32px); }
  .hero h1 { font-size:43px; }
  .hero-actions { gap:16px; }
  .hero-actions .button { padding-inline:14px; gap:11px; }
  .hero-lead { font-size:13px; }
}
@media (max-width:1150px) and (min-width:901px) {
  .contact-aside { padding:36px 30px 30px; }
  .contact-shell .inquiry-form { padding:36px 30px 30px; }
  .contact-heading h2 { font-size:44px; }
  .contact-method { gap:13px; }
  .contact-method strong,.contact-method strong.email-address { font-size:21px; }
  .contact-icon { width:37px; }
  .visit { padding:21px; }
}
@media (max-width:900px) {
  .contact-shell { grid-template-columns:minmax(0,1fr); border-radius:10px; }
  .contact-aside { padding:38px; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:28px 35px; }
  .contact-heading { grid-column:1; grid-row:1; margin:0; }
  .contact-heading h2 { font-size:43px; }
  .contact-heading>p:not(.eyebrow) { font-size:13px; }
  .contact-methods { grid-column:2; grid-row:1 / span 2; align-self:start; }
  .contact-method { gap:12px; padding-block:20px; }
  .contact-icon { width:32px; height:40px; }
  .contact-icon .icon { width:17px; height:17px; }
  .contact-method strong,.contact-method strong.email-address { font-size:20px; }
  .contact-method small { font-size:10px; }
  .contact-method .contact-arrow { width:15px; height:15px; }
  .visit { grid-column:1; grid-row:2; margin:0; padding:19px; }
  .visit address { font-size:11px; }
  .contact-shell .inquiry-form { padding:38px; }
  .contact-shell .form-row { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
}
@media (max-width:640px) {
  .contact.section { padding-block:46px; }
  .contact-shell { border-radius:9px; }
  .contact-aside { display:flex; padding:31px 26px; gap:0; }
  .contact-heading { margin-bottom:26px; }
  .contact-heading .eyebrow { font-size:8px; margin-bottom:22px; }
  .contact-heading h2 { font-size:43px; }
  .contact-heading>p:not(.eyebrow) { font-size:13px; margin-top:21px; }
  .contact-method { padding-block:20px; gap:13px; }
  .contact-icon { width:36px; height:43px; }
  .contact-method strong,.contact-method strong.email-address { font-size:21px; }
  .contact-label { font-size:8px; }
  .contact-method small { font-size:10px; }
  .visit { margin-top:21px; padding:20px; }
  .visit h3 { font-size:19px; }
  .visit address { font-size:11px; }
  .contact-shell .inquiry-form { padding:31px 25px; }
  .contact-shell .inquiry-form h3 { font-size:27px; }
  .contact-shell .form-intro { font-size:12px; }
  .contact-shell .form-row { grid-template-columns:1fr; gap:0; }
  .reveal-item { transform:translate3d(0,16px,0); transition-duration:.65s; }
}
@media (max-width:360px) {
  .contact-aside { padding:28px 21px; }
  .contact-heading h2 { font-size:39px; }
  .contact-method strong,.contact-method strong.email-address { font-size:18px; }
  .contact-icon { width:31px; }
  .contact-method { gap:11px; }
  .visit { padding:17px; }
  .contact-shell .inquiry-form { padding:28px 21px; }
  .contact-shell .inquiry-form h3 { font-size:25px; }
}
@media (prefers-reduced-motion:reduce) {
  .reveal-item { opacity:1!important; transform:none!important; }
  html { scroll-behavior:auto; }
  *,*::before,*::after { transition:none!important; animation:none!important; }
}
@media print {
  .reveal-item { opacity:1!important; transform:none!important; }
  .contact-shell { display:block; border:0; box-shadow:none; }
  .contact-aside { display:block; padding:20px 0; background:#fff; color:#000; }
  .contact-heading h2 span,.contact-heading>p:not(.eyebrow),.contact-label,.contact-method small,.visit address,.visit>p { color:#333; }
  .visit { margin-top:20px; border-color:#ccc; }
  .contact-methods,.contact-method { border-color:#ccc; }

  .site-header,.hero-actions,.mobile-contact-bar,.inquiry-panel,.back-top { display:none!important; }
  .hero-stage { aspect-ratio:auto; }
  .hero-photograph { display:none; }
  .hero-content { position:relative; inset:auto; padding-block:25px; }
  .hero-copy { width:100%; }
  .hero h1 { font-size:48px; }
  .hero-lead { font-size:14px; }
  .offer-card { break-inside:avoid; }
  .wrap { width:100%; }
  .section { padding-block:30px; }
  .about,.contact,.process { background:white; color:#000; }
  .about-copy p:not(.eyebrow):not(.lead),.about-copy p.lead,.about-values p,.about-copy h2 span { color:#333; }
  .about-copy .text-link { color:#000; }
  .eyebrow { color:#555!important; }
  .about-values article { border-color:#ccc; }
}
