/* DMV pages (hub, Barfly, save flow). Builds on styles.css tokens + buttons. */
body.dmv{background:#fff}
.dmv .site-header .wrap{height:64px}
.dmv .site-header .brand .brand-logo{height:30px}
.dmv .hdr-link{font-family:var(--display);font-weight:600;font-size:.86rem;color:var(--ink-soft);text-decoration:none}
.dmv .hdr-link:hover{color:var(--ink)}
.dmv section{padding:56px 0}
.dmv-hero{background:linear-gradient(180deg,#fff 0%,#fff7d6 100%);padding:56px 0 48px !important}
.dmv-hero h1{font-size:clamp(2.1rem,4.6vw,3.4rem);margin:12px 0 0}
.dmv-hero h1 .hl{background:linear-gradient(180deg,transparent 62%,var(--yellow) 62%);padding:0 .1em}
.dmv-hero .sub{font-size:1.1rem;color:var(--ink-soft);margin-top:16px;max-width:34em}
.dmv-hero .cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.hero-2{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center}
.hero-2 img{width:100%;height:420px;object-fit:cover;border-radius:22px;box-shadow:var(--shadow)}

.shop-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px}
.shop-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px;display:flex;flex-direction:column;gap:6px;box-shadow:var(--shadow-sm)}
.shop-card h3{font-size:1.2rem}
.shop-card .city{font-family:var(--display);font-weight:600;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.shop-card .addr{color:var(--ink-soft);font-size:.95rem}
.shop-card .addr a{text-decoration:none}
.shop-card .addr a:hover{text-decoration:underline}
.shop-card .actions{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.shop-card .actions .btn{width:100%;padding:12px 18px;font-size:.94rem}

.plan{background:var(--ink);color:#fff;border-radius:22px;padding:28px;box-shadow:var(--shadow)}
.plan .eyebrow{color:var(--yellow)}
.plan h2{font-size:1.7rem;margin-top:8px}
.plan .price{font-family:var(--display);font-weight:700;font-size:3rem;line-height:1;margin-top:16px}
.plan .price small{font-size:1rem;font-weight:500;color:#cfc9c0}
.plan ul{list-style:none;padding:0;margin:18px 0 22px}
.plan li{padding:7px 0 7px 28px;position:relative;border-top:1px solid #3a3334;font-size:.98rem}
.plan li::before{content:"";position:absolute;left:4px;top:15px;width:10px;height:10px;border-radius:50%;background:var(--yellow)}
.plan .note{color:#cfc9c0;font-size:.86rem;margin-top:12px}
.plan .btn{width:100%}

.benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.benefit{border:1px solid var(--line);border-radius:var(--radius);padding:24px;background:#fff}
.benefit .ico{width:44px;height:44px;border-radius:12px;background:var(--yellow);display:grid;place-items:center;font-size:1.25rem;margin-bottom:14px}
.benefit h3{font-size:1.12rem;margin-bottom:6px}
.benefit p{color:var(--ink-soft);font-size:.96rem}
.perks{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,1fr);gap:10px 24px}
.perks li{padding-left:28px;position:relative;font-size:1rem}
.perks li::before{content:"\2713";position:absolute;left:0;top:0;font-weight:700;background:var(--yellow);border-radius:50%;width:20px;height:20px;display:grid;place-items:center;font-size:.72rem}
.howto{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;counter-reset:s}
.howto div{counter-increment:s;padding:20px;border-radius:var(--radius);background:#fcfaf3;border:1px solid var(--line)}
.howto div::before{content:counter(s);display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--ink);color:#fff;font-family:var(--display);font-weight:700;margin-bottom:10px}
.howto h3{font-size:1.05rem;margin-bottom:4px}
.howto p{color:var(--ink-soft);font-size:.94rem}

.join{max-width:620px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow);overflow:hidden}
.join-head{background:var(--yellow);padding:20px 26px}
.join-head h2{font-size:1.5rem}
.join-head p{font-size:.92rem;margin-top:4px}
.join-body{padding:26px}
.join select,.save select{width:100%;padding:13px 15px;border:1.5px solid var(--line);border-radius:12px;font-family:var(--body);font-size:1rem;background:#fcfaf3;color:var(--ink);appearance:auto}
.join .sub-h{font-family:var(--display);font-weight:700;font-size:1.02rem;margin:22px 0 12px;padding-top:18px;border-top:1px solid var(--line)}
.consent{display:flex;gap:12px;align-items:flex-start;font-size:.9rem;color:var(--ink-soft);background:#fcfaf3;border:1px solid var(--line);border-radius:12px;padding:14px;margin:6px 0 18px;cursor:pointer}
.consent input{margin-top:3px;width:18px;height:18px;accent-color:var(--ink);flex:0 0 auto}
.join .btn-submit{width:100%}
.form-err{display:none}
.form-err.on{display:block}
.mini{font-size:.82rem;color:var(--muted)}
.faq-mini details{border-bottom:1px solid var(--line);padding:14px 0}
.faq-mini summary{font-family:var(--display);font-weight:600;cursor:pointer;list-style:none}
.faq-mini summary::-webkit-details-marker{display:none}
.faq-mini p{color:var(--ink-soft);margin-top:8px}

.dmv-foot{background:var(--ink);color:#cfc9c0;padding:36px 0;font-size:.9rem}
.dmv-foot .wrap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:center}
.dmv-foot img{height:34px;width:auto}
.dmv-foot a{color:#cfc9c0}

/* ---- save flow (mobile first, card in the middle) ---- */
.save-wrap{max-width:460px;margin:0 auto;padding:22px 16px 48px}
.save{background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);overflow:hidden}
.save-top{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line)}
.save-top img{height:22px;width:auto}
.save-top .shop{font-family:var(--display);font-weight:600;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.save-top .back{margin-left:auto;background:none;border:0;color:var(--muted);font-size:.86rem;cursor:pointer;visibility:hidden;padding:6px}
.screen{display:none;flex-direction:column;gap:14px;padding:22px 20px 26px}
.screen.on{display:flex}
.screen h2{font-size:1.4rem}
.screen .sub{color:var(--ink-soft);font-size:.96rem}
.screen .tag{font-family:var(--display);font-weight:600;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.sbox{border:1px solid var(--line);border-radius:14px;padding:14px 16px;background:#fff}
.sbox.y{background:#fff6c4;border-color:#f3e08a}
.srow{display:flex;justify-content:space-between;gap:12px;font-size:.92rem;padding:4px 0}
.srow span:first-child{color:var(--muted)}
.save .btn{width:100%;white-space:normal}
.opt{display:flex;gap:10px;align-items:center;border:1.5px solid var(--line);border-radius:12px;padding:13px 14px;cursor:pointer;font-size:.96rem}
.opt input{accent-color:var(--ink);width:18px;height:18px;flex:0 0 auto}
.opt.sel{border-color:var(--ink);background:#fff6c4}
.save textarea,.save input[type=text]{width:100%;border:1.5px solid var(--line);border-radius:12px;padding:11px 12px;font:inherit;font-size:.96rem;background:#fcfaf3}
.save textarea{min-height:76px;resize:vertical}
.chips{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.chips button{border:1.5px solid var(--line);background:#fff;border-radius:12px;padding:12px 6px;font:600 .92rem var(--display);cursor:pointer;color:var(--ink)}
.chips button.sel{border-color:var(--ink);background:#fff6c4}
.linkbtn{background:none;border:0;color:var(--muted);font-size:.88rem;text-decoration:underline;cursor:pointer;padding:8px;align-self:center}
.check-dot{width:56px;height:56px;border-radius:50%;background:var(--yellow);display:grid;place-items:center;font-size:1.6rem;font-weight:700}
.msg-page{max-width:520px;margin:0 auto;padding:64px 20px;text-align:center}
.msg-page h1{font-size:1.9rem;margin:18px 0 10px}
.msg-page p{color:var(--ink-soft);margin-bottom:10px}
.msg-page .check-dot{margin:0 auto}

@media(max-width:900px){
  .hero-2{grid-template-columns:1fr;gap:26px}
  .hero-2 img{height:260px;order:-1}
  .benefits,.howto{grid-template-columns:1fr}
}
@media(max-width:560px){
  .dmv section{padding:40px 0}
  .dmv-hero{padding:34px 0 36px !important}
  .perks{grid-template-columns:1fr}
  .join-body{padding:20px 16px}
  .join-head{padding:18px 16px}
  .dmv .site-header .brand .loc{display:none}
  .dmv .wrap{padding:0 16px}
  body.dmv{padding-bottom:0}
}

/* save flow: "before you go" perks + member pricing */
.sbox ul.perks { margin: 8px 0 0; padding-left: 18px; }
.sbox ul.perks li { margin: 4px 0; font-size: 15px; line-height: 1.4; }
.sbox .ptable { margin-top: 12px; border-top: 1px solid rgba(0,0,0,.08); padding-top: 6px; }
.sbox .ptable .srow:first-child span { font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: #8a8378; }

/* Barfly join: two plan cards, member pricing, plan picker, agreement */
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin-top:28px;max-width:860px}
.plans .plan{position:relative}
.plans .plan-pop{border:2px solid #231f20}
.plans .pop{position:absolute;top:-12px;left:20px;background:#ffdd30;color:#231f20;font:600 .75rem Poppins,sans-serif;letter-spacing:.06em;text-transform:uppercase;padding:4px 10px;border-radius:999px}
.member-pricing{margin-top:40px;max-width:640px}
.member-pricing h3{font-size:1.2rem;margin-bottom:12px}
.member-pricing table{width:100%;border-collapse:collapse;font-size:.95rem;background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden}
.member-pricing th,.member-pricing td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--line)}
.member-pricing th{font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);background:#fffdf3}
.member-pricing td.was{color:var(--muted);text-decoration:line-through}
.member-pricing tr:last-child td{border-bottom:0}
.plan-opts{display:flex;flex-direction:column;gap:8px}
.plan-opt{display:flex;gap:10px;align-items:flex-start;border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;cursor:pointer;font-size:.95rem}
.plan-opt input{width:auto;margin-top:3px}
.plan-opt:has(input:checked){border-color:#231f20;background:#fff6c4}
.terms-key{background:#fff6c4;border:1px solid #f3e08a;border-radius:12px;padding:12px 14px;font-size:.9rem;margin-bottom:10px}
.terms-box{max-height:220px;overflow-y:auto;border:1px solid var(--line);border-radius:12px;padding:12px 14px;font-size:.8rem;line-height:1.5;color:#4a4540;background:#fff;margin-bottom:12px}
.terms-box p{margin:0 0 10px}
input.sig{font-family:"Brush Script MT","Segoe Script",cursive;font-size:1.3rem}
@media (max-width:520px){.member-pricing th,.member-pricing td{padding:8px 6px;font-size:.85rem}}

/* cancel / win-back entry form (/barfly/leaving) */
.leave-form input,.leave-form select{width:100%;font:inherit;font-size:1rem;padding:12px 14px;border:1.5px solid var(--line);border-radius:12px;background:#fffdf3;color:var(--ink);appearance:none}
.leave-form select{background-image:linear-gradient(45deg,transparent 50%,#231f20 50%),linear-gradient(135deg,#231f20 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;background-size:6px 6px;background-repeat:no-repeat}
.leave-form input:focus,.leave-form select:focus{outline:none;border-color:#231f20}
.leave-form label.mini{margin-bottom:-4px}