/* Calabi site styles. Light and dark themes via [data-theme]. */
@font-face{font-family:"Figtree";src:url(fonts/figtree.woff2) format("woff2");font-weight:300 900;font-display:swap}
@font-face{font-family:"Roboto";src:url(fonts/roboto.woff2) format("woff2");font-weight:100 900;font-display:swap}
:root,[data-theme="light"]{
  --bg:#FFFFFF;--surface:#F0F4F9;--surface-2:#FFFFFF;--on:#1F1F1F;--onv:#5E5E5E;--line:#E3E3E3;--outline:#C4C7C5;
  --pri:#1A73E8;--pri-hover:#1765CC;--onp:#FFFFFF;--pc:#D3E3FD;--opc:#041E49;--icon-bg:var(--bg);
  --shadow:0 1px 2px rgba(60,64,67,.15),0 2px 6px 2px rgba(60,64,67,.08);color-scheme:light}
[data-theme="dark"]{
  --bg:#131314;--surface:#1F1F1F;--surface-2:#282A2C;--on:#E3E3E3;--onv:#C4C7C5;--line:#333537;--outline:#444746;
  --pri:#A8C7FA;--pri-hover:#BCD4FB;--onp:#062E6F;--pc:#0842A0;--opc:#D3E3FD;--icon-bg:var(--surface);
  --shadow:0 1px 3px rgba(0,0,0,.5);color-scheme:dark}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--on);font:400 16px/1.6 "Roboto",system-ui,sans-serif;-webkit-font-smoothing:antialiased;transition:background .2s,color .2s}
h1,h2,h3,.h3{font-family:"Google Sans","Figtree","Roboto",sans-serif;font-weight:400;letter-spacing:-.015em;margin:0}
a{color:var(--pri)}img{max-width:100%;height:auto;display:block}
.accent{color:var(--pri)}
.ic{flex:none;display:block}

.skip,.sr{position:absolute;left:-9999px}.skip:focus{left:16px;top:16px;background:var(--bg);padding:8px 12px;z-index:50}
.wrap{max-width:1200px;margin:0 auto;padding:0 32px}
/* buttons */

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 22px;border-radius:999px;font:500 15px "Roboto",sans-serif;text-decoration:none;border:0;cursor:pointer;white-space:nowrap;transition:background .15s,box-shadow .15s}
.btn-filled{background:var(--pri);color:var(--onp)}.btn-filled:hover{background:var(--pri-hover);box-shadow:var(--shadow)}
.btn-text{background:transparent;color:var(--pri)}.btn-text:hover{background:var(--surface)}
.btn-outline{background:transparent;color:var(--pri);border:1px solid var(--outline)}.btn-outline:hover{background:var(--surface)}
.btn-lg{height:52px;padding:0 28px;font-size:16px}.btn-block{width:100%;height:52px;font-size:16px}
.btn-social{width:100%;height:48px;background:transparent;border:1px solid var(--outline);color:var(--on);margin-top:10px;cursor:pointer}
.chip{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 16px 0 12px;border-radius:999px;border:1px solid var(--outline);color:var(--onv);text-decoration:none;font:500 14px "Roboto",sans-serif;background:var(--bg)}
.chip:hover{background:var(--surface)}
:focus-visible{outline:2px solid var(--pri);outline-offset:2px}
/* nav */

.nav{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--bg) 90%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav-in{display:flex;align-items:center;height:68px;gap:32px}
.logo{display:flex;align-items:center;gap:10px;color:var(--pri);text-decoration:none}.logo span{font:500 22px "Google Sans","Figtree",sans-serif;color:var(--on);letter-spacing:-.01em}
.nav-links{display:flex;gap:6px}.nav-links a{color:var(--onv);text-decoration:none;font-weight:500;font-size:15px;padding:8px 14px;border-radius:999px}.nav-links a:hover,.nav-links a[aria-current]{background:var(--surface);color:var(--on)}
.nav-actions{margin-left:auto;display:flex;align-items:center;gap:6px}
/* account menu (signed-in header) */

.acct{position:relative}
.acct-btn{width:44px;height:44px;border-radius:50%;border:0;background:transparent;color:var(--onv);display:grid;place-items:center;cursor:pointer}
.acct-btn:hover{background:var(--surface)}
.acct-menu{position:absolute;right:0;top:calc(100% + 8px);min-width:220px;background:var(--bg);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:6px;z-index:60}
.acct-menu a,.acct-menu button{display:flex;width:100%;align-items:center;padding:10px 12px;border-radius:9px;font:400 15px "Roboto",sans-serif;color:var(--on);text-decoration:none;background:none;border:0;cursor:pointer;text-align:left}
.acct-menu a:hover,.acct-menu button:hover{background:var(--surface)}
.acct-menu hr{border:0;border-top:1px solid var(--line);margin:6px 4px}
/* hero */

.hero{padding:72px 0 88px}
.hero-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:56px;align-items:center}
.eyebrow{font:500 14px "Roboto",sans-serif;color:var(--onv);margin:0 0 14px;letter-spacing:.01em}
h1{font-size:clamp(44px,6.4vw,84px);line-height:1.03}
.lede{font-size:19px;color:var(--onv);margin:22px 0 0;max-width:34em}

.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
/* sections */

.section{padding-top:88px;padding-bottom:88px}
.section h2{font-size:clamp(32px,4vw,48px);line-height:1.1;max-width:18em}
.card{background:var(--surface);border-radius:28px}

.auth-ic{width:56px;height:56px;border-radius:50%;background:var(--pc);color:var(--opc);display:grid;place-items:center;--icon-bg:var(--pc)}

.facts{list-style:none;padding:0;margin:28px 0 0;display:flex;flex-direction:column;gap:18px}
.facts li{display:flex;gap:16px;align-items:flex-start;color:var(--pri)}.facts strong{display:block;color:var(--on);font-weight:500}.facts span{color:var(--onv);font-size:15px}

.link{display:inline-flex;align-items:center;gap:6px;margin-top:22px;font-weight:500;text-decoration:none}.link:hover{text-decoration:underline}

.faq-wrap{display:grid;grid-template-columns:1fr 1.6fr;gap:56px}
.faq details{border-bottom:1px solid var(--line)}.faq details:first-child{border-top:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:22px 40px 22px 0;font:500 18px "Google Sans","Figtree",sans-serif;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"";position:absolute;right:8px;top:50%;width:10px;height:10px;border-right:2px solid var(--onv);border-bottom:2px solid var(--onv);transform:translateY(-70%) rotate(45deg);transition:transform .2s}
.faq details[open] summary:after{transform:translateY(-30%) rotate(-135deg)}
.faq p{color:var(--onv);margin:0 0 22px}
.cta{padding:56px;display:flex;justify-content:space-between;align-items:center;gap:32px}.cta h2{max-width:14em}
.cta-actions{display:flex;gap:10px;flex-wrap:wrap}
/* footer */

.footer{border-top:1px solid #D8D8D8;padding:56px 0 32px;margin-top:40px}
.foot-grid{display:grid;grid-template-columns:1.6fr repeat(4,1fr);gap:32px}
.foot-brand p{color:var(--onv);font-size:15px;max-width:26em;margin:14px 0 0}
.foot-grid h3 a{color:inherit;text-decoration:none}.foot-grid h3 a:hover{text-decoration:underline}
.foot-grid h3{font:500 15px "Roboto";margin:6px 0 14px;color:var(--on)}
.foot-grid div>a:not(.logo):not(.store){display:block;color:var(--onv);text-decoration:none;font-size:15px;padding:5px 0}.foot-grid div>a:hover{color:var(--on)}
.foot-bottom{display:flex;justify-content:space-between;gap:16px;border-top:1px solid var(--line);margin-top:12px;padding-top:16px;padding-bottom:16px;color:var(--onv);font-size:14px;flex-wrap:wrap;position:sticky;bottom:0;background:var(--bg,#fff);z-index:10}
/* forms / auth */

.auth-body .footer{margin-top:0}
.auth{min-height:calc(100vh - 68px);display:grid;place-items:center;padding:56px 20px;background:var(--bg)}
.auth-card{width:100%;max-width:440px;padding:40px;background:var(--bg);border:1px solid var(--line);text-align:center}
.auth-card .auth-ic{margin:0 auto}
.auth-card h1{font-size:32px;margin-top:20px}.muted{color:var(--onv);margin:6px 0 24px}
.form{display:flex;flex-direction:column;gap:16px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font:500 14px "Roboto";color:var(--on)}.field small{color:var(--onv);font-size:12px}
.field input,.field select{height:52px;border-radius:12px;border:1px solid var(--outline);background:var(--bg);color:var(--on);font:400 16px "Roboto";padding:0 14px;outline:none;width:100%}
.field input:focus,.field select:focus{border-color:var(--pri);box-shadow:0 0 0 1px var(--pri)}

.fine{color:var(--onv);font-size:12.5px;line-height:1.5;margin:14px 0 0}
.auth-switch{text-align:center;margin:24px 0 0;font-size:15px;color:var(--onv)}
.partner-hero h1{font-size:clamp(40px,5vw,64px)}
.form-card{padding:32px;background:var(--bg);border:1px solid var(--line);box-shadow:var(--shadow)}.form-card .h3{font-size:26px;margin-bottom:18px}
/* responsive */

@media (max-width:1024px){
 .hero-grid,.faq-wrap{grid-template-columns:1fr}

 .foot-grid{grid-template-columns:1fr 1fr 1fr}.foot-brand{grid-column:1/-1}}
@media (max-width:760px){
 .wrap{padding:0 20px}
 .nav-links{display:none}.nav-in{gap:8px}.nav-actions>.btn{display:none!important}.menu-btn{display:grid}
 .hero{padding:40px 0 56px}.lede{font-size:17px}

 .section{padding-top:56px;padding-bottom:56px}

 .cta{flex-direction:column;align-items:flex-start;padding:32px}
 .foot-grid{grid-template-columns:1fr 1fr}
 .auth-card{padding:28px 22px}.row2{grid-template-columns:1fr}}
/* ---- mobile menu ---- */

.menu-btn{display:none;width:44px;height:44px;border-radius:50%;border:0;background:transparent;color:var(--on);place-items:center;cursor:pointer}
.menu-btn:hover{background:var(--surface)}
.menu-btn .m1,.menu-btn .m2,.menu-btn .m3{transition:transform .2s,opacity .2s;transform-origin:12px 12px}
.menu-btn[aria-expanded="true"] .m1{transform:translateY(5px) rotate(45deg)}.menu-btn[aria-expanded="true"] .m2{opacity:0}.menu-btn[aria-expanded="true"] .m3{transform:translateY(-5px) rotate(-45deg)}
.mobile-menu{border-top:1px solid var(--line);background:var(--bg);padding:8px 0 20px}
.mobile-menu[hidden]{display:none}
.mobile-menu .wrap>a{display:block;padding:14px 4px;border-bottom:1px solid var(--line);color:var(--on);text-decoration:none;font:500 18px "Google Sans","Figtree",sans-serif}
.mobile-menu .wrap>a[aria-current]{color:var(--pri)}

[hidden]{display:none!important}
@media (min-width:761px){.mobile-menu{display:none!important}}
/* ---- page building blocks ---- */

.page-hero{padding:72px 0 16px}.page-hero h1{font-size:clamp(40px,5.2vw,64px);line-height:1.08}.page-hero .lede a{color:var(--pri)}
.h1-sm{font-size:clamp(36px,4.4vw,52px);line-height:1.1}

.pad{padding:28px}
.timeline{list-style:none;margin:0;padding:0;display:grid;gap:14px;max-width:820px}
.timeline li{display:flex;gap:20px;align-items:flex-start;background:var(--surface);border-radius:28px;padding:24px}
.timeline h3{font-size:22px;margin:4px 0 6px}.timeline p{margin:0;color:var(--onv)}
.split-cards{display:grid;grid-template-columns:1fr 1fr;gap:16px}.split-cards h3{font-size:24px;margin-bottom:14px}.split-cards .btn{margin-top:18px}

.faq-page{max-width:860px}.faq-page .h3{font-size:24px;margin:40px 0 8px}.faq-page .h3:first-child{margin-top:0}
.prose{max-width:760px}.prose .h3{font-size:24px;margin:32px 0 8px}.prose p{color:var(--onv);font-size:17px}

.two-col{display:grid;grid-template-columns:1fr 1.1fr;gap:56px;align-items:start}
.field textarea{border-radius:12px;border:1px solid var(--outline);background:var(--bg);color:var(--on);font:400 16px "Roboto";padding:12px 14px;outline:none;width:100%;resize:vertical}
.field textarea:focus{border-color:var(--pri);box-shadow:0 0 0 1px var(--pri)}
.opt{color:var(--onv);font-weight:400}
.err{color:#D93025;font-size:13px;min-height:0}.err:empty{display:none}[data-theme="dark"] .err{color:#F28B82}
.has-err input,.has-err textarea,.has-err select{border-color:#D93025}[data-theme="dark"] .has-err input,[data-theme="dark"] .has-err textarea{border-color:#F28B82}

.form-status{border-radius:12px;padding:12px 14px;font-size:14px}.form-status.ok{background:var(--pc);color:var(--opc)}.form-status.bad{background:#FCE8E6;color:#A50E0E}[data-theme="dark"] .form-status.bad{background:#5C1D18;color:#F6AEA9}

.oauth-msg{font-size:13px;color:var(--onv);text-align:center;margin:10px 0 0}
.btn.is-busy{opacity:.7;pointer-events:none}

@media (max-width:1024px){.two-col{grid-template-columns:1fr;gap:32px}}
@media (max-width:760px){
 .page-hero{padding:40px 0 0}
 .split-cards{grid-template-columns:1fr}
 .timeline li{padding:18px;gap:14px}

 .foot-bottom{flex-direction:column}}
@media (max-width:760px){.menu-btn{display:grid}}
/* ---------- store search ---------- */

.search-big{margin-top:32px;display:flex;align-items:center;gap:12px;background:var(--surface);border-radius:999px;padding:8px 8px 8px 24px;max-width:820px;color:var(--onv);border:1px solid transparent}
.search-big input{flex:1;min-width:0;border:0;background:transparent;font:400 19px "Roboto",sans-serif;color:var(--on);outline:none;height:56px}
.search-big input::placeholder{color:var(--onv)}.search-big input::-webkit-search-cancel-button{cursor:pointer}
.search-big .btn{height:56px;padding:0 28px}.search-big:focus-within{box-shadow:0 0 0 2px var(--pri)}
.search-echo{margin:14px 0 0 24px;color:var(--onv)}.search-echo strong{color:var(--on)}

.no-match{margin:8px 0 0;color:var(--onv)}

@media (max-width:760px){

 .search-big{padding:6px 6px 6px 16px;gap:8px}.search-big input{font-size:16px;height:48px}.search-big .btn{height:48px;padding:0 18px}

}
@media (max-width:380px){.search-big .btn{padding:0 14px}}
/* ---------- store, cart and order pages ---------- */

.dim{color:var(--onv)}.small{font-size:14px}.mt{margin-top:28px}

.store-head{display:flex;gap:18px;align-items:center;flex-wrap:wrap}.store-head .eyebrow{margin:0}.store-head .dim{margin:4px 0 0}

.chip[aria-pressed="true"]{background:var(--pc);color:var(--opc);border-color:var(--pc)}button.chip{cursor:pointer}

.btn-tonal{background:var(--pc);color:var(--opc)}.btn-tonal:hover{filter:brightness(.97)}.btn.sm{height:34px;padding:0 14px;font-size:13px}
.stepper{display:inline-flex;align-items:center;border-radius:999px;background:var(--pc);color:var(--opc);height:38px}
.stepper button{width:38px;height:38px;border:0;background:transparent;color:inherit;font-size:20px;cursor:pointer;border-radius:50%}.stepper button:hover{background:rgba(0,0,0,.06)}
.stepper span{min-width:22px;text-align:center;font-weight:500}
.toast{position:fixed;left:50%;bottom:96px;transform:translateX(-50%);background:var(--on);color:var(--bg);padding:10px 18px;border-radius:12px;font-size:14px;z-index:40;box-shadow:var(--shadow);max-width:90vw}
.cart-bar{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);display:flex;align-items:center;gap:12px;background:var(--pri);color:var(--onp);text-decoration:none;padding:0 22px;height:56px;border-radius:999px;font-weight:500;box-shadow:0 6px 20px rgba(0,0,0,.25);z-index:30;white-space:nowrap}
.cart-btn{position:relative;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;color:var(--onv)}.cart-btn:hover{background:var(--surface)}
/* ---- store page: sticky search + department chips, paged product grid ---- */

.store-sticky{position:sticky;top:0;z-index:15;background:var(--bg);padding:8px 0 4px;margin:0 -4px;padding-left:4px;padding-right:4px}
.store-sticky .search-big{margin-top:0}
.store-cats{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-top:8px;padding-bottom:6px}
.store-cats::-webkit-scrollbar{display:none}
.load-more-row{display:flex;justify-content:center;margin:20px 0 96px;overflow-anchor:none}

.cart-count{position:absolute;top:4px;right:2px;min-width:18px;height:18px;border-radius:9px;background:var(--pri);color:var(--onp);font:700 11px/18px "Roboto";text-align:center;padding:0 4px}
.flow-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:20px;align-items:start;padding-bottom:88px}
.form-stack{display:flex;flex-direction:column;gap:16px}.form-stack .h3{font-size:24px}
.summary .h3{font-size:24px;margin-bottom:12px}
.sum{margin:12px 0 18px;display:flex;flex-direction:column;gap:10px}.sum div{display:flex;justify-content:space-between;gap:16px}.sum dt{color:var(--onv)}.sum dd{margin:0;text-align:right;font-weight:500}
.sum .total{border-top:1px solid var(--line);padding-top:12px}.sum .total dt,.sum .total dd{color:var(--on);font-size:18px}
.sum.wide div{padding:10px 0;border-bottom:1px solid var(--line)}.sum.wide div:last-child{border:0}
.btn.keep{margin-top:10px}.btn.disabled{opacity:.45;pointer-events:none}
.empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;padding:32px 12px;color:var(--onv)}.empty p{margin:0}.empty .ic{color:var(--pri)}
.line{display:grid;grid-template-columns:1fr auto 80px 36px;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.line strong{display:block}.line small{color:var(--onv)}.line-total{text-align:right;font-weight:500}
.line.sm{display:flex;justify-content:space-between;padding:8px 0}
.icon-btn{width:36px;height:36px;border-radius:50%;border:0;background:transparent;color:var(--onv);font-size:22px;cursor:pointer}.icon-btn:hover{background:var(--bg)}
.pay-box{border:1px dashed var(--outline);border-radius:16px;padding:18px;display:flex;flex-direction:column;gap:12px;background:var(--bg)}
.pay-box input:disabled{opacity:.6;cursor:not-allowed}.h3.mt{margin-top:12px}
.confirm{padding:56px 32px 88px;display:grid;place-items:center}.confirm-card{max-width:640px;width:100%;text-align:center}
.big-ic{width:80px;height:80px;border-radius:50%;background:var(--pc);color:var(--opc);display:inline-grid;place-items:center;margin-bottom:18px}
.kv{display:flex;flex-wrap:wrap;gap:12px 32px;justify-content:center;margin:24px 0 8px}.kv div{display:flex;flex-direction:column}.kv dt{color:var(--onv);font-size:13px}.kv dd{margin:0;font:400 26px "Google Sans","Figtree",sans-serif}
.kv.small{justify-content:flex-start}.kv.small dd{font:500 15px "Roboto"}
.row-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}.confirm .row-actions{justify-content:center}

.order-list{display:flex;flex-direction:column;gap:12px;padding-bottom:40px}
.ocard{padding:20px 24px}.oc-row{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}.ocard .eyebrow{margin:0 0 4px}
.oc-title{display:block;font:500 19px "Google Sans","Figtree",sans-serif}.oc-actions{display:flex;gap:8px;flex-wrap:wrap}
.oc-link{display:block;margin-top:8px;color:var(--on);text-decoration:none}.oc-link:hover .oc-title{text-decoration:underline}
.receipt-wrap{padding-top:48px;padding-bottom:88px;max-width:720px}.receipt h1{font-size:28px}
.narrow{padding-bottom:88px}.narrow>*{max-width:760px}

.addr-list{list-style:none;padding:0;margin:8px 0 22px;display:flex;flex-direction:column;gap:6px}
.addr-list li{display:flex;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line);color:var(--pri)}.addr-list li div{flex:1;color:var(--on)}.addr-list strong,.addr-list small{display:block}.addr-list small{color:var(--onv)}

.switch{appearance:none;-webkit-appearance:none;width:52px;height:32px;border-radius:16px;background:var(--surface);border:2px solid var(--outline);position:relative;cursor:pointer;flex:none;transition:background .15s}
.switch::after{content:"";position:absolute;top:4px;left:4px;width:20px;height:20px;border-radius:50%;background:var(--outline);transition:transform .15s,background .15s}
.switch:checked{background:var(--pri);border-color:var(--pri)}.switch:checked::after{transform:translateX(20px);background:var(--onp)}.switch:focus-visible{outline:2px solid var(--pri);outline-offset:2px}
.topic-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.topic{display:flex;gap:14px;align-items:center;padding:20px;text-decoration:none;color:var(--on)}.topic:hover{background:var(--pc)}.topic strong{font:500 17px "Google Sans","Figtree",sans-serif}
.help-topics{padding-bottom:88px}.order-list.compact{padding-bottom:0}

.table-wrap{overflow-x:auto;margin-top:12px}

.cell{width:100%;min-width:110px;height:38px;border-radius:10px;border:1px solid var(--outline);background:var(--bg);color:var(--on);padding:0 10px;font:400 14px "Roboto"}.cell.price-cell{min-width:70px;width:90px}
.pill-s{display:inline-block;border-radius:999px;padding:2px 10px;font-size:12.5px;background:var(--bg);border:1px solid var(--outline);white-space:nowrap}.pill-s.ok{background:#E6F4EA;color:#137333;border-color:#CEEAD6}.pill-s.bad{background:#FCE8E6;color:#A50E0E;border-color:#F6CBC7}
[data-theme="dark"] .pill-s.ok{background:#0D3B1E;color:#81C995;border-color:#1E5C33}[data-theme="dark"] .pill-s.bad{background:#5C1D18;color:#F6AEA9;border-color:#7A2A24}

.price-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.price-grid .h3{font-size:22px;margin:16px 0 8px}.price-grid p{margin:0}

.foot-grid{grid-template-columns:1.4fr repeat(5,1fr)}
@media (max-width:1100px){.price-grid{grid-template-columns:1fr 1fr}.foot-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:900px){.flow-grid{grid-template-columns:1fr}.topic-grid{grid-template-columns:1fr 1fr}.nav-links{gap:0}.nav-links a{padding:0 10px}}
@media (max-width:760px){

.cart-bar{left:16px;right:16px;transform:none;justify-content:center;bottom:16px}
 .line{grid-template-columns:1fr auto;gap:8px 12px}.line-total{grid-column:1}.line .icon-btn{justify-self:end}

.topic-grid,.price-grid{grid-template-columns:1fr}
 .kv dd{font-size:22px}
 .foot-grid{grid-template-columns:1fr 1fr}.confirm{padding:28px 20px 56px}}
@media print{.nav,.footer,.noprint{display:none!important}.receipt{background:none}}
/* round 2 spacing fixes */

.page-hero{padding-bottom:32px}
body:not([data-page=checkout]) h2.h3.mt{margin-top:44px;margin-bottom:14px}
.addr-list li.dim{color:var(--onv)}
.btn:disabled,.btn[aria-disabled=true]{opacity:.45;cursor:not-allowed;box-shadow:none}
.empty #pm-note{display:block;margin-top:8px}

.inline-link{color:var(--pri);font-weight:500;text-decoration:none}
.inline-link:hover{text-decoration:underline}
.safety-note{margin-top:16px}
/* Breadcrumb trail (Home / Section / Page), sits under the header */

.crumbs{background:var(--bg)}
.crumbs .wrap{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-top:12px;padding-bottom:4px;font-size:13px;color:var(--onv)}
.crumbs a{color:var(--onv);text-decoration:none;white-space:nowrap}
.crumbs a:hover{color:var(--pri);text-decoration:underline}
.crumbs span[aria-hidden]{color:var(--onv);opacity:.6}
.crumbs [aria-current="page"]{color:var(--on);font-weight:600;white-space:nowrap}

/* Phone: keep the cart bar and toasts above the floating "Ask Calabi" bar. */
@media (max-width:760px){
  .cart-bar{bottom:94px}
  .toast{bottom:172px}}

.foot-social{display:flex;gap:18px;align-items:center}
.foot-social a{display:inline-flex;color:#1a1a1a;opacity:1;transition:opacity .2s}
.foot-social a:hover{opacity:.7}
.foot-social svg{width:20px;height:20px;fill:currentColor;display:block}

/* ---------- promo code row (checkout) ---------- */

.promo-row{display:flex;gap:8px;margin:10px 0 2px}
.promo-row input{flex:1;min-width:0;text-transform:lowercase}
.promo-row input:disabled{opacity:.7}
/* ---------- store cards ---------- */

.gcard{display:flex;flex-direction:column;border-radius:20px;overflow:hidden;background:var(--surface-2);text-decoration:none;color:var(--on);border:1px solid var(--line);transition:box-shadow .15s,transform .15s}
.gcard:hover{box-shadow:var(--shadow);transform:translateY(-2px)}

.gcard-body{display:flex;flex-direction:column;gap:3px;padding:14px 16px 16px}
.gcard-body strong{font:500 18px/1.3 "Google Sans","Figtree",sans-serif}
.gcard-body small{color:var(--onv);font-size:13.5px}

@media (max-width:640px){

  .gcard-body{padding:12px 12px 14px}
  .gcard-body strong{font-size:16px}}
/* Checkout stepper (cart page): pill row that scrolls instead of clipping. */

.flow-steps{display:flex;gap:6px;align-items:center;overflow-x:auto;max-width:1200px;margin:0 auto;padding:14px 20px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.flow-steps::-webkit-scrollbar{display:none}
.flow-steps a{flex:0 0 auto;padding:8px 14px;border-radius:999px;font-size:13px;font-weight:500;color:var(--onv);text-decoration:none;white-space:nowrap;border:1px solid var(--outline);background:var(--surface)}
.flow-steps a[aria-current="step"]{background:var(--on);color:var(--bg);font-weight:700;border-color:var(--on)}
/* Product modal: fixed overlay with backdrop, card, and layout. */

.pmodal{position:fixed;inset:0;z-index:90;display:flex;align-items:flex-end;justify-content:center}
.pmodal[hidden]{display:none}
.pmodal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.5)}
.pmodal-card{position:relative;width:min(560px,100%);max-height:88dvh;overflow-y:auto;background:var(--bg);border-radius:20px 20px 0 0;padding:0 0 24px;box-shadow:0 -8px 40px rgba(0,0,0,.3)}
@media (min-width:640px){.pmodal{align-items:center;padding:24px}.pmodal-card{border-radius:20px}}
.pmodal-x{position:absolute;top:12px;right:12px;z-index:2;width:36px;height:36px;border-radius:50%;border:0;background:rgba(0,0,0,.45);color:#fff;font-size:20px;line-height:1;cursor:pointer}
.pmodal-img{min-height:200px;background:var(--surface);display:flex;align-items:center;justify-content:center;overflow:hidden}
.pmodal-img img{width:100%;height:220px;object-fit:contain}
.pmodal-body{padding:18px 22px 0}
.pmodal-desc{color:var(--onv);font-size:14px;line-height:1.55;margin:8px 0 0}
.pmodal-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:16px 0}
.pmodal-price{font-size:20px;font-weight:700}
.pmodal-add{width:100%;margin-top:4px}
/* Unstyled data tables (account, help, do-not-sell). */

table.apitable{width:100%;border-collapse:collapse;font-size:14px;margin:12px 0}
.apitable th,.apitable td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--outline)}
.apitable th{font-weight:600;color:var(--on);background:var(--surface)}
.apitable tr:last-child td{border-bottom:0}
/* Product modal: bottom-sheet overlay. */

.pmodal{position:fixed;inset:0;z-index:100;display:flex;align-items:flex-end;justify-content:center}
.pmodal[hidden]{display:none}
.pmodal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.5)}
.pmodal-card{position:relative;width:min(560px,100%);max-height:88dvh;overflow-y:auto;background:var(--surface);border-radius:20px 20px 0 0;padding:0 0 20px;box-shadow:0 -8px 32px rgba(0,0,0,.25)}
.pmodal-x{position:absolute;top:12px;right:12px;width:36px;height:36px;border-radius:50%;border:0;background:rgba(0,0,0,.4);color:#fff;font-size:20px;cursor:pointer;z-index:2}
.pmodal-img{width:100%;height:220px;overflow:hidden;border-radius:20px 20px 0 0;background:var(--surface2)}
.pmodal-img img{width:100%;height:100%;object-fit:contain}
.pmodal-body{padding:16px 20px 0}
.pmodal-desc{margin:8px 0 0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.pmodal-foot{display:flex;align-items:center;justify-content:space-between;margin:16px 0}
.pmodal-price{font-size:20px;font-weight:700}
.pmodal-add{width:100%;margin-top:4px}
/* ---- account button badge: orders since the menu was last opened ---- */

.notif-badge{position:absolute;top:-6px;right:-6px;min-width:18px;height:18px;padding:0 5px;border-radius:99px;background:#e02424;color:#fff;font-size:11px;font-weight:700;line-height:18px;text-align:center;pointer-events:none;box-shadow:0 1px 3px rgba(0,0,0,.35)}
.notif-badge[hidden]{display:none!important}
.acct-menu .notif-badge{position:static;margin-left:auto}
.check-row{display:flex;align-items:flex-start;gap:10px;cursor:pointer;font-size:14.5px;color:var(--on)}
.check-row input{width:18px;height:18px;margin-top:2px;accent-color:var(--pri);flex:none}
.check-row small{display:block;color:var(--onv);font-size:13px;margin-top:2px}
/* ---------- storefront: price freshness, "How we price", order status ---------- */

.price-tag{display:inline-flex;align-items:center;gap:4px;width:fit-content;margin-top:4px;padding:3px 9px;border-radius:999px;font:500 12px/1.3 "Roboto",sans-serif;background:var(--surface);color:var(--onv);border:1px solid var(--line)}
.price-tag.price-confirmed{background:#E6F4EA;color:#137333;border-color:#CEEAD6}
[data-theme="dark"] .price-tag.price-confirmed{background:#0D3B1E;color:#81C995;border-color:#1E5C33}
/* Header "Orders" link (icon + label) and order status chips (Orders list). */

@media (max-width:600px){.feed-top .mode-toggle{display:none}} /* info pages: the header must fit a phone */
.st-chip{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:999px;font:500 13px "Roboto",sans-serif;background:var(--pc);color:var(--opc);white-space:nowrap}
.st-chip.is-done{background:#E6F4EA;color:#137333}
.st-chip.is-bad{background:#FCE8E6;color:#A50E0E}
.st-chip.is-wait{background:var(--surface);color:var(--onv);border:1px solid var(--outline)}
[data-theme="dark"] .st-chip.is-done{background:#0D3B1E;color:#81C995}
[data-theme="dark"] .st-chip.is-bad{background:#5C1D18;color:#F6AEA9}
.link-btn{background:none;border:0;padding:0;font:inherit;color:var(--pri);text-decoration:underline;cursor:pointer}
.foot-grid div>button[data-cookie-settings]{display:block;background:none;border:0;padding:5px 0;color:var(--onv);font:inherit;font-size:15px;cursor:pointer;text-align:left}
.foot-grid div>button[data-cookie-settings]:hover{color:var(--on)}.sched-mode{display:flex;gap:10px 24px;flex-wrap:wrap;margin-bottom:12px}
/* ---------- restored storefront look: store cards, store header, menu ---------- */
.gcard-banner{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--surface);display:grid;place-items:center}
.gcard-av{margin-top:18px;width:80px;height:80px;border-radius:50%;background:var(--pc);color:var(--opc);display:grid;place-items:center;font:700 36px/1 "Figtree",sans-serif}
.gcard-badge{position:absolute;top:12px;left:12px;display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.94);color:#1F1F1F;font:600 12.5px "Roboto",sans-serif;padding:7px 12px;border-radius:999px;box-shadow:0 1px 4px rgba(0,0,0,.18)}
.gcard-badge svg{color:#1A73E8}
.gcard-badge.is-off{background:#FCE8E6;color:#A50E0E}
.gcard.is-off{opacity:.7}
.gcard-meta{display:flex;align-items:center;gap:6px;color:var(--onv);font-size:13.5px}
.gcard-meta .ic{color:var(--onv)}
.gcard-body small:first-letter{text-transform:uppercase}
.otile-ic{width:64px;height:64px;border-radius:50%;background:var(--pc);color:var(--opc);display:grid;place-items:center;flex:none;font:700 28px/1 "Figtree",sans-serif}
.store-head{display:flex;gap:18px;align-items:center;flex-wrap:nowrap;margin:4px 0 0}
.store-head h1.sec{margin:2px 0}
.store-head .eyebrow{margin:0}.store-head .eyebrow:first-letter{text-transform:uppercase}
.store-head .dim{margin:2px 0 0;font-size:14.5px}
[data-view="store"] .form-status{margin:14px 0 0}
[data-view="store"] .search-big{margin-top:18px}
.menu-title{font:700 26px/1.2 "Google Sans","Figtree",sans-serif;margin:26px 0 2px}
.store-cats .chip{flex:0 0 auto;height:auto;padding:8px 10px;border:0;background:transparent;border-radius:0;color:var(--on);font:400 20px/1.3 "Google Sans","Figtree",sans-serif}
.store-cats .chip:hover{background:transparent;color:var(--pri)}
.store-cats .chip[aria-pressed="true"]{font-weight:700;background:transparent;color:var(--on);box-shadow:inset 0 -3px 0 var(--on)}
/* shortcut chips (grocery) and the Popular row: horizontal scroll, same cards as the list */
.store-quick{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-top:12px;padding-bottom:2px}
.store-quick::-webkit-scrollbar{display:none}
.store-quick .chip{flex:0 0 auto}
.store-quick[hidden],.popular[hidden]{display:none}
.popular{margin-top:18px;min-width:0}
.popular-title{font:700 20px/1.3 "Google Sans","Figtree",sans-serif;margin:0 0 8px}
.popular-row{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x proximity;padding:2px 2px 10px;scrollbar-width:thin;overscroll-behavior-x:contain}
.popular-row .menu-item{flex:0 0 min(300px,80vw);scroll-snap-align:start}
.menu-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:14px}
.menu-list>.card,.menu-list>p{grid-column:1/-1}
.menu-item{background:var(--bg);border:1px solid var(--outline);border-radius:16px;padding:16px;cursor:pointer;display:flex;gap:14px;align-items:stretch;min-width:0;transition:box-shadow .15s,transform .15s}
.menu-item:hover{box-shadow:var(--shadow);transform:translateY(-2px)}
.menu-item:active{background:var(--surface)}
.menu-item:focus-visible{outline:2px solid var(--pri);outline-offset:2px}
.menu-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.menu-name{font:700 18px/1.3 "Google Sans","Figtree",sans-serif;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.menu-unit{color:var(--onv);font-size:14px}
.menu-desc{margin:0;font:400 16px/1.5 "Roboto",sans-serif}
.menu-price{font:700 18px/1.3 "Google Sans","Figtree",sans-serif;margin-top:4px}
.menu-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;padding-top:6px;flex-wrap:wrap}
.menu-item.is-oos .menu-name,.menu-item.is-oos .menu-price,.menu-item.is-oos .menu-pic{opacity:.55}
.btn.add{height:38px;padding:0 18px}
.menu-foot .stepper{height:38px}
.oos{font-size:13px;color:var(--onv)}
.with-code{color:var(--pri);font-weight:700}
/* product pictures: fixed square tile, never cropped */
.menu-pic,.line-pic,.cl-pic,.pmodal-pic{flex:none;display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;box-sizing:border-box}
.menu-pic{width:112px;height:112px;align-self:flex-start}
.menu-pic img,.line-pic img,.cl-pic img,.pmodal-pic img{width:100%;height:100%;object-fit:contain;object-position:center;padding:6px;box-sizing:border-box;display:block}
.menu-pic.is-blank,.line-pic.is-blank,.cl-pic.is-blank,.pmodal-pic.is-blank{background:var(--surface);color:var(--onv);font:700 28px/1 "Figtree",sans-serif}
.line-pic{width:56px;height:56px;border-radius:10px}
.line-pic.is-blank{font-size:20px}
.cl-pic{width:48px;height:48px;border-radius:10px}
.cl-pic.is-blank{font-size:18px}
.line-main{display:flex;gap:12px;align-items:center;min-width:0}
.pmodal-img{height:auto!important;min-height:0;background:#fff!important;padding:0;display:block}
.pmodal-pic{width:100%;height:300px;border:0;border-radius:0}
.pmodal-pic img{padding:16px}
.pmodal-pic.is-blank{font-size:64px}
.pmodal-name{font:700 24px/1.25 "Google Sans","Figtree",sans-serif;margin:0 0 4px}
.pmodal-meta{margin:12px 0 0;display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center}
.price-note{font-size:13px;color:var(--onv)}
.stock-note{font-size:13px;color:#137333}[data-theme="dark"] .stock-note{color:#81C995}
@media (min-width:1100px){.menu-pic{width:128px;height:128px}}
@media (max-width:760px){
  .menu-list{grid-template-columns:1fr;gap:12px}
  .menu-item{padding:14px}
  .menu-name{font-size:17px}
  .menu-pic{width:104px;height:104px}
  .store-head{gap:14px}.otile-ic{width:56px;height:56px;font-size:24px}
  .menu-title{font-size:24px;margin-top:20px}
  .store-cats .chip{font-size:18px}
  .pmodal-pic{height:240px}}
/* fixed bottom UI sits above the slim cookie bar */
.cart-bar{bottom:calc(24px + var(--calabi-consent-h, 0px))}
.toast{bottom:calc(96px + var(--calabi-consent-h, 0px))}
@media (max-width:760px){.cart-bar{bottom:calc(94px + env(safe-area-inset-bottom) + var(--calabi-consent-h, 0px))}.toast{bottom:calc(172px + var(--calabi-consent-h, 0px))}}
@media (min-width:761px) and (max-width:1180px){.cart-bar{bottom:calc(100px + var(--calabi-consent-h, 0px))}}
.stock-tag{display:inline-flex;width:fit-content;padding:2px 8px;border-radius:999px;font:500 12px/1.3 "Roboto",sans-serif}
.stock-tag.is-out{color:#B3261E;background:#FCE8E6}
[data-theme="dark"] .stock-tag.is-out{color:#F2B8B5;background:#3C1512}

/* storefront pictures (Street View); 16:9 keeps the Google attribution inside the frame */
.gcard-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:var(--surface)}
.gcard-badge{z-index:1}
.store-photo:empty{display:none}
.store-photo{aspect-ratio:16/9;max-height:300px;margin:0 0 14px;border-radius:16px;overflow:hidden;border:1px solid var(--outline);background:var(--surface)}
.store-photo-img{display:block;width:100%;height:100%;object-fit:cover}

/* Cart bar sits beside the chat button on one row (phone and tablet). */
@media (max-width:1180px){
  .cart-bar{left:16px;right:86px;transform:none;justify-content:center;bottom:calc(24px + env(safe-area-inset-bottom) + var(--calabi-consent-h, 0px))}
  .toast{bottom:calc(96px + var(--calabi-consent-h, 0px))}}

.home-search{display:block;width:100%;box-sizing:border-box;margin:0 0 16px;padding:12px 16px;border:1px solid var(--line);border-radius:999px;background:var(--surface-2);color:var(--on);font:400 16px "Roboto",sans-serif}