:root {
    --bg:#F4FBF4;
    --deep:#E4F3E6;
    --card:#FFFFFF;
    --soft:#D8EDDC;
    --ink:#14321C;
    --text:#2A4632;
    --muted:#5E7A64;
    --quiet:#88A090;
    --green:#1F8A4C;
    --mint:#3CB371;
    --forest:#0F3D24;
    --gold:#C9A227;
    --line:rgba(31,138,76,.22);
    --gold-line:rgba(201,162,39,.36);
    --shadow:0 16px 36px rgba(20,50,28,.10);
    --radius:14px;
    --header-h:113px;
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",Arial,sans-serif;
    color:#2A4632;
    background:#F4FBF4;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--bg); }
body { margin:0; min-width:320px; background:var(--bg); color:var(--text); overflow-x:hidden; }
body.panel-open { overflow:hidden; }
a { color:inherit; text-decoration:none; }
a,button,input { font:inherit; }
button { cursor:pointer; }
img { display:block; max-width:100%; }
.shell { width:min(1200px, calc(100% - 32px)); margin:0 auto; }
.site-header { position:fixed; inset:0 0 auto 0; z-index:90; box-shadow:0 5px 16px rgba(15,61,36,.08); }
.vine-bar { height:11px; background:var(--green); color:#F4FBF4; font-size:9px; line-height:11px; }
.vine-inner { display:flex; justify-content:space-between; align-items:center; height:11px; }
.vine-brand { letter-spacing:.08em; white-space:nowrap; }
.plain-btn { border:0; background:transparent; color:#F4FBF4; height:11px; padding:0 2px; font-size:9px; line-height:11px; }
.stage-bar { height:62px; background:#FFFDF5; border-bottom:1px solid var(--line); }
.stage-inner { height:62px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.brand-lockup { display:flex; align-items:center; min-height:44px; min-width:88px; }
.brand-logo { width:auto; max-width:180px; height:28px; object-fit:contain; object-position:left center; }
.brand-text { color:var(--forest); font-size:22px; font-weight:800; letter-spacing:.04em; }
.stage-actions { display:flex; align-items:center; gap:10px; }
.secondary-control,.primary-control,.panel-close { min-height:44px; padding:0 18px; border-radius:12px; border:1px solid var(--line); font-weight:700; display:inline-flex; align-items:center; justify-content:center; }
.secondary-control { background:#FFFDF5; color:var(--forest); }
.primary-control { background:linear-gradient(135deg,#3CB371 0%,#1F8A4C 56%,#0F3D24 100%); color:#F4FBF4; border-color:transparent; }
.fresh-tabs { height:40px; background:#D8EDDC; border-bottom:1px solid rgba(31,138,76,.14); }
.fresh-inner { height:40px; display:flex; align-items:center; justify-content:center; gap:28px; }
.fresh-link { position:relative; min-height:40px; display:flex; align-items:center; color:var(--muted); font-weight:700; font-size:14px; }
.fresh-link.is-current { color:var(--forest); }
.fresh-link.is-current::after { content:""; position:absolute; width:30px; height:3px; border-radius:2px; background:var(--green); bottom:0; left:50%; transform:translateX(-50%); }
.site-main { padding-top:calc(var(--header-h) + 22px); min-height:70vh; }
.hero-note { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:13px 16px; border:1px solid var(--line); background:#DFF4E6; border-radius:12px; color:var(--forest); margin-bottom:18px; }
.hero-note a { font-weight:800; text-decoration:underline; text-underline-offset:3px; }
.page-hero { padding:24px 0 18px; }
.page-hero .eyebrow,.section-eyebrow { color:var(--green); font-size:13px; font-weight:800; letter-spacing:.10em; text-transform:uppercase; }
h1,h2,h3 { color:var(--ink); margin-top:0; }
h1 { font-size:clamp(28px,4vw,32px); line-height:1.2; margin-bottom:14px; }
h2 { font-size:22px; line-height:1.35; }
h3 { font-size:17px; line-height:1.4; }
p,li { font-size:16px; line-height:1.85; }
.lead { max-width:820px; color:var(--muted); margin:0; }
.hero-actions,.button-row { display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }
.primary-btn,.secondary-btn,.text-btn { min-height:44px; display:inline-flex; align-items:center; justify-content:center; border-radius:12px; padding:0 18px; font-weight:800; }
.primary-btn { background:linear-gradient(135deg,#3CB371 0%,#1F8A4C 56%,#0F3D24 100%); color:#F4FBF4; }
.secondary-btn { background:#FFFDF5; color:var(--forest); border:1px solid var(--green); }
.text-btn { color:var(--forest); border-bottom:2px solid var(--gold-line); border-radius:0; padding-inline:2px; }
.primary-btn:focus-visible,.secondary-btn:focus-visible,.text-btn:focus-visible,a:focus-visible,button:focus-visible,input:focus-visible { outline:3px solid rgba(201,162,39,.55); outline-offset:3px; }
.content-section { padding:26px 0; }
.content-section.alt { background:var(--deep); border-block:1px solid rgba(31,138,76,.12); }
.content-section.soft { background:#ECF8EF; }
.section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:16px; }
.section-head p { max-width:690px; margin:0; color:var(--muted); }
.grid-2,.grid-3,.grid-4 { display:grid; gap:18px; }
.grid-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.grid-3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.grid-4 { grid-template-columns:repeat(4,minmax(0,1fr)); }
.card { background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:18px; box-shadow:0 8px 24px rgba(20,50,28,.05); }
.card.gold { border-color:var(--gold-line); }
.card p:last-child { margin-bottom:0; }
.card-number { color:var(--gold); font-weight:900; font-size:13px; letter-spacing:.08em; }
.media-card { overflow:hidden; padding:0; }
.media-slot { background:#EFF9F1; min-height:150px; display:flex; align-items:center; justify-content:center; border-bottom:1px solid var(--line); overflow:hidden; }
.media-slot.tall { min-height:220px; }
.media-slot.app-slot { min-height:320px; }
.media-img { width:100%; height:160px; object-fit:contain; object-position:center; }
.media-img.banner-img { height:auto; max-height:240px; width:100%; object-fit:contain; }
.media-img.app-img { height:auto; max-height:420px; width:100%; object-fit:contain; }
.media-copy { padding:18px; }
.banner-wrap { max-width:100%; background:#EDF8EF; border:1px solid var(--line); border-radius:16px; padding:12px; display:flex; justify-content:center; align-items:center; min-height:220px; }
.banner-copy { text-align:center; max-width:760px; margin:18px auto 0; }
.banner-copy .mini { color:var(--green); font-weight:900; margin-bottom:6px; }
.banner-copy .statement { font-size:24px; line-height:1.35; font-weight:900; color:var(--ink); margin:0 0 10px; }
.list-clean { list-style:none; padding:0; margin:0; }
.list-clean li { padding:13px 0; border-bottom:1px solid var(--line); }
.list-clean li:last-child { border-bottom:0; }
.tag-row { display:flex; flex-wrap:wrap; gap:10px; }
.topic-tag { min-height:44px; display:inline-flex; align-items:center; padding:0 14px; border-radius:12px; border:1px solid var(--line); background:#FFF; color:var(--forest); font-weight:800; }
.timeline { display:grid; gap:14px; }
.timeline-item { display:grid; grid-template-columns:120px 1fr; gap:14px; align-items:start; }
.timeline-item .status { background:var(--soft); color:var(--forest); border-radius:12px; padding:10px 12px; font-weight:900; text-align:center; }
.notice { border-left:4px solid var(--gold); background:#FFFDF5; border-radius:0 12px 12px 0; padding:14px 16px; }
.app-layout { display:grid; grid-template-columns:minmax(260px,.75fr) minmax(0,1.25fr); gap:28px; align-items:center; }
.policy-list { display:grid; gap:14px; }
.policy-item { background:#FFF; border:1px solid var(--line); border-radius:14px; padding:18px; }
.policy-item h2 { font-size:19px; }
.faq-list details { background:#FFF; border:1px solid var(--line); border-radius:14px; padding:16px 18px; margin-bottom:12px; }
.faq-list summary { cursor:pointer; color:var(--ink); font-weight:900; font-size:17px; }
.faq-list details p { margin-bottom:0; color:var(--text); }
.contact-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.site-footer { background:var(--forest); color:#E4F3E6; margin-top:36px; padding:36px 0 22px; }
.footer-grid { display:grid; grid-template-columns:1.6fr repeat(4,1fr); gap:26px; }
.footer-lockup { display:flex; align-items:center; gap:10px; color:#F4FBF4; }
.footer-lockup span { display:flex; flex-direction:column; }
.footer-lockup small { color:#A9DDB8; font-size:11px; letter-spacing:.08em; }
.footer-logo { height:28px; width:auto; max-width:160px; object-fit:contain; }
.footer-brand p { color:#CBE5D2; font-size:14px; line-height:1.75; }
.footer-group h2 { color:#F4FBF4; font-size:15px; margin-bottom:12px; }
.footer-group a { display:block; min-height:32px; color:#D6ECD9; font-size:14px; }
.footer-bottom { margin-top:26px; padding-top:18px; border-top:1px solid rgba(228,243,230,.18); display:flex; justify-content:space-between; gap:18px; align-items:center; }
.footer-bottom p { font-size:13px; margin:0; color:#BBD9C2; }
.footer-mini-links { display:flex; flex-wrap:wrap; gap:14px; }
.footer-mini-links a { font-size:13px; color:#D6ECD9; }
.overlay { position:fixed; inset:0; z-index:95; background:rgba(15,61,36,.38); opacity:0; pointer-events:none; transition:opacity .18s ease; }
.overlay.is-open { opacity:1; pointer-events:auto; }
.basket-panel,.search-layer { position:fixed; z-index:100; top:73px; background:#FFFDF5; border:1px solid var(--line); box-shadow:var(--shadow); visibility:hidden; pointer-events:none; opacity:0; transform:translateY(-10px); transition:opacity .18s ease, transform .18s ease, visibility .18s; }
.basket-panel.is-open,.search-layer.is-open { visibility:visible; pointer-events:auto; opacity:1; transform:translateY(0); }
.basket-panel { left:max(16px, calc((100vw - 1200px)/2 + 16px)); width:min(500px, calc(100vw - 32px)); max-height:calc(100vh - 90px); overflow:auto; border-radius:14px; border-top:3px solid var(--green); }
.basket-head,.search-head { display:flex; justify-content:space-between; align-items:center; gap:14px; padding:14px 16px; border-bottom:1px solid var(--line); }
.basket-brand { display:flex; align-items:center; gap:9px; color:var(--forest); }
.basket-logo { height:24px; width:auto; max-width:130px; object-fit:contain; }
.panel-close { min-height:40px; padding:0 13px; background:#FFF; color:var(--forest); }
.basket-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0; }
.basket-grid section { padding:16px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.basket-grid section:nth-child(2n) { border-right:0; }
.basket-grid h2 { font-size:14px; color:var(--green); margin-bottom:9px; }
.basket-grid a { display:block; padding:9px 0; min-height:44px; }
.basket-grid a strong { display:block; color:var(--ink); font-size:15px; }
.basket-grid a span { display:block; color:var(--muted); font-size:12px; margin-top:3px; }
.search-layer { right:max(16px, calc((100vw - 1200px)/2 + 16px)); width:min(460px, calc(100vw - 32px)); border-radius:14px; border-top:3px solid var(--gold); padding-bottom:16px; }
.search-label { display:block; padding:16px 16px 8px; color:var(--muted); font-size:14px; }
.search-input { width:calc(100% - 32px); margin:0 16px 14px; min-height:46px; border:1px solid var(--line); border-radius:12px; padding:0 14px; background:#FFF; color:var(--ink); }
.search-presets { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; padding:0 16px; }
.search-presets a { min-height:44px; display:flex; align-items:center; justify-content:center; text-align:center; border:1px solid var(--line); border-radius:12px; background:#EDF8EF; color:var(--forest); font-weight:800; }
.mobile-bottom { display:none; }
@media (hover:hover) {
    .card:hover { box-shadow:var(--shadow); transform:translateY(-1px); }
    .fresh-link:hover,.footer-group a:hover,.footer-mini-links a:hover { text-decoration:underline; text-underline-offset:3px; }
    .secondary-control:hover,.secondary-btn:hover,.panel-close:hover { background:#EAF6ED; }
}
@media (max-width:900px) {
    .grid-4 { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .grid-3 { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .footer-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .footer-brand { grid-column:1/-1; }
    .app-layout { grid-template-columns:1fr; }
}
@media (max-width:680px) {
    :root { --header-h:73px; }
    body { padding-bottom:calc(62px + env(safe-area-inset-bottom)); }
    .shell { width:calc(100% - 32px); }
    .fresh-tabs { display:none; }
    .site-main { padding-top:calc(var(--header-h) + 16px); }
    .stage-actions { gap:6px; }
    .secondary-control,.primary-control { padding:0 12px; min-height:44px; font-size:14px; }
    .brand-logo { height:26px; max-width:140px; }
    .brand-text { font-size:20px; }
    .grid-2,.grid-3,.grid-4,.contact-grid { grid-template-columns:1fr; }
    .section-head { align-items:flex-start; flex-direction:column; gap:8px; }
    .media-img { height:150px; }
    .banner-wrap { min-height:180px; }
    .banner-copy .statement { font-size:21px; }
    .timeline-item { grid-template-columns:1fr; }
    .basket-panel,.search-layer { top:73px; left:16px; right:16px; width:auto; max-height:60vh; }
    .basket-grid { grid-template-columns:1fr; }
    .basket-grid section { border-right:0; }
    .mobile-bottom { position:fixed; display:grid; grid-template-columns:repeat(5,1fr); inset:auto 0 0 0; z-index:80; min-height:50px; padding-bottom:env(safe-area-inset-bottom); background:#FFFDF5; border-top:1px solid var(--line); box-shadow:0 -6px 18px rgba(15,61,36,.08); }
    .mobile-bottom a { min-height:50px; display:flex; justify-content:center; align-items:center; color:var(--muted); font-weight:800; font-size:13px; }
    .mobile-bottom a.is-current { background:var(--green); color:#F4FBF4; }
    .site-footer { margin-bottom:0; }
    .footer-grid { grid-template-columns:1fr 1fr; gap:18px; }
    .footer-bottom { flex-direction:column; align-items:flex-start; }
    .hero-note { align-items:flex-start; flex-direction:column; }
}
@media (max-width:420px) {
    .stage-inner { gap:8px; }
    .brand-lockup { min-width:76px; }
    .brand-logo { max-width:120px; height:24px; }
    .stage-actions { flex-shrink:0; }
    .secondary-control,.primary-control { padding:0 10px; }
    .footer-grid { grid-template-columns:1fr; }
    .search-presets { grid-template-columns:1fr; }
}
