
:root{
  --bg:#0b0d10;--panel:#13171c;--text:#f5f7fa;--muted:#9ba5b2;
  --accent:#f1b728;--paper:#f6f7f8;--ink:#15181c;--line:#dfe3e7;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,sans-serif;color:var(--ink);background:#fff}
.container{width:min(1180px,92%);margin:auto}.topbar{position:sticky;top:0;z-index:20;background:#2c3238;backdrop-filter:blur(12px);border-bottom:1px solid #3b4249}
.nav{height:64px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:#fff}
.brand-mark{display:grid;place-items:center;width:38px;height:38px;background:var(--accent);color:#111;font-family:Oswald;font-weight:700;transform:skew(-8deg)}
.brand strong,.brand small{display:block}.brand strong{font:700 16px Oswald;letter-spacing:.8px}.brand small{font-size:10px;letter-spacing:2px;color:#c1c7cd;margin-top:3px}
nav{display:flex;gap:26px}nav a{color:#f1f3f5;text-decoration:none;font-size:14px;font-weight:600}nav a:hover{color:var(--accent)}
.btn{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:5px;background:var(--accent);color:#121212;padding:15px 22px;font-weight:800;text-decoration:none;cursor:pointer}.btn:hover{filter:brightness(1.06)}.btn-small{padding:11px 16px}.btn-secondary{background:#fff;color:#1a1f24;border:1px solid #b9c1c8}
.hero{background:#f4f5f6;color:#171b20;padding:48px 0 44px;overflow:hidden;border-bottom:1px solid #d9dde1}.hero-grid{display:grid;grid-template-columns:.72fr 1.28fr;gap:42px;align-items:center}
.eyebrow{display:inline-block;color:var(--accent);font-weight:800;font-size:12px;letter-spacing:2.3px;margin-bottom:16px}.eyebrow.dark{color:#9a6900}
h1,h2,h3{margin-top:0}h1{font:700 clamp(38px,5.2vw,64px)/.98 Oswald,sans-serif;letter-spacing:-1px;margin-bottom:22px;text-transform:uppercase;color:#171b20}h1 span{color:var(--accent)}
.hero-copy>p{max-width:650px;font-size:16px;line-height:1.6;color:#4d5660}.hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin:22px 0}.trust{display:flex;gap:26px;border-top:1px solid #cfd5da;padding-top:22px}.trust div{display:flex;flex-direction:column}.trust strong{font-size:24px}.trust span{color:#66717c;font-size:12px;margin-top:4px}
.hero-card{background:#fff;border:1px solid #cfd6dc;box-shadow:0 16px 38px #28313a22;transform:none}.hero-map{display:block;width:100%;height:310px;border:0}.map-card{min-width:0}.map-card .location-strip{display:flex;align-items:center;justify-content:space-between;gap:14px;text-decoration:none}.map-card .location-strip b{color:#9a6900;font-size:12px;white-space:nowrap}
.photo-overlay{height:100%;padding:28px;display:flex;flex-direction:column;justify-content:flex-end}.photo-overlay span{font-size:14px;color:#ddd}.photo-overlay strong{font:700 40px Oswald}.location-strip{padding:18px 22px;color:#39424c;font-size:14px}
.section{padding:58px 0}.section h2{font:700 clamp(32px,4.4vw,50px)/1 Oswald;text-transform:uppercase;letter-spacing:-.7px}.lead{max-width:760px;color:#606a75;line-height:1.6;font-size:15px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:28px}.card{padding:22px;border:1px solid var(--line);background:#fff;min-height:220px}.card:hover{box-shadow:0 18px 45px #1c273317;transform:translateY(-3px);transition:.2s}.icon{font-size:29px}.card h3{font:700 20px Oswald;margin:16px 0 8px;text-transform:uppercase}.card p{color:#68727d;line-height:1.65}
.section-dark{background:#0c0f13;color:#fff}.split{display:grid;grid-template-columns:1fr 1fr;gap:42px}.split p{color:#b6bec8;font-size:17px;line-height:1.8}.text-link{color:var(--accent);text-decoration:none;font-weight:800}
.workshop-gallery{padding:0 0 58px;background:#fff}.gallery-heading{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:16px}.gallery-heading .eyebrow{margin:0}.gallery-heading p{margin:0;color:#707a84;font-size:12px;line-height:1.5;text-align:right}.gallery-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.gallery-grid figure{min-height:245px;margin:0;position:relative;overflow:hidden;background-position:center;background-size:cover}.gallery-grid figure::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#090c10c9 0%,transparent 58%)}.gallery-grid span{position:absolute;z-index:1;left:22px;bottom:18px;color:#fff;font:700 22px Oswald;text-transform:uppercase;letter-spacing:.2px}.gallery-workshop{background-image:url('images/service-auto-horted-atelier.png')}.gallery-diagnostics{background-image:url('images/diagnoza-mercedes-benz.png')}
.review-summary{display:flex;align-items:center;gap:25px;margin:34px 0}.big-rating{font:700 72px Oswald}.stars{letter-spacing:4px;color:#d89600;font-size:24px}.review-summary p{color:#66717c}.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.quotes blockquote{margin:0;padding:26px;border-left:4px solid var(--accent);background:var(--paper);font-size:16px;line-height:1.65}
.contact{background:var(--paper)}.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:42px}.contact-list{display:grid;gap:1px;margin-top:35px;background:#d9dde1}.contact-list>a,.contact-list>div{background:#fff;padding:18px;text-decoration:none;color:inherit}.contact-list b,.contact-list span{display:block}.contact-list span{color:#626b75;margin-top:5px;line-height:1.5}
.form{background:#fff;padding:30px;border:1px solid #dadddf;display:grid;gap:17px}.form label{display:grid;gap:8px;font-size:13px;font-weight:700}.form input,.form textarea{width:100%;padding:14px 15px;border:1px solid #cdd3d9;font:inherit}.form small{color:#777;line-height:1.4}
footer{background:#07090b;color:#fff;padding:34px 0}.footer-grid{display:flex;align-items:center;justify-content:space-between;gap:30px}footer p{font-size:12px;color:#88929d}
@media(max-width:850px){nav{display:none}.hero{padding-top:55px}.hero-grid,.split,.contact-grid{grid-template-columns:1fr}.hero-card{transform:none}.hero-photo{height:350px}.cards,.quotes{grid-template-columns:1fr 1fr}.trust{gap:20px;flex-wrap:wrap}.gallery-heading{align-items:flex-start;flex-direction:column}.gallery-heading p{text-align:left}.gallery-grid{grid-template-columns:1fr}}
@media(max-width:560px){.topbar .btn-small{display:none}.nav{height:68px}.cards,.quotes{grid-template-columns:1fr}.hero{padding-bottom:52px}.section{padding:68px 0}.hero-photo{height:300px}.footer-grid{align-items:flex-start;flex-direction:column}.workshop-gallery{padding-bottom:42px}.gallery-grid figure{min-height:210px}}

.expertise{background:#fff}
.brand-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-top:38px}
.brand-box{border:1px solid var(--line);padding:24px 18px;min-height:145px;background:var(--paper);display:flex;flex-direction:column;justify-content:center}
.brand-box strong{font:700 22px Oswald;text-transform:uppercase;margin-bottom:10px}
.brand-box span{font-size:13px;color:#69737e;line-height:1.5}
@media(max-width:900px){.brand-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.brand-grid{grid-template-columns:1fr}}

/* Compact layout tuning */
.eyebrow{margin-bottom:10px}
.btn{padding:12px 18px}
.btn-small{padding:9px 14px}
.review-summary{margin:24px 0}
.quotes{gap:14px}
.quotes blockquote{padding:20px}
.brand-grid{margin-top:26px;gap:10px}
.brand-box{min-height:120px;padding:18px 14px}
.contact-list{margin-top:24px}
footer{padding:24px 0}

@media(max-width:850px){
  .hero{padding-top:38px}
  .hero-photo{height:300px}
  .section{padding:48px 0}
}
@media(max-width:560px){
  .nav{height:58px}
  .hero{padding:34px 0 36px}
  .hero-photo{height:250px}
  .section{padding:42px 0}
  .trust{gap:14px}
}

/* Keep headline words together */
h1 .keep-line{white-space:nowrap;color:#171b20}
h1 .keep-line b{color:var(--accent);font-weight:inherit}

.keep-together{white-space:nowrap;}

.hero-title-one-line{
  white-space:nowrap;
  font-size:clamp(30px,4.3vw,58px);
  letter-spacing:-0.7px;
}
@media(max-width:700px){
  .hero-title-one-line{
    white-space:normal;
    font-size:clamp(30px,9vw,46px);
  }
}

/* Fotografii reale Service Auto Horted */
.gallery-grid{grid-template-columns:repeat(3,1fr)}
.gallery-grid span{right:18px;font-size:20px}
.gallery-exterior{background-image:url('./images/service-auto-horted-exterior.jpg')}
.gallery-workshop{background-image:url('./images/service-auto-horted-atelier.jpg')}
.gallery-diagnostics{background-image:url('./images/diagnoza-mercedes-benz.jpg')}
@media(max-width:850px){.gallery-grid{grid-template-columns:1fr}}
