@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Inter:wght@400;500;600;700&display=swap');

:root{
  --paper:#F7F5F1;
  --card:#FFFFFF;
  --ink:#1C1E21;
  --ink-2:#66696F;
  --line:#E7E4DD;
  --line-strong:#D8D4CB;
  --gold:#F0AF1C;
  --gold-deep:#D9970A;
  --gold-soft:#F9E7BC;
  --gold-tint:#FBF3DF;
  --art-bg:#EFECE6;
  --ok:#3BA55D;
  --err:#C0504A;
  --font-display:'Space Grotesk',ui-sans-serif,system-ui,sans-serif;
  --font-body:'Inter',ui-sans-serif,system-ui,'PingFang SC','Microsoft YaHei',sans-serif;
  --radius:20px;
  --shadow-sm:0 1px 2px rgba(28,30,33,.05),0 4px 14px rgba(28,30,33,.05);
  --shadow-md:0 2px 6px rgba(28,30,33,.06),0 14px 34px rgba(28,30,33,.10);
}

*{margin:0;padding:0;box-sizing:border-box}
body{
  font-family:var(--font-body);
  background:var(--paper);
  color:var(--ink);
  line-height:1.6;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:6px}

.wrap{max-width:1180px;margin:0 auto;padding-left:26px;padding-right:26px}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--ink);color:#fff;padding:10px 16px;border-radius:0 0 10px 0;z-index:99}
.skip-link:focus{left:0}

.topbar{background:var(--paper);border-bottom:1px solid var(--line)}
.topbar-in{display:flex;justify-content:space-between;align-items:center;gap:14px;padding-top:9px;padding-bottom:9px}
.topbar-item{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:500;color:var(--ink-2);letter-spacing:.01em;white-space:nowrap}
.topbar-item svg{width:15px;height:15px;color:var(--gold-deep);flex:none}
.topbar-item:hover{color:var(--ink)}
.topbar-item strong{color:var(--ink);font-weight:600}

.site-header{position:sticky;top:0;z-index:40;background:rgba(247,245,241,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.header-in{display:flex;flex-direction:column;align-items:center;gap:8px;padding-top:16px;padding-bottom:12px}
.logo{display:inline-flex;align-items:center}
.logo-img{height:34px;width:auto;display:block}
.main-nav{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
.nav-link{font-family:var(--font-display);font-weight:500;font-size:15px;letter-spacing:.04em;color:var(--ink-2);padding:7px 16px;border-radius:999px;transition:color .15s,background .15s}
.nav-link:hover{color:var(--ink);background:var(--gold-tint)}
.nav-link.is-active{color:var(--ink);background:var(--gold-soft)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:var(--font-display);font-weight:600;font-size:15px;letter-spacing:.05em;text-transform:uppercase;border-radius:999px;padding:13px 26px;transition:transform .15s,box-shadow .15s,background .15s,color .15s;white-space:nowrap}
.btn svg{width:17px;height:17px}
.btn-solid{background:var(--ink);color:#fff;box-shadow:var(--shadow-sm)}
.btn-solid:hover{transform:translateY(-1px);box-shadow:var(--shadow-md);background:#000}
.btn-outline{border:1.5px solid var(--line-strong);color:var(--ink);background:transparent}
.btn-outline:hover{border-color:var(--ink);background:#fff}
.btn-big{padding:15px 30px;font-size:16px}

.hero{border-bottom:1px solid var(--line);background:linear-gradient(180deg,#F7F5F1 0%,#F3F0E9 100%);overflow:hidden}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:48px;align-items:center;padding-top:34px;padding-bottom:52px}
.hero-art{border-radius:26px;overflow:hidden;box-shadow:var(--shadow-md);border:1px solid var(--line);min-height:340px;background:var(--art-bg)}
.hero-art svg{width:100%;height:100%;min-height:340px}
.eyebrow{font-family:var(--font-display);font-weight:600;font-size:13px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold-deep);margin-bottom:14px}
.hero-copy h1{font-family:var(--font-display);font-weight:700;font-size:clamp(38px,5vw,58px);line-height:1.05;letter-spacing:-.02em;margin-bottom:18px}
.hero-sub{font-size:17px;color:var(--ink-2);max-width:46ch;margin-bottom:26px}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:30px}
.hero-facts{list-style:none;display:flex;flex-wrap:wrap;gap:10px 26px;border-top:1px solid var(--line);padding-top:20px}
.hero-facts li{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:500;color:var(--ink-2)}
.hero-facts svg{width:15px;height:15px;color:var(--gold-deep)}

.section-head{margin-bottom:26px}
.section-head h2{font-family:var(--font-display);font-weight:700;font-size:clamp(26px,3.2vw,34px);letter-spacing:-.01em}
.section-head p{color:var(--ink-2);margin-top:4px}
.section-head-row{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;flex-wrap:wrap}

.arrivals{padding:56px 0 30px}
.carousel-nav{display:flex;gap:8px}
.carousel-btn{width:42px;height:42px;border-radius:50%;border:1.5px solid var(--line-strong);display:inline-flex;align-items:center;justify-content:center;background:#fff;transition:border-color .15s,transform .15s}
.carousel-btn:hover{border-color:var(--ink);transform:translateY(-1px)}
.carousel-btn svg{width:17px;height:17px}
.carousel{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(272px,300px);gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 4px 18px;scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent}
.carousel .car-card{scroll-snap-align:start}
.arrivals-more{display:flex;justify-content:center;margin-top:8px}

.car-card{display:flex;flex-direction:column;text-align:left;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm);transition:transform .18s,box-shadow .18s,border-color .18s}
.car-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--line-strong)}
.card-photo{position:relative;display:block;aspect-ratio:44/30;background:var(--art-bg);overflow:hidden}
.card-photo img{width:100%;height:100%;object-fit:cover}
.card-photo-empty{display:flex;align-items:center;justify-content:center;width:100%;height:100%;color:var(--line-strong)}
.card-photo-empty svg{width:64px;height:64px}
.badge{position:absolute;top:12px;left:12px;background:var(--gold);color:var(--ink);font-family:var(--font-display);font-weight:600;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;padding:5px 11px;border-radius:999px;box-shadow:var(--shadow-sm)}
.card-body{display:flex;flex-direction:column;gap:5px;padding:16px 18px 18px}
.card-title{font-family:var(--font-display);font-weight:600;font-size:17.5px;letter-spacing:-.01em}
.card-meta{font-size:13.5px;color:var(--ink-2)}
.card-foot{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-top:6px}
.card-price{font-family:var(--font-display);font-weight:700;font-size:19px}
.card-stock{font-size:12px;color:var(--ink-2);letter-spacing:.04em}

.visit{padding:46px 0 70px}
.visit-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.visit-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:26px 28px;box-shadow:var(--shadow-sm)}
.visit-card h3{font-family:var(--font-display);font-weight:600;font-size:18px;display:flex;align-items:center;gap:9px;margin-bottom:16px}
.visit-card h3 svg{width:19px;height:19px;color:var(--gold-deep)}
.open-status{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;margin-bottom:12px;padding:6px 12px;border-radius:999px;background:var(--gold-tint)}
.open-status .dot{width:8px;height:8px;border-radius:50%;background:var(--ink-2)}
.open-status.is-open .dot{background:var(--ok)}
.open-status.is-open{color:#2C7A46}
.open-status.is-closed .dot{background:var(--err)}
.open-status.is-closed{color:#9A423D}
.hours-table{width:100%;border-collapse:collapse;font-size:14.5px}
.hours-table th{font-weight:500;color:var(--ink-2);text-align:left;padding:9px 0;border-bottom:1px solid var(--line)}
.hours-table td{text-align:right;font-weight:600;padding:9px 0;border-bottom:1px solid var(--line)}
.hours-table tr:last-child th,.hours-table tr:last-child td{border-bottom:0}
.hours-table tr.is-today th,.hours-table tr.is-today td{color:var(--gold-deep)}
.visit-line{display:flex;align-items:center;gap:10px;padding:11px 0;border-bottom:1px solid var(--line);font-weight:500;font-size:15px}
.visit-line svg{width:16px;height:16px;color:var(--gold-deep);flex:none}
.visit-line:hover{color:var(--gold-deep)}
.visit-card .btn{margin-top:18px}
.visit-map{grid-column:1/-1;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm)}
.visit-map iframe{width:100%;height:340px;border:0;display:block}
.map-link{display:flex;align-items:center;justify-content:center;gap:8px;padding:14px;font-family:var(--font-display);font-weight:600;font-size:14px;letter-spacing:.05em;text-transform:uppercase;border-top:1px solid var(--line)}
.map-link svg{width:15px;height:15px}
.map-link:hover{background:var(--gold-tint)}

.page-head{padding:44px 0 24px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,#F7F5F1,#F3F0E9)}
.page-head h1{font-family:var(--font-display);font-weight:700;font-size:clamp(30px,4vw,42px);letter-spacing:-.015em}
.page-head p{color:var(--ink-2);margin-top:6px}
.page-head .btn{margin-top:18px}

.filter-bar{position:sticky;top:0;z-index:30;background:rgba(247,245,241,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.chip-row{display:flex;gap:9px;overflow-x:auto;padding-top:13px;padding-bottom:13px;scrollbar-width:none}
.chip-row::-webkit-scrollbar{display:none}
.chip{flex:none;font-family:var(--font-display);font-weight:500;font-size:14px;letter-spacing:.03em;padding:8px 17px;border-radius:999px;border:1.5px solid var(--line-strong);color:var(--ink-2);background:#fff;transition:all .15s}
.chip:hover{border-color:var(--ink);color:var(--ink)}
.chip.is-active{background:var(--ink);border-color:var(--ink);color:#fff}

.inventory{padding:34px 0 76px}
.inventory-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(272px,1fr));gap:22px}
.empty-state{background:var(--card);border:1px dashed var(--line-strong);border-radius:var(--radius);padding:54px 30px;text-align:center;color:var(--ink-2)}
.empty-state p:first-child{font-family:var(--font-display);font-weight:600;font-size:19px;color:var(--ink);margin-bottom:8px}
.empty-state a{color:var(--gold-deep);font-weight:600;text-decoration:underline;text-underline-offset:3px}

.detail{padding:30px 0 76px}
.back-link{display:inline-flex;align-items:center;gap:7px;font-family:var(--font-display);font-weight:500;font-size:14px;letter-spacing:.03em;color:var(--ink-2);margin-bottom:22px}
.back-link svg{width:15px;height:15px}
.back-link:hover{color:var(--ink)}
.detail-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:42px;align-items:start}
.detail-gallery{position:sticky;top:86px}
.detail-main{position:relative;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);background:var(--art-bg);box-shadow:var(--shadow-sm);aspect-ratio:44/30}
.detail-main img{width:100%;height:100%;object-fit:cover}
.detail-thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:10px;margin-top:12px}
.thumb{border-radius:12px;overflow:hidden;border:2px solid var(--line);aspect-ratio:44/30;background:var(--art-bg);transition:border-color .15s;padding:0}
.thumb img{width:100%;height:100%;object-fit:cover}
.thumb:hover{border-color:var(--line-strong)}
.thumb.is-active{border-color:var(--gold)}
.detail-info h1{font-family:var(--font-display);font-weight:700;font-size:clamp(26px,3.4vw,36px);letter-spacing:-.015em;line-height:1.12}
.detail-price{font-family:var(--font-display);font-weight:700;font-size:30px;color:var(--gold-deep);margin-top:10px}
.detail-sub{color:var(--ink-2);margin-top:4px;margin-bottom:22px}
.spec-list{display:grid;grid-template-columns:1fr 1fr;gap:0 26px;border-top:1px solid var(--line)}
.spec{display:flex;justify-content:space-between;gap:14px;padding:11px 0;border-bottom:1px solid var(--line);font-size:14.5px}
.spec dt{color:var(--ink-2);font-weight:500}
.spec dd{font-weight:600;text-align:right;overflow-wrap:anywhere}
.detail-desc{margin-top:24px}
.detail-desc h2{font-family:var(--font-display);font-weight:600;font-size:18px;margin-bottom:8px}
.detail-desc p{color:var(--ink-2);font-size:15px}
.detail-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:26px}
.detail-trade{margin-top:18px;font-size:14.5px;color:var(--ink-2)}
.detail-trade a{color:var(--gold-deep);font-weight:600;text-decoration:underline;text-underline-offset:3px}

.sell{padding:40px 0 80px}
.sell-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.85fr);gap:36px;align-items:start}
.sell-form{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:30px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:18px}
.field{display:flex;flex-direction:column;gap:7px;min-width:0}
.field>span{font-family:var(--font-display);font-weight:500;font-size:13.5px;letter-spacing:.03em;color:var(--ink-2)}
.field input,.field select,.field textarea{font:inherit;color:var(--ink);background:var(--paper);border:1.5px solid var(--line-strong);border-radius:12px;padding:11px 14px;width:100%;transition:border-color .15s,background .15s}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--gold-deep);background:#fff}
.field textarea{resize:vertical;min-height:96px}
.field select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2366696F' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:16px;padding-right:38px}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field-row-3{grid-template-columns:1fr 1fr 1fr}
.sell-form .btn{align-self:flex-start}
.form-alert{background:#FCEEEC;border:1px solid #EFC7C3;border-radius:14px;padding:15px 18px;color:#8F3B36;font-size:14.5px}
.form-alert ul{margin:7px 0 0 18px}
.form-success{background:var(--gold-tint);border:1px solid var(--gold-soft);border-radius:14px;padding:20px 22px}
.form-success h2{font-family:var(--font-display);font-weight:700;font-size:19px;margin-bottom:6px}
.form-success p{font-size:14.5px;color:var(--ink-2)}
.form-success a{color:var(--gold-deep);font-weight:600}
.sell-side{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:28px;box-shadow:var(--shadow-sm)}
.sell-side h2{font-family:var(--font-display);font-weight:700;font-size:20px;margin-bottom:16px}
.steps{list-style:none;counter-reset:step;display:flex;flex-direction:column;gap:16px}
.steps li{counter-increment:step;position:relative;padding-left:44px;font-size:14.5px;color:var(--ink-2)}
.steps li strong{display:block;color:var(--ink);font-weight:600}
.steps li::before{content:counter(step);position:absolute;left:0;top:2px;width:30px;height:30px;border-radius:50%;background:var(--gold-soft);color:var(--ink);font-family:var(--font-display);font-weight:700;font-size:14px;display:flex;align-items:center;justify-content:center}
.sell-call{margin-top:22px;padding-top:20px;border-top:1px solid var(--line)}
.sell-call p{font-size:14px;color:var(--ink-2);margin-bottom:10px}

.site-footer{background:var(--ink);color:#C9CBCF;margin-top:auto}
.footer-in{display:grid;grid-template-columns:1.4fr 1fr 1fr .8fr;gap:34px;padding-top:52px;padding-bottom:40px}
.footer-brand p{font-size:14px;margin-top:14px;max-width:30ch}
.logo-img-footer{height:32px}
.footer-col{display:flex;flex-direction:column;gap:9px;font-size:14px}
.footer-col h3{font-family:var(--font-display);font-weight:600;font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:#8E9196;margin-bottom:4px}
.footer-col a:hover{color:#fff}
.footer-base{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;padding-top:18px;padding-bottom:26px;border-top:1px solid #33363B;font-size:13px;color:#8E9196}

.reveal{opacity:0;transform:translateY(14px);transition:opacity .5s ease,transform .5s ease}
.reveal.is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  .btn,.car-card,.carousel-btn{transition:none}
}

@media (max-width:960px){
  .hero-grid{grid-template-columns:1fr;gap:30px;padding-top:26px}
  .hero-art{min-height:260px}
  .hero-art svg{min-height:260px}
  .detail-grid{grid-template-columns:1fr}
  .detail-gallery{position:static}
  .sell-grid{grid-template-columns:1fr}
  .footer-in{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .wrap{padding-left:18px;padding-right:18px}
  .topbar-item span{font-size:12px}
  .visit-grid{grid-template-columns:1fr}
  .field-row,.field-row-3{grid-template-columns:1fr}
  .spec-list{grid-template-columns:1fr}
  .footer-in{grid-template-columns:1fr}
  .carousel{grid-auto-columns:minmax(240px,260px)}
}

/* 蜜罐字段:对真人不可见不可达,仅用于拦截机器人 */
.hp-field{position:absolute;left:-9999px;top:-9999px;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none}

/* 首页主视觉:自定义图片/视频与内置SVG同规格展示 */
.hero-art img,.hero-art video{width:100%;height:100%;min-height:340px;object-fit:cover;display:block}
@media (max-width:860px){.hero-art img,.hero-art video{min-height:260px}}