:root {
  --bg: #0b0d0c;
  --panel: #111512;
  --panel-2: #171c18;
  --text: #f4f6f4;
  --muted: #a9b0aa;
  --line: #293029;
  --accent: #8fd400;
  --accent-2: #b5ef45;
  --white: #fff;
  --shadow: 0 20px 60px rgba(0,0,0,.28);
  --radius: 18px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; font-family: Inter, system-ui, -apple-system, Segoe UI, sans-serif; background:var(--bg); color:var(--text); line-height:1.6; }
img { max-width:100%; display:block; }
a { color:inherit; text-decoration:none; }
.container { width:min(1180px, calc(100% - 40px)); margin-inline:auto; }
.site-header { position:sticky; top:0; z-index:50; background:rgba(8,10,9,.88); backdrop-filter:blur(16px); border-bottom:1px solid rgba(255,255,255,.06); }
.nav-wrap { height:84px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { display:flex; align-items:center; gap:12px; font-family:"Barlow Condensed", sans-serif; font-weight:800; font-size:1.45rem; letter-spacing:.03em; text-transform:uppercase; }
.brand img { width:58px; height:58px; object-fit:contain; }
.main-nav { display:flex; align-items:center; gap:30px; font-weight:600; font-size:.95rem; }
.main-nav a { color:#d7ddd8; transition:.2s; }
.main-nav a:hover { color:var(--accent-2); }
.nav-cta { border:1px solid var(--accent); padding:10px 18px; border-radius:999px; }
.nav-toggle { display:none; background:none; color:#fff; border:0; font-size:1.7rem; }
.hero { position:relative; overflow:hidden; min-height:700px; display:flex; align-items:center; background:
 radial-gradient(circle at 20% 10%, rgba(143,212,0,.16), transparent 32%),
 linear-gradient(125deg,#0b0d0c 0%,#101710 55%,#0b0d0c 100%); }
.hero::before { content:""; position:absolute; inset:auto -10% -36% 42%; width:760px; height:760px; border:1px solid rgba(143,212,0,.14); border-radius:50%; box-shadow:0 0 0 80px rgba(143,212,0,.025),0 0 0 160px rgba(143,212,0,.02); }
.hero-overlay { position:absolute; inset:0; background:linear-gradient(90deg, rgba(0,0,0,.2), transparent); pointer-events:none; }
.hero-grid { position:relative; z-index:1; display:grid; grid-template-columns:1.12fr .88fr; gap:64px; align-items:center; padding-block:72px; }
.eyebrow { margin:0 0 12px; color:var(--accent-2); text-transform:uppercase; letter-spacing:.17em; font-size:.78rem; font-weight:800; }
h1,h2,h3 { font-family:"Barlow Condensed", Inter, sans-serif; line-height:.98; margin:0; }
h1 { font-size:clamp(3.8rem, 8vw, 7.2rem); text-transform:uppercase; letter-spacing:-.035em; }
h1 span { color:var(--accent); }
h2 { font-size:clamp(2.8rem, 5vw, 4.6rem); text-transform:uppercase; letter-spacing:-.02em; }
h3 { font-size:1.75rem; }
.hero-text { max-width:670px; color:#c5cbc6; font-size:1.12rem; margin:26px 0 34px; }
.hero-actions { display:flex; flex-wrap:wrap; gap:14px; }
.btn { display:inline-flex; align-items:center; justify-content:center; min-height:52px; padding:0 24px; border-radius:10px; font-weight:800; text-transform:uppercase; letter-spacing:.045em; font-size:.88rem; transition:.2s transform,.2s background; }
.btn:hover { transform:translateY(-2px); }
.btn-primary { background:var(--accent); color:#0b0d0c; }
.btn-primary:hover { background:var(--accent-2); }
.btn-secondary { border:1px solid #495149; color:#fff; background:rgba(255,255,255,.03); }
.hero-logo-card { justify-self:end; width:min(470px,100%); padding:20px; border-radius:30px; background:linear-gradient(145deg, rgba(255,255,255,.04), rgba(255,255,255,.01)); border:1px solid rgba(255,255,255,.09); box-shadow:var(--shadow); }
.hero-logo-card img { border-radius:20px; }
.section { padding:105px 0; }
.inventory-section { background:#f2f4f1; color:#121512; }
.section-heading { margin-bottom:44px; }
.split-heading { display:grid; grid-template-columns:1fr .82fr; gap:50px; align-items:end; }
.split-heading > p { margin:0 0 4px; color:#5d665f; max-width:540px; justify-self:end; }
.centered { text-align:center; max-width:760px; margin-inline:auto; margin-bottom:50px; }
.centered > p:last-child { color:var(--muted); }
.inventory-grid { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:28px; }
.listing-card { background:#fff; border:1px solid #dfe4df; border-radius:var(--radius); overflow:hidden; box-shadow:0 8px 30px rgba(20,30,20,.07); transition:.22s transform,.22s box-shadow; }
.listing-card:hover { transform:translateY(-4px); box-shadow:0 18px 40px rgba(20,30,20,.12); }
.listing-image { position:relative; aspect-ratio:16/10; overflow:hidden; background:#e4e8e4; }
.listing-image img { width:100%; height:100%; object-fit:cover; }
.status-badge { position:absolute; top:16px; left:16px; background:var(--accent); color:#111; font-weight:900; text-transform:uppercase; font-size:.72rem; letter-spacing:.08em; padding:8px 11px; border-radius:999px; }
.listing-body { padding:24px; }
.listing-kicker { color:#697269; font-size:.78rem; text-transform:uppercase; letter-spacing:.12em; font-weight:800; }
.listing-title { color:#111; font-size:2.05rem; margin-top:4px; }
.listing-meta { margin:18px 0 20px; display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid #e4e8e4; border-bottom:1px solid #e4e8e4; }
.meta-item { padding:13px 10px 13px 0; }
.meta-item + .meta-item { border-left:1px solid #e4e8e4; padding-left:14px; }
.meta-label { display:block; color:#8a928b; font-size:.68rem; text-transform:uppercase; font-weight:800; letter-spacing:.07em; }
.meta-value { display:block; color:#1b211c; font-weight:800; margin-top:2px; font-size:.9rem; }
.listing-bottom { display:flex; justify-content:space-between; gap:15px; align-items:center; }
.price { font-family:"Barlow Condensed", sans-serif; color:#111; font-weight:800; font-size:1.65rem; text-transform:uppercase; }
.details-btn { border:0; background:#111512; color:#fff; font:inherit; font-weight:800; padding:11px 16px; border-radius:9px; cursor:pointer; }
.services { background:var(--bg); }
.service-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.service-card { padding:32px; border:1px solid var(--line); background:linear-gradient(145deg,#111512,#0e110f); border-radius:var(--radius); min-height:260px; }
.service-number { color:var(--accent); font-family:"Barlow Condensed"; font-weight:800; font-size:1.3rem; }
.service-card h3 { margin:55px 0 13px; text-transform:uppercase; }
.service-card p { margin:0; color:var(--muted); }
.about { background:#111512; }
.about-grid { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:72px; }
.about-image-wrap { position:relative; }
.about-image-wrap > img { width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:var(--radius); filter:saturate(.9) contrast(1.03); }
.image-badge { position:absolute; right:-20px; bottom:-20px; background:var(--accent); color:#101410; padding:20px 24px; border-radius:12px; font-family:"Barlow Condensed"; font-weight:900; font-size:1.45rem; line-height:.9; box-shadow:var(--shadow); }
.image-badge span { font-size:.8rem; letter-spacing:.18em; }
.about-copy p:not(.eyebrow) { color:#b8c0ba; font-size:1.05rem; }
.text-link { display:inline-block; margin-top:12px; color:var(--accent-2); font-weight:800; }
.contact { background:linear-gradient(120deg,#8fd400,#a8e72a); color:#0b0d0c; }
.contact-panel { display:flex; align-items:center; justify-content:space-between; gap:40px; }
.contact .eyebrow { color:#2b3d06; }
.contact p { max-width:700px; }
.contact .btn-primary { background:#0b0d0c; color:#fff; }
.site-footer { background:#070908; padding:34px 0; border-top:1px solid #181d19; }
.footer-grid { display:flex; align-items:center; justify-content:space-between; gap:30px; }
.footer-brand { display:flex; align-items:center; gap:12px; }
.footer-brand img { width:52px; height:52px; object-fit:contain; }
.footer-brand strong,.footer-brand span { display:block; }
.footer-brand span,.site-footer p { color:#7f8881; font-size:.82rem; margin:0; }
.modal { position:fixed; inset:0; z-index:100; display:none; }
.modal.open { display:block; }
.modal-backdrop { position:absolute; inset:0; background:rgba(0,0,0,.78); backdrop-filter:blur(5px); }
.modal-panel { position:relative; z-index:1; width:min(980px,calc(100% - 30px)); max-height:90vh; overflow:auto; margin:5vh auto; border-radius:20px; background:#f6f7f5; color:#141814; box-shadow:0 30px 90px rgba(0,0,0,.5); }
.modal-close { position:absolute; z-index:2; right:14px; top:14px; width:42px; height:42px; border-radius:50%; border:0; background:rgba(0,0,0,.7); color:#fff; font-size:1.6rem; cursor:pointer; }
.modal-detail-image { width:100%; max-height:520px; object-fit:cover; }
.modal-detail-body { padding:30px; }
.modal-detail-body h2 { font-size:3.3rem; }
.modal-specs { display:grid; grid-template-columns:repeat(2,1fr); margin:26px 0; border:1px solid #dde2dd; border-radius:12px; overflow:hidden; }
.modal-spec { padding:14px 16px; border-bottom:1px solid #dde2dd; }
.modal-spec:nth-child(odd) { border-right:1px solid #dde2dd; }
.modal-spec strong { display:block; font-size:.72rem; color:#7c847d; text-transform:uppercase; letter-spacing:.08em; }
.modal-note { background:#e9eee7; border-left:4px solid var(--accent); padding:15px 17px; border-radius:8px; color:#4e574f; }
@media (max-width: 900px) {
  .nav-toggle { display:block; }
  .main-nav { position:absolute; top:84px; left:20px; right:20px; display:none; flex-direction:column; align-items:stretch; gap:0; padding:14px; background:#101310; border:1px solid #262d27; border-radius:14px; box-shadow:var(--shadow); }
  .main-nav.open { display:flex; }
  .main-nav a { padding:13px 12px; }
  .nav-cta { border:0; }
  .hero { min-height:auto; }
  .hero-grid { grid-template-columns:1fr; gap:42px; padding-block:60px; }
  .hero-logo-card { justify-self:start; width:min(380px,88vw); }
  .split-heading,.about-grid { grid-template-columns:1fr; gap:30px; }
  .split-heading > p { justify-self:start; }
  .service-grid { grid-template-columns:1fr; }
  .contact-panel,.footer-grid { flex-direction:column; align-items:flex-start; }
}
@media (max-width: 700px) {
  .container { width:min(100% - 28px,1180px); }
  .brand span { display:none; }
  .inventory-grid { grid-template-columns:1fr; }
  .listing-meta { grid-template-columns:1fr; }
  .meta-item + .meta-item { border-left:0; border-top:1px solid #e4e8e4; padding-left:0; }
  .listing-bottom { align-items:flex-start; flex-direction:column; }
  .section { padding:76px 0; }
  .modal-specs { grid-template-columns:1fr; }
  .modal-spec:nth-child(odd) { border-right:0; }
}

.contact-details { display:flex; flex-wrap:wrap; gap:14px 24px; margin-top:18px; font-weight:900; font-size:1.15rem; }
.contact-details a { text-decoration:underline; text-underline-offset:4px; }
.contact-actions { display:flex; flex-wrap:wrap; gap:12px; justify-content:flex-end; }
.btn-dark-outline { border:2px solid #0b0d0c; color:#0b0d0c; background:transparent; }
.btn-dark-outline:hover { background:#0b0d0c; color:#fff; }
.listing-contact-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:22px; }
.btn-secondary-dark { background:#242a25; color:#fff; border:1px solid #39403a; }
@media (max-width:900px){ .contact-actions{justify-content:flex-start;} }

/* Homepage refresh */
.hero { background:
  linear-gradient(90deg, rgba(5,7,6,.96) 0%, rgba(7,10,8,.88) 45%, rgba(7,10,8,.58) 100%),
  url('../images/jline-shop.jpg') center center/cover no-repeat;
}
.hero::before { width:680px; height:680px; inset:auto -12% -38% auto; }
.hero-grid { grid-template-columns:1.08fr .62fr; }
.hero-logo-card { background:rgba(7,10,8,.72); backdrop-filter:blur(8px); border-color:rgba(143,212,0,.22); }
.hero-trust-row { display:flex; flex-wrap:wrap; gap:10px; margin-top:26px; }
.hero-trust-row span { border:1px solid rgba(255,255,255,.14); background:rgba(0,0,0,.3); color:#d6ddd7; padding:8px 12px; border-radius:999px; font-size:.76rem; font-weight:800; text-transform:uppercase; letter-spacing:.06em; }
.inventory-section { position:relative; }
.inventory-section::before { content:"FEATURED INVENTORY"; position:absolute; right:2%; top:22px; font-family:"Barlow Condensed",sans-serif; font-weight:800; font-size:clamp(3rem,9vw,8rem); line-height:1; color:rgba(14,20,15,.035); pointer-events:none; }
@media (max-width:900px){
  .hero { background-position:58% center; }
  .hero-grid { grid-template-columns:1fr; }
  .hero-logo-card { width:min(320px,82vw); }
}

/* Finishing touches */
.inventory-note-strip { background:#dff6a7; color:#152006; border-top:1px solid #c6e783; border-bottom:1px solid #bfdc83; }
.inventory-note-inner { min-height:72px; display:flex; align-items:center; gap:18px; }
.inventory-note-inner strong { font-family:"Barlow Condensed",sans-serif; text-transform:uppercase; font-size:1.15rem; }
.inventory-note-inner span { color:#435127; }
.inventory-note-inner a { margin-left:auto; font-weight:900; white-space:nowrap; }
.buying-section { background:#f6f7f5; color:#151915; }
.buying-section .centered > p:last-child { color:#687069; }
.buying-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.buying-steps article { position:relative; overflow:hidden; min-height:275px; padding:32px; border-radius:var(--radius); background:#fff; border:1px solid #dfe4df; box-shadow:0 10px 30px rgba(20,30,20,.055); }
.buying-steps article > span { display:inline-grid; place-items:center; width:48px; height:48px; border-radius:50%; background:var(--accent); color:#111; font-family:"Barlow Condensed",sans-serif; font-size:1.45rem; font-weight:900; }
.buying-steps h3 { margin:56px 0 12px; text-transform:uppercase; font-size:2rem; }
.buying-steps p { margin:0; color:#697169; }
.looking { background:radial-gradient(circle at 86% 20%,rgba(143,212,0,.13),transparent 25%),#0b0d0c; border-top:1px solid #1c231d; }
.looking-grid { display:grid; grid-template-columns:1.2fr .8fr; align-items:center; gap:60px; }
.looking p:not(.eyebrow) { color:#aeb6af; max-width:720px; }
.looking-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:12px; }
.mobile-contact-bar { display:none; }
.listing-card { isolation:isolate; }
.listing-image::after { content:""; position:absolute; inset:auto 0 0; height:32%; background:linear-gradient(transparent,rgba(0,0,0,.18)); pointer-events:none; }
.status-badge { z-index:1; }
.details-btn:hover { background:#293229; }
.details-btn:focus-visible,.btn:focus-visible,.main-nav a:focus-visible,.nav-toggle:focus-visible { outline:3px solid var(--accent-2); outline-offset:3px; }
@media (max-width:900px){
  .buying-steps,.looking-grid { grid-template-columns:1fr; }
  .looking-actions { justify-content:flex-start; }
  .inventory-note-inner { padding-block:16px; flex-wrap:wrap; }
  .inventory-note-inner a { margin-left:0; }
}
@media (max-width:700px){
  body { padding-bottom:64px; }
  .mobile-contact-bar { position:fixed; z-index:80; display:grid; grid-template-columns:1fr 1fr; left:0; right:0; bottom:0; min-height:64px; background:#0b0d0c; border-top:1px solid #303730; box-shadow:0 -10px 28px rgba(0,0,0,.28); }
  .mobile-contact-bar a { display:grid; place-items:center; font-weight:900; text-transform:uppercase; letter-spacing:.04em; font-size:.85rem; }
  .mobile-contact-bar a:first-child { background:var(--accent); color:#0b0d0c; }
  .buying-steps { grid-template-columns:1fr; }
  .inventory-note-inner { gap:8px 14px; }
  .inventory-note-inner span { width:100%; }
}

/* Launch-readiness additions */
body { font-family: Arial, Helvetica, sans-serif; }
h1,h2,h3,.eyebrow,.service-number,.image-badge,.inventory-note-inner strong,.buying-steps article > span { font-family: "Arial Narrow", Arial, Helvetica, sans-serif; }
.skip-link { position:fixed; left:12px; top:-60px; z-index:999; padding:10px 14px; background:#fff; color:#111; border-radius:8px; font-weight:800; }
.skip-link:focus { top:12px; }
.listing-gallery { background:#111; }
.gallery-thumbs { display:flex; gap:10px; padding:12px; overflow-x:auto; }
.gallery-thumb { width:92px; height:66px; flex:0 0 auto; padding:0; border:2px solid transparent; border-radius:8px; overflow:hidden; background:#222; cursor:pointer; }
.gallery-thumb.active,.gallery-thumb:focus-visible { border-color:var(--accent); }
.gallery-thumb img { width:100%; height:100%; object-fit:cover; }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; animation:none!important; } }

/* Mobile-first final polish */
html { -webkit-text-size-adjust:100%; }
img { max-width:100%; height:auto; }
button, a { -webkit-tap-highlight-color: transparent; }
@media (max-width:700px){
  .site-header { position:sticky; top:0; z-index:70; }
  .nav-wrap { min-height:70px; }
  .brand img { max-height:52px; width:auto; }
  .main-nav { top:70px; left:14px; right:14px; }
  .main-nav a { min-height:48px; display:flex; align-items:center; }
  .nav-toggle { min-width:48px; min-height:48px; }
  .hero-grid { padding-block:42px 48px; }
  .hero-copy h1 { font-size:clamp(2.55rem,14vw,4.5rem); line-height:.95; }
  .hero-text { font-size:1rem; line-height:1.6; }
  .hero-actions,.looking-actions,.contact-actions,.listing-contact-actions { display:grid; grid-template-columns:1fr; width:100%; }
  .hero-actions .btn,.looking-actions .btn,.contact-actions .btn,.listing-contact-actions .btn { width:100%; min-height:52px; display:flex; align-items:center; justify-content:center; text-align:center; }
  .hero-logo-card { justify-self:center; width:min(300px,78vw); }
  .section-heading h2,.about-copy h2,.looking h2,.contact h2 { font-size:clamp(2.2rem,11vw,3.5rem); }
  .listing-card { border-radius:14px; overflow:hidden; }
  .listing-image { aspect-ratio:4/3; }
  .listing-image img { width:100%; height:100%; object-fit:cover; }
  .listing-content { padding:20px 18px; }
  .listing-title { font-size:1.65rem; }
  .listing-price { font-size:1.6rem; }
  .details-btn { min-height:50px; width:100%; }
  .about-image-wrap img { width:100%; }
  .contact-details { font-size:1rem; overflow-wrap:anywhere; }
  .modal { padding:0; }
  .modal-panel { width:100%; max-width:none; max-height:100dvh; height:100dvh; border-radius:0; overflow-y:auto; }
  .modal-content { padding-bottom:88px; }
  .modal-close { width:48px; height:48px; font-size:2rem; }
  .gallery-thumbs { scroll-snap-type:x proximity; }
  .gallery-thumb { width:104px; height:76px; scroll-snap-align:start; }
  .mobile-contact-bar { padding-bottom:env(safe-area-inset-bottom); min-height:calc(64px + env(safe-area-inset-bottom)); }
  body { padding-bottom:calc(64px + env(safe-area-inset-bottom)); }
}
@media (max-width:390px){
  .container { width:min(100% - 22px,1180px); }
  .hero-copy h1 { font-size:2.45rem; }
  .hero-trust-row { gap:7px; }
  .hero-trust-row span { font-size:.68rem; }
}