/* ============================================================
   ט.א מוטורס — design system
   Navy #07043B ink · Red #F12F2F accent · Polin · light mode · RTL
   Ported from the Tailwind theme the Next.js build used.
   ============================================================ */

:root {
	--navy-50:#eeedf8;  --navy-100:#d6d4f0; --navy-200:#a9a5df; --navy-300:#7d77cd;
	--navy-400:#4f49a8; --navy-500:#322c8a; --navy-600:#221d6e; --navy-700:#161159;
	--navy-800:#0d0949; --navy-900:#07043b; --navy-950:#050229;

	--accent-50:#fef2f2;  --accent-100:#fde1e1; --accent-400:#f56767;
	--accent-500:#f12f2f; --accent-600:#d81a1a; --accent-700:#b51414;

	--metal-50:#f6f7f9;  --metal-100:#eef0f4; --metal-200:#e2e4ec; --metal-300:#cbcdd9;
	--metal-400:#9a9cae; --metal-500:#6c6e82; --metal-600:#4f5162; --metal-700:#3a3b49;

	--paper:#ffffff; --surface:#f4f5f8; --ink:#0a0920; --muted:#5c5e70; --line:#e5e6ee;

	--radius-card:1.5rem; --radius-pill:999px;
	--shadow-card:0 1px 2px rgba(10,9,32,.04), 0 12px 28px -14px rgba(10,9,32,.14);
	--shadow-hover:0 2px 6px rgba(10,9,32,.06), 0 28px 50px -18px rgba(10,9,32,.24);
	--shadow-header:0 1px 0 rgba(10,9,32,.05), 0 10px 30px -18px rgba(10,9,32,.25);
	--ease:cubic-bezier(.25,.46,.45,.94);
	--shell:80rem;
	--header-h:76px;
}

*, *::before, *::after { box-sizing:border-box; }

html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } }

body.tams {
	margin:0; background:var(--paper); color:var(--ink);
	font-family:"Polin", system-ui, "Segoe UI", Arial, sans-serif;
	font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased;
}

/* A rendered component must not inherit the host theme's typography.
   Reset the inherited properties on the root, and again on the elements
   themselves — a theme rule like `h1,h2{letter-spacing:-.1px}` targets them
   directly and beats anything inherited from an ancestor. */
body.tams, body.tams h1, body.tams h2, body.tams h3, body.tams h4, body.tams p, body.tams a, body.tams li {
	letter-spacing:normal; word-spacing:normal; text-indent:0;
	text-transform:none; font-variant:normal; text-shadow:none;
}

/* Scoped resets with zero specificity, so every class below still wins.
   A plain `.tams img{...}` would be (0,1,1) and silently beat every class. */
:where(body.tams) img, :where(body.tams) svg, :where(body.tams) video { max-width:100%; height:auto; display:block; }
:where(body.tams) a { color:inherit; text-decoration:none; }
:where(body.tams) button { font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
:where(body.tams) h1, :where(body.tams) h2, :where(body.tams) h3 { margin:0; font-weight:900; line-height:1.1; }
:where(body.tams) p { margin:0 0 1em; }
:where(body.tams) ul { margin:0; padding:0; list-style:none; }

body.tams input[type=checkbox], body.tams input[type=radio] { width:16px; height:16px; min-height:0; padding:0; }

.tams-skip { position:absolute; inset-inline-start:-9999px; }
.tams-skip:focus { inset-inline-start:12px; top:12px; background:var(--navy-900); color:#fff; padding:10px 16px; border-radius:8px; z-index:200; }

.tams-shell { width:100%; max-width:var(--shell); margin-inline:auto; padding-inline:20px; }
.tams-icon { display:inline-block; vertical-align:middle; flex:none; }

/* ---------------------------------------------------------------- buttons */
.tams-btn {
	display:inline-flex; align-items:center; justify-content:center; gap:8px;
	padding:12px 22px; border-radius:var(--radius-pill);
	font-weight:700; font-size:15px; line-height:1;
	transition:transform .2s var(--ease), box-shadow .2s var(--ease), background-color .2s var(--ease);
	border:1px solid transparent;
}
.tams-btn:hover { transform:translateY(-1px); }
.tams-btn-accent { background:var(--accent-500); color:#fff; box-shadow:0 10px 26px -12px rgba(241,47,47,.8); }
.tams-btn-accent:hover { background:var(--accent-600); }
.tams-btn-navy { background:var(--navy-900); color:#fff; }
.tams-btn-navy:hover { background:var(--navy-800); }
.tams-btn-ghost { background:#fff; color:var(--navy-900); border-color:var(--line); box-shadow:var(--shadow-card); }
.tams-btn-wa { background:#25D366; color:#fff; }
.tams-btn-lg { padding:16px 30px; font-size:17px; }

/* ----------------------------------------------------------------- header */
.tams-header { position:sticky; top:0; z-index:100; background:rgba(255,255,255,.92); backdrop-filter:blur(14px); box-shadow:var(--shadow-header); }
.tams-header-in { display:flex; align-items:center; gap:26px; height:var(--header-h); }
.tams-logo img { width:auto; height:46px; object-fit:contain; }
.tams-nav { display:flex; align-items:center; gap:4px; margin-inline-start:auto; }
.tams-nav-link {
	display:inline-flex; align-items:center; gap:5px;
	padding:9px 14px; border-radius:var(--radius-pill);
	font-weight:700; font-size:15px; color:var(--navy-900);
	transition:background-color .2s var(--ease);
}
.tams-nav-link:hover { background:var(--metal-100); }
.tams-nav-item { position:relative; }
.tams-header-actions { display:flex; align-items:center; gap:10px; }
.tams-header-phone { display:inline-flex; align-items:center; gap:7px; font-weight:800; color:var(--navy-900); font-size:15px; }
.tams-header-search { display:inline-flex; padding:9px; border-radius:var(--radius-pill); color:var(--navy-900); }
.tams-header-search:hover { background:var(--metal-100); }

.tams-mega { position:absolute; inset-inline-start:50%; transform:translateX(50%); top:calc(100% + 10px); width:min(880px,92vw); background:#fff; border:1px solid var(--line); border-radius:var(--radius-card); box-shadow:var(--shadow-hover); padding:18px; }
.tams-mega-in { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; padding:0; max-width:none; }
.tams-mega-card { display:block; padding:16px; border-radius:16px; transition:background-color .2s var(--ease); }
.tams-mega-card:hover { background:var(--metal-50); }
.tams-mega-ico { display:inline-flex; padding:9px; border-radius:12px; background:var(--navy-50); color:var(--navy-900); margin-bottom:8px; }
.tams-mega-t { display:block; font-weight:800; color:var(--navy-900); }
.tams-mega-b { display:block; font-size:13px; color:var(--muted); margin-top:2px; }

.tams-burger { display:none; flex-direction:column; gap:5px; padding:10px; }
.tams-burger span { display:block; width:22px; height:2px; background:var(--navy-900); border-radius:2px; transition:transform .25s var(--ease), opacity .25s var(--ease); }
.tams-burger[aria-expanded="true"] span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.tams-burger[aria-expanded="true"] span:nth-child(2) { opacity:0; }
.tams-burger[aria-expanded="true"] span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

.tams-mobile { display:none; flex-direction:column; padding:12px 20px 22px; border-top:1px solid var(--line); background:#fff; }
.tams-mobile a { padding:13px 4px; font-weight:700; border-bottom:1px solid var(--line); }
.tams-mobile-sub { padding-inline-start:20px !important; font-weight:500 !important; color:var(--muted); }

@media (max-width: 1080px) {
	.tams-nav, .tams-header-phone { display:none; }
	.tams-burger { display:flex; }
	.tams-mobile:not([hidden]) { display:flex; }
}

/* ------------------------------------------------------------------- hero */
.tams-hero { position:relative; min-height:clamp(560px, 82vh, 860px); display:flex; align-items:center; overflow:hidden; }
.tams-hero-media { position:absolute; inset:-18% 0 -18% 0; }
.tams-hero-media img { width:100%; height:100%; object-fit:cover; }
.tams-hero-veil { position:absolute; inset:0; background:linear-gradient(to top, var(--navy-950) 4%, rgba(5,2,41,.66) 46%, rgba(5,2,41,.22) 100%); }
.tams-hero-veil-side { position:absolute; inset:0; background:linear-gradient(to left, rgba(5,2,41,.72), transparent 62%); }
.tams-hero-in { position:relative; z-index:2; color:#fff; padding:80px 0 56px; max-width:640px; }
.tams-eyebrow { display:inline-flex; align-items:center; gap:8px; font-size:14px; font-weight:800; color:var(--accent-400); margin-bottom:14px; }
.tams-eyebrow::before { content:""; width:7px; height:7px; border-radius:50%; background:var(--accent-500); }
.tams-hero h1 { font-size:clamp(40px, 6.4vw, 76px); margin-bottom:18px; }
.tams-hero p { font-size:clamp(16px, 1.6vw, 19px); color:rgba(255,255,255,.88); max-width:52ch; }
.tams-hero-cta { display:flex; flex-wrap:wrap; gap:12px; margin-top:26px; }
.tams-hero-marks { display:flex; flex-wrap:wrap; gap:18px; margin-top:28px; font-size:14px; font-weight:600; color:rgba(255,255,255,.86); }
.tams-hero-marks li { display:flex; align-items:center; gap:7px; }

/* --------------------------------------------------------------- sections */
.tams-section { padding:72px 0; }
.tams-section-surface { background:var(--surface); }
.tams-head { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:34px; }
.tams-head h2 { font-size:clamp(28px, 3.4vw, 46px); color:var(--navy-900); }
.tams-head p { color:var(--muted); margin:8px 0 0; }
.tams-kicker { font-size:14px; font-weight:800; color:var(--accent-500); }

.tams-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(290px, 1fr)); gap:22px; }

/* ------------------------------------------------------------ vehicle card */
.tams-card { background:#fff; border:1px solid var(--line); border-radius:var(--radius-card); overflow:hidden; box-shadow:var(--shadow-card); transition:transform .3s var(--ease), box-shadow .3s var(--ease); display:flex; flex-direction:column; }
.tams-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-hover); }
.tams-card-media { position:relative; display:block; aspect-ratio:16/10; background:var(--navy-950); overflow:hidden; }
.tams-card-media img { width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); }
.tams-card:hover .tams-card-media img { transform:scale(1.05); }
.tams-badge { position:absolute; top:12px; inset-inline-end:12px; padding:5px 12px; border-radius:var(--radius-pill); font-size:12px; font-weight:800; background:#fff; color:var(--navy-900); }
.tams-badge-sold { background:var(--navy-900); color:#fff; }
.tams-badge-reserved { background:#fff4e0; color:#9a5b00; }
.tams-badge-moto { inset-inline-end:auto; inset-inline-start:12px; background:var(--accent-500); color:#fff; letter-spacing:.04em; }
.tams-card-body { padding:18px; display:flex; flex-direction:column; gap:10px; flex:1; }
.tams-card-title { font-size:20px; color:var(--navy-900); }
.tams-card-trim { margin:0; font-size:14px; color:var(--muted); }
.tams-specs { display:flex; flex-wrap:wrap; gap:12px; font-size:13px; color:var(--metal-600); }
.tams-specs li { display:flex; align-items:center; gap:5px; }
.tams-card-foot { margin-top:auto; padding-top:14px; border-top:1px solid var(--line); display:flex; align-items:flex-end; justify-content:space-between; gap:12px; }
.tams-price-was { display:block; font-size:13px; color:var(--muted); text-decoration:line-through; }
.tams-price-now { display:block; font-size:22px; font-weight:900; color:var(--navy-900); }
.tams-price-month { display:block; font-size:12px; color:var(--accent-600); font-weight:700; }

/* -------------------------------------------------------------- carousels */
.tams-rail { position:relative; }
.tams-rail-track { display:flex; gap:20px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; padding-bottom:6px; }
.tams-rail-track::-webkit-scrollbar { display:none; }
.tams-rail-track > * { flex:0 0 clamp(270px, 30%, 340px); scroll-snap-align:start; }
.tams-rail-btn { position:absolute; top:42%; z-index:3; width:44px; height:44px; border-radius:50%; background:#fff; box-shadow:var(--shadow-hover); display:grid; place-items:center; color:var(--navy-900); }
.tams-rail-prev { inset-inline-end:-10px; }
.tams-rail-next { inset-inline-start:-10px; }
@media (max-width:860px) { .tams-rail-btn { display:none; } }

/* The banner carousel: slides sit off-screen, so their images must load
   eagerly or the first advance shows an empty box while one is fetched. */
.tams-banner { position:relative; border-radius:var(--radius-card); overflow:hidden; background:var(--navy-950); }
.tams-banner-track { display:flex; transition:transform .6s var(--ease); }
.tams-banner-slide { flex:0 0 100%; position:relative; aspect-ratio:21/9; }
@media (max-width:900px) { .tams-banner-slide { aspect-ratio:4/3; } }
.tams-banner-slide img { width:100%; height:100%; object-fit:cover; }
.tams-banner-veil { position:absolute; inset:0; background:linear-gradient(to top, var(--navy-950), rgba(5,2,41,.55) 46%, rgba(5,2,41,.08)); }
.tams-banner-veil-side { position:absolute; inset:0; background:linear-gradient(to left, rgba(5,2,41,.7), transparent 60%); }
.tams-banner-body { position:absolute; inset-block-end:0; inset-inline:0; padding:30px 34px; color:#fff; }
.tams-banner-body h3 { font-size:clamp(26px,4vw,46px); }
.tams-banner-specs { display:flex; flex-wrap:wrap; gap:14px; margin:10px 0; font-size:14px; color:rgba(255,255,255,.86); }
.tams-banner-specs li { display:flex; align-items:center; gap:6px; }
.tams-banner-price { display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-top:12px; }
.tams-banner-price b { font-size:clamp(22px,3vw,34px); }
.tams-banner-dots { position:absolute; inset-block-end:14px; inset-inline:0; display:flex; justify-content:center; gap:7px; z-index:3; }
.tams-banner-dots button { width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.45); }
.tams-banner-dots button[aria-current="true"] { width:24px; border-radius:var(--radius-pill); background:var(--accent-500); }
.tams-banner-arrow { position:absolute; top:50%; transform:translateY(-50%); z-index:3; width:44px; height:44px; border-radius:50%; background:rgba(255,255,255,.18); backdrop-filter:blur(8px); color:#fff; display:grid; place-items:center; }
.tams-banner-prev { inset-inline-end:14px; }
.tams-banner-next { inset-inline-start:14px; }

/* ------------------------------------------------------------- categories */
.tams-cats { display:grid; grid-template-columns:repeat(auto-fit, minmax(240px,1fr)); gap:16px; }
.tams-cat { position:relative; display:block; border-radius:20px; overflow:hidden; aspect-ratio:4/3; }
.tams-cat img { width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); }
.tams-cat:hover img { transform:scale(1.06); }
.tams-cat-veil { position:absolute; inset:0; background:linear-gradient(to top, rgba(5,2,41,.9), rgba(5,2,41,.15)); }
.tams-cat-body { position:absolute; inset-block-end:0; inset-inline:0; padding:18px; color:#fff; }
.tams-cat-body strong { display:block; font-size:20px; font-weight:900; }
.tams-cat-body span { font-size:13px; color:rgba(255,255,255,.82); }

/* ------------------------------------------------------------------ bands */
.tams-band { position:relative; padding:96px 0; overflow:hidden; color:#fff; }
.tams-band-media { position:absolute; inset:-18% 0 -18% 0; }
.tams-band-media img { width:100%; height:100%; object-fit:cover; }
.tams-band-veil { position:absolute; inset:0; background:linear-gradient(to top, rgba(5,2,41,.92), rgba(5,2,41,.6)); }
.tams-band-in { position:relative; z-index:2; text-align:center; max-width:760px; margin-inline:auto; }
.tams-band-in h2 { font-size:clamp(30px,4vw,52px); margin-bottom:14px; }
.tams-band-in p { color:rgba(255,255,255,.86); }

.tams-stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:26px; position:relative; z-index:2; text-align:center; }
.tams-stat b { display:block; font-size:clamp(32px,4vw,52px); font-weight:900; }
.tams-stat span { font-size:14px; color:rgba(255,255,255,.78); }

/* ------------------------------------------------------------------ steps */
.tams-steps { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:20px; }
.tams-step { background:#fff; border:1px solid var(--line); border-radius:20px; padding:24px; }
.tams-step-n { display:inline-grid; place-items:center; width:38px; height:38px; border-radius:12px; background:var(--navy-900); color:#fff; font-weight:900; margin-bottom:12px; }
.tams-step h3 { font-size:18px; color:var(--navy-900); margin-bottom:6px; }
.tams-step p { font-size:14px; color:var(--muted); margin:0; }

/* ---------------------------------------------------------------- reviews */
.tams-review { background:#fff; border:1px solid var(--line); border-radius:20px; padding:24px; display:flex; flex-direction:column; gap:12px; }
.tams-stars { display:flex; gap:3px; color:#f5a524; }
.tams-review p { margin:0; font-size:15px; color:var(--metal-700); }
.tams-review cite { font-style:normal; font-weight:800; color:var(--navy-900); }
.tams-review small { color:var(--muted); }

/* ------------------------------------------------------------------ forms */
.tams-form { display:grid; gap:14px; }
.tams-field { display:block; }
.tams-field > span { display:block; font-size:14px; font-weight:700; color:var(--navy-900); margin-bottom:6px; }
.tams-field input, .tams-field select, .tams-field textarea {
	width:100%; padding:13px 15px; border:1px solid var(--line); border-radius:14px;
	background:#fff; font:inherit; color:var(--ink);
	transition:border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.tams-field input:focus, .tams-field select:focus, .tams-field textarea:focus {
	outline:none; border-color:var(--navy-400); box-shadow:0 0 0 4px var(--navy-50);
}
.tams-field-error input, .tams-field-error textarea { border-color:var(--accent-500); }
.tams-error { display:block; color:var(--accent-600); font-size:13px; margin-top:5px; font-weight:600; }
.tams-hp { position:absolute; inset-inline-start:-9999px; width:1px; height:1px; overflow:hidden; }
.tams-form-note { font-size:13px; color:var(--muted); }
.tams-notice { padding:14px 18px; border-radius:14px; font-weight:600; margin-bottom:18px; }
.tams-notice-error { background:var(--accent-50); color:var(--accent-700); border:1px solid var(--accent-100); }
.tams-notice-ok { background:#e7f6ec; color:#166534; border:1px solid #bfe3cb; }

/* ------------------------------------------------------------- calculator */
.tams-calc { display:grid; grid-template-columns:1.1fr .9fr; gap:28px; align-items:start; }
@media (max-width:900px) { .tams-calc { grid-template-columns:1fr; } }
.tams-calc-panel { background:#fff; border:1px solid var(--line); border-radius:var(--radius-card); padding:26px; box-shadow:var(--shadow-card); }
.tams-calc-out { background:var(--navy-900); color:#fff; border-radius:var(--radius-card); padding:30px; }
.tams-calc-big { font-size:clamp(34px,5vw,56px); font-weight:900; line-height:1; }
.tams-calc-row { display:flex; justify-content:space-between; padding:10px 0; border-bottom:1px solid rgba(255,255,255,.14); font-size:14px; }
.tams-calc-row:last-child { border-bottom:0; }
.tams-range { width:100%; }
.tams-disclaimer { font-size:12px; color:var(--muted); line-height:1.6; margin-top:16px; }

/* --------------------------------------------------------------- filtered */
.tams-layout { display:grid; grid-template-columns:280px 1fr; gap:28px; align-items:start; }
@media (max-width:1000px) { .tams-layout { grid-template-columns:1fr; } }
.tams-side { background:#fff; border:1px solid var(--line); border-radius:20px; padding:22px; position:sticky; top:calc(var(--header-h) + 16px); }
.tams-side h3 { font-size:16px; color:var(--navy-900); margin-bottom:14px; }

/* ------------------------------------------------------------------ prose */
.tams-prose { max-width:760px; padding-block:60px; }
.tams-prose h1 { font-size:clamp(30px,4vw,46px); color:var(--navy-900); margin-bottom:18px; }
.tams-prose h2 { font-size:24px; color:var(--navy-900); margin:28px 0 10px; }
.tams-prose p, .tams-prose li { color:var(--metal-700); }
.tams-prose ul { list-style:disc; padding-inline-start:22px; margin-bottom:1em; }
.tams-prose a { color:var(--accent-600); text-decoration:underline; }

/* ----------------------------------------------------------------- footer */
.tams-footer { background:var(--navy-950); color:rgba(255,255,255,.8); padding:56px 0 24px; margin-top:80px; }
.tams-footer-top { display:grid; grid-template-columns:1.4fr repeat(3,1fr); gap:32px; padding-bottom:34px; border-bottom:1px solid rgba(255,255,255,.12); }
@media (max-width:900px) { .tams-footer-top { grid-template-columns:1fr 1fr; } }
@media (max-width:560px) { .tams-footer-top { grid-template-columns:1fr; } }
.tams-footer-brand img { height:52px; width:auto; filter:brightness(0) invert(1); margin-bottom:12px; }
.tams-footer-col h3 { font-size:15px; color:#fff; margin-bottom:12px; }
.tams-footer-col a { display:block; padding:5px 0; font-size:14px; }
.tams-footer-col a:hover { color:#fff; }
.tams-footer-branch { font-size:14px; margin-bottom:10px; }
.tams-footer-hours { font-size:13px; color:rgba(255,255,255,.6); }
.tams-footer-bottom { display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap; padding-top:18px; font-size:13px; color:rgba(255,255,255,.55); }
.tams-credit { font-weight:600; }

.tams-fab { position:fixed; inset-block-end:22px; inset-inline-start:22px; z-index:90; width:56px; height:56px; border-radius:50%; background:#25D366; color:#fff; display:grid; place-items:center; box-shadow:0 12px 30px -8px rgba(37,211,102,.7); }

/* ------------------------------------------------------- entrance reveals */
/* Visible is the base state. Only elements explicitly marked are hidden, and
   only while JavaScript is alive to reveal them — a reveal that fails must
   never leave real content invisible. */
.tams-reveal { opacity:1; }
body.tams-js .tams-reveal:not(.is-in) { opacity:0; transform:translateY(18px); }
body.tams-js .tams-reveal { transition:opacity .7s var(--ease), transform .7s var(--ease); }
@media (prefers-reduced-motion: reduce) {
	body.tams-js .tams-reveal:not(.is-in) { opacity:1; transform:none; }
}
