
:root {
    --bg: #f5f8f8;
    --card: #ffffff;
    --text: #172330;
    --muted: #6b7787;
    --line: #dfe8e6;
    --accent: #36A794;
    --accent-2: #4DEBCE;
    --accent-3: #88F2DE;
    --accent-dark: #1c7a6b;
    --success: #249b79;
    --error: #d93025;
    --radius: 18px;
    --shadow: 0 10px 28px rgba(15, 34, 38, 0.08);
    --container: 1440px;
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; background: var(--bg); color: var(--text); font-family: Inter, Arial, sans-serif; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
.container { width: min(var(--container), calc(100% - 32px)); margin: 0 auto; }
.site-header, .admin-header { background: rgba(255,255,255,.94); border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 30; backdrop-filter: blur(10px); }
.nav-wrap, .admin-head-row, .footer-row { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 16px 0; }
.nav-wrap--premium { min-height: 86px; }
.brand-lockup { display:flex; align-items:center; }
.brand-logo { height: 38px; width: auto; }
.tagline { font-size: 13px; color: var(--muted); margin-top: 4px; }
.nav, .admin-nav { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.nav a, .admin-nav a { padding: 10px 12px; border-radius: 999px; font-weight: 600; }
.nav a:hover, .admin-nav a:hover { background: #eef8f6; color: var(--accent-dark); }
.admin-link { background: #edf9f5; color: var(--accent-dark); font-weight: 800; }
.nav-lang { display:flex; align-items:center; gap:6px; margin-left: 6px; }
.nav-lang a { padding:8px 10px; border-radius:999px; color: var(--muted); font-size:13px; }
.nav-lang a.active { background: var(--accent); color:#fff; }
.page-main { min-height: calc(100vh - 140px); padding: 22px 0 40px; }
.hero-home { padding-top: 4px; }
.hero-card { background: linear-gradient(180deg, #ffffff, #f9fcfb); border: 1px solid var(--line); border-radius: 28px; padding: 24px; box-shadow: var(--shadow); }
.hero-card--clean { padding: 22px 22px 18px; }
.hero-title--compact { margin: 0 0 12px; font-size: clamp(18px, 2vw, 24px); line-height: 1.18; letter-spacing: -0.03em; max-width: 760px; }
.hero-note, .homepage-note, .muted { color: var(--muted); }
.search-panel, .filters, .form-card { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 14px; box-shadow: var(--shadow); }
.search-panel--compact { display: grid; grid-template-columns: minmax(240px, 1.6fr) repeat(3, minmax(130px, .9fr)) auto; gap: 10px; margin-top: 4px; }
.search-panel input, .search-panel select, .filters input, .filters select,
.form-card input, .form-card select, .form-card textarea {
    width: 100%; border: 1px solid #d7e4e1; border-radius: 12px; padding: 11px 14px; font: inherit; background: #fff; color: var(--text);
}
.search-panel button, .filters button, .primary-button { border: 0; border-radius: 12px; padding: 11px 16px; background: var(--accent); color: #fff; font: inherit; font-weight: 800; cursor: pointer; }
.secondary-button { display:inline-flex; border-radius:12px; padding:11px 16px; background:#edf9f5; color:var(--accent-dark); font-weight:800; }
.search-panel button:hover, .filters button:hover, .primary-button:hover { background: var(--accent-dark); }
.section { margin-top: 24px; }
.section-head { display:flex; align-items:end; justify-content:space-between; gap:16px; margin-bottom: 12px; }
.section-head--tight { margin-bottom: 10px; }
.section-head h1, .page-title { margin:0; font-size: clamp(26px, 3vw, 42px); letter-spacing:-0.04em; }
.section-head h2 { margin:0; font-size: 18px; letter-spacing:-0.02em; }
.category-strip-wrap { overflow-x:auto; padding-bottom: 6px; }
.category-strip-wrap::-webkit-scrollbar { height: 8px; }
.category-strip-wrap::-webkit-scrollbar-thumb { background: #cdebe3; border-radius: 999px; }
.category-strip { display:flex; gap:10px; flex-wrap: nowrap; min-width: max-content; }
.category-pill { display:inline-flex; align-items:center; gap:8px; padding: 10px 14px; background:#fff; border:1px solid var(--line); border-radius: 999px; box-shadow: var(--shadow); white-space: nowrap; color: var(--text); }
.category-pill:hover { border-color: var(--accent-3); transform: translateY(-1px); }
.category-pill__icon { width: 18px; text-align:center; font-size: 14px; }
.category-pill__label { font-size: 14px; font-weight: 700; }
.listing-grid, .plans-grid, .stats-grid { display:grid; gap:16px; }
.listing-grid--home { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.listing-grid--catalog { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.plans-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.stats-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.listing-card, .plan-card, .stat-card, .category-card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
.listing-card { overflow: hidden; min-width: 0; }
.listing-card img { width:100%; aspect-ratio: 4 / 3; object-fit: cover; background:#eef5f4; }
.listing-body { padding: 14px; }
.listing-body h3 { margin:10px 0 8px; font-size: 15px; line-height: 1.3; letter-spacing:-0.02em; min-height: 38px; }
.price, .detail-price { font-size: 17px; font-weight: 900; letter-spacing:-0.02em; }
.meta { color: var(--muted); font-size: 13px; margin: 8px 0 10px; line-height:1.45; }
.badge { display:inline-flex; padding:6px 10px; border-radius:999px; background:#edf9f5; color:var(--accent-dark); font-size:11px; font-weight:800; }
.btn-link { color: var(--accent-dark); font-weight: 800; font-size: 14px; }
.catalog-layout { display:grid; grid-template-columns: 280px 1fr; gap: 18px; align-items:start; }
.sidebar { position: sticky; top: 110px; }
.filters { display:grid; gap:10px; }
.filters label, .form-card label { font-size: 14px; font-weight: 800; }
.results-count { color: var(--muted); margin-bottom: 12px; }
.empty-box { background:#fff; border:1px dashed #d5e6e2; border-radius:18px; padding:24px; color:var(--muted); }
.detail-layout { display:grid; grid-template-columns: 1.2fr .9fr; gap:20px; align-items:start; }
.detail-media, .detail-content, .form-card, .table-wrap { background:#fff; border:1px solid var(--line); border-radius:24px; box-shadow: var(--shadow); }
.detail-media { overflow:hidden; }
.detail-image { width:100%; aspect-ratio: 16 / 10; object-fit: cover; }
.detail-content { padding:24px; }
.contact-box { display:flex; flex-wrap:wrap; gap:10px; margin-top:20px; }
.form-card { padding:20px; }
.form-grid { display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap:14px; margin-bottom:18px; }
.form-grid .full { grid-column:1 / -1; }
.plan-card { padding:20px; display:grid; gap:12px; }
.plan-name { font-size:20px; font-weight:800; }
.plan-price { font-size:34px; font-weight:900; }
.plan-list { margin:0; padding-left:18px; color:var(--muted); display:grid; gap:6px; }
.stat-card { padding:18px; }
.stat-label { font-size:14px; color:var(--muted); }
.stat-value { font-size:34px; font-weight:900; margin-top:8px; }
.table-wrap { overflow:auto; }
.admin-table { width:100%; border-collapse:collapse; min-width:820px; }
.admin-table th, .admin-table td { padding:14px 16px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; }
.admin-table th { background:#f9fcfb; font-size:13px; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); }
.flash { border-radius: 14px; padding: 12px 14px; margin-bottom: 14px; border:1px solid var(--line); background:#fff; }
.flash.success { border-color: rgba(54,167,148,.25); color: var(--success); }
.flash.error { border-color: rgba(217,48,37,.25); color: var(--error); }
.site-footer { background:#fff; border-top:1px solid var(--line); margin-top: 36px; }
.footer-row { color: var(--muted); font-size:14px; }
.footer-row--premium { align-items:center; }
.footer-brand { display:grid; gap:8px; }
.footer-logo { height: 28px; width: auto; }
.footer-meta { font-weight: 700; color: var(--muted); }
@media (max-width: 1480px) {
  .container { width: min(1320px, calc(100% - 28px)); }
  .listing-grid--home { grid-template-columns: repeat(4, minmax(0,1fr)); }
  .listing-grid--catalog { grid-template-columns: repeat(4, minmax(0,1fr)); }
}
@media (max-width: 1200px) {
  .listing-grid--home, .listing-grid--catalog, .plans-grid, .stats-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .search-panel--compact { grid-template-columns: 1fr 1fr; }
  .catalog-layout, .detail-layout { grid-template-columns: 1fr; }
  .sidebar { position: static; }
}
@media (max-width: 820px) {
  .nav-wrap, .admin-head-row, .footer-row, .section-head { flex-direction: column; align-items: start; }
  .nav--premium { width:100%; gap:8px; }
  .search-panel--compact, .listing-grid--home, .listing-grid--catalog, .plans-grid, .stats-grid, .form-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 640px) {
  .container { width: calc(100% - 18px); }
  .search-panel--compact, .listing-grid--home, .listing-grid--catalog, .plans-grid, .stats-grid, .form-grid { grid-template-columns: 1fr; }
  .hero-card--clean { padding: 16px; }
  .brand-logo { height: 32px; }
}
.center-button{display:inline-flex;justify-content:center;align-items:center;}
.tools-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
.checkbox-row{display:flex;align-items:end;}
@media (max-width:700px){.tools-grid{grid-template-columns:1fr;}}


/* Premium automotive pass: account, detail, pricing */
.page-shell{display:grid;gap:18px;}
.page-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:4px;}
.page-kicker{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-dark);}
.page-subtitle{margin:8px 0 0;color:var(--muted);max-width:760px;line-height:1.5;}
.page-cta{display:inline-flex;align-items:center;justify-content:center;padding:12px 18px;border-radius:999px;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff;font-weight:800;box-shadow:0 14px 28px rgba(54,167,148,.22);}
.page-cta:hover{filter:brightness(.96);}
.section-card{background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);padding:18px;}
.muted-link{display:inline-flex;align-items:center;gap:8px;color:var(--muted);font-weight:700;font-size:14px;margin-bottom:10px;}

.account-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;}
.account-card{background:#fff;border:1px solid var(--line);border-radius:22px;overflow:hidden;box-shadow:var(--shadow);display:grid;grid-template-rows:auto 1fr;min-width:0;}
.account-card__media{position:relative;background:#eef5f4;aspect-ratio:4/3;overflow:hidden;}
.account-card__media img{width:100%;height:100%;object-fit:cover;}
.account-card__badge{position:absolute;left:12px;top:12px;}
.account-card__body{padding:16px;display:grid;gap:10px;}
.account-card__title{margin:0;font-size:17px;line-height:1.3;letter-spacing:-.02em;}
.account-card__meta{display:grid;gap:6px;color:var(--muted);font-size:13px;}
.account-card__actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px;}
.small-pill{display:inline-flex;align-items:center;gap:6px;padding:9px 12px;border-radius:999px;background:#f3faf8;color:var(--accent-dark);font-size:13px;font-weight:800;}
.small-pill--ghost{background:#f7f9fb;color:var(--text);}

.detail-shell{display:grid;grid-template-columns:minmax(0,1.35fr) 400px;gap:20px;align-items:start;}
.gallery-card,.summary-card,.content-card{background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);overflow:hidden;}
.gallery-card img{width:100%;aspect-ratio:16/10;object-fit:cover;background:#eef5f4;}
.summary-card{padding:22px;position:sticky;top:104px;display:grid;gap:14px;}
.summary-title{margin:0;font-size:30px;line-height:1.12;letter-spacing:-.04em;}
.detail-price{font-size:34px;font-weight:900;letter-spacing:-.04em;margin:0;}
.spec-list{display:grid;gap:10px;padding-top:4px;border-top:1px solid var(--line);}
.spec-row{display:flex;justify-content:space-between;gap:18px;font-size:14px;}
.spec-row span:first-child{color:var(--muted);}
.summary-actions{display:grid;gap:10px;margin-top:6px;}
.summary-actions .primary-button,.summary-actions .secondary-button,.summary-actions .page-cta{width:100%;justify-content:center;}
.content-card{padding:22px;display:grid;gap:18px;}
.content-card h2{margin:0;font-size:18px;letter-spacing:-.02em;}
.copy{color:var(--text);line-height:1.7;}

.pricing-shell{display:grid;gap:18px;}
.pricing-hero{background:linear-gradient(180deg,#ffffff,#f8fbfb);border:1px solid var(--line);border-radius:28px;box-shadow:var(--shadow);padding:24px;display:flex;align-items:flex-end;justify-content:space-between;gap:18px;}
.pricing-note{max-width:420px;color:var(--muted);line-height:1.5;}
.plan-card{padding:22px;border-radius:24px;position:relative;overflow:hidden;}
.plan-card::before{content:"";position:absolute;inset:0 0 auto 0;height:5px;background:linear-gradient(90deg,var(--accent),var(--accent-2),var(--accent-3));}
.plan-card.plan-free::before{background:linear-gradient(90deg,#93a1b3,#c5cfdb);}
.plan-card .plan-name{margin-top:8px;}
.plan-price{display:flex;align-items:flex-end;gap:8px;line-height:1;}
.plan-price small{font-size:14px;color:var(--muted);font-weight:700;}
.plan-period{color:var(--muted);font-size:14px;}
.plan-card .primary-button{width:100%;justify-content:center;margin-top:auto;}

.site-footer .footer-row{align-items:flex-start;}
.footer-links{display:grid;grid-template-columns:repeat(2,minmax(120px,1fr));gap:8px 28px;color:var(--text);font-weight:700;}
.footer-links a{color:var(--text);opacity:.82;}
.footer-links a:hover{opacity:1;color:var(--accent-dark);}

@media (max-width: 1200px){
  .account-grid,.plans-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
  .detail-shell{grid-template-columns:1fr;}
  .summary-card{position:static;}
}
@media (max-width: 900px){
  .account-grid,.plans-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .page-hero,.pricing-hero{flex-direction:column;align-items:flex-start;}
}
@media (max-width: 640px){
  .account-grid,.plans-grid{grid-template-columns:1fr;}
  .summary-title{font-size:24px;}
  .detail-price{font-size:28px;}
}


/* Publish / login / register premium pass */
.publish-shell{gap:18px;}
.publish-form{display:grid;gap:16px;}
.publish-step{padding:20px 22px;}
.publish-step__head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:16px;}
.publish-step__head h2{margin:4px 0 0;font-size:20px;letter-spacing:-.02em;}
.publish-grid{margin-bottom:0;}
.publish-actions{display:flex;justify-content:flex-end;}

.auth-shell{padding-top:12px;}
.auth-card{display:grid;grid-template-columns:1fr minmax(380px,520px);gap:18px;align-items:stretch;}
.auth-card--register{grid-template-columns:1.05fr minmax(420px,620px);}
.auth-copy,.auth-form{background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);padding:24px;}
.auth-copy{display:grid;align-content:center;gap:14px;background:linear-gradient(180deg,#ffffff,#f8fbfb);}
.auth-copy .page-title{margin:0;max-width:500px;}
.auth-badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px;}
.auth-form{display:grid;gap:18px;}
.auth-form__head h2{margin:0 0 6px;font-size:22px;letter-spacing:-.03em;}
.auth-form__grid{display:grid;grid-template-columns:1fr;gap:14px;}
.auth-form__grid--register{grid-template-columns:repeat(2,minmax(0,1fr));}
.auth-form__grid--register .full{grid-column:1/-1;}
.auth-submit{width:100%;justify-content:center;}
.auth-footer{font-size:14px;}

@media (max-width: 980px){
  .auth-card,.auth-card--register{grid-template-columns:1fr;}
  .publish-step__head{flex-direction:column;align-items:flex-start;}
}
@media (max-width: 640px){
  .auth-form__grid--register{grid-template-columns:1fr;}
  .publish-step{padding:16px;}
  .auth-copy,.auth-form{padding:18px;}
}
