/* Office Perks (NYC Office Catering) — no-nonsense value: receipts, checklists and a savings calculator. */
.checkout-layout .op-panel input[type=checkbox],.checkout-layout .op-panel input[type=radio]{width:18px;height:18px;min-width:0;padding:0;border:0;background:none;margin:0;flex:none;border-radius:0;box-shadow:none}
.op-panel label,.op-panel legend{text-transform:none;letter-spacing:normal}
.op-w{width:min(100% - 2.5rem,var(--wrap,1120px));margin-inline:auto}
.op-bar{background:var(--gold-lt,#CDB070);color:var(--forest,#0C2A1B);font:500 13.5px/1.3 var(--sans,'Poppins',sans-serif)}
.op-bar .op-w{display:flex;gap:10px;align-items:center;justify-content:center;padding:8px 0;flex-wrap:wrap}
.op-bar a{color:inherit;font-weight:600;padding:3px 12px;border:1.5px solid currentColor;border-radius:999px;text-decoration:none}
.op-tag{display:inline-flex;gap:8px;align-items:center;font:600 13px/1 var(--sans,'Poppins',sans-serif);color:var(--gold-ink,#7A6230);background:var(--sand,#EEE7D4);padding:8px 12px;border-radius:999px;margin:0 0 14px}
.op-strip{display:flex;gap:10px;align-items:center;margin:16px 0 0;padding:12px 14px;border:1.5px dashed var(--gold,#AD935D);border-radius:var(--radius,12px);font-size:14px;color:var(--ink,#26332B);background:var(--paper,#FFFCF5)}
.op-strip svg{color:var(--gold-ink,#7A6230);flex:none}.op-strip a{color:inherit}
.op-line{margin:12px 0;padding:12px 14px;border-radius:var(--radius,12px);background:var(--sand,#EEE7D4);font:13.5px/1.4 ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;color:var(--ink,#26332B)}
.op-line p{display:flex;justify-content:space-between;gap:10px;margin:0}
.op-line b{color:var(--green,#0F4229);font-size:15px}
.op-line .d{opacity:.7;margin-top:3px}
.op-line small{display:block;margin-top:6px;font:12px/1.4 var(--sans,'Poppins',sans-serif);opacity:.75}
.op-used{background:#E3F0E7}
.op-panel{border:2px solid var(--green,#0F4229);border-radius:var(--radius,12px)}
.op-checks{list-style:none;margin:0 0 14px;padding:0;display:flex;flex-wrap:wrap;gap:6px 18px;font-size:14px}
.op-checks li::before{content:'✓';display:inline-grid;place-items:center;width:20px;height:20px;margin-right:6px;border-radius:50%;background:var(--green,#0F4229);color:#fff;font-size:12px}
.op-opt{display:flex;gap:12px;align-items:flex-start;padding:14px;border-radius:var(--radius,12px);background:var(--sand,#EEE7D4);cursor:pointer}
.op-opt input{width:20px;height:20px;accent-color:var(--green,#0F4229);flex:none;margin-top:2px}
.op-opt small{display:block;font-size:13px;color:var(--ink-soft,#4D5A52);margin-top:3px}
.op-pick{border:0;padding:0;margin:14px 0 0;display:grid;gap:6px}
.op-pick legend{font-weight:600;font-size:14px;margin-bottom:6px}
.op-pick label{display:flex;gap:10px;align-items:center;padding:10px 12px;border:1px solid var(--line,#DDD3BC);border-radius:10px;font-size:14px;cursor:pointer;background:#fff}
.op-pick label:has(input:checked){border-color:var(--green,#0F4229);background:#F1F7F3}
.op-pick input{accent-color:var(--green,#0F4229)}
.op-code{display:grid;grid-template-columns:1fr auto;gap:6px 8px;margin-top:14px;max-width:440px}
.op-code label{grid-column:1/-1;font-weight:600;font-size:13.5px}
.op-code input{padding:11px 12px;border:1px solid var(--line,#DDD3BC);border-radius:10px;font:14px ui-monospace,Menlo,Consolas,monospace;text-transform:uppercase;background:#fff;color:var(--ink,#26332B)}
.rwx-msg{font-size:14px;margin:8px 0 0}.rwx-msg.ok{color:var(--green,#0F4229);font-weight:600}.rwx-msg.err{color:#a3302a}
.op-thanks,.op-receipt{max-width:380px;margin:24px 0;padding:20px 22px 24px;background:#fff;color:#26332B;font:14px/1.5 ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;box-shadow:0 10px 30px -12px rgba(12,42,27,.35);position:relative;-webkit-mask:linear-gradient(#000 0 0) top/100% calc(100% - 10px) no-repeat,radial-gradient(circle 6px at 8px 100%,transparent 98%,#000) bottom/16px 10px repeat-x;mask:linear-gradient(#000 0 0) top/100% calc(100% - 10px) no-repeat,radial-gradient(circle 6px at 8px 100%,transparent 98%,#000) bottom/16px 10px repeat-x}
.op-thanks p,.op-receipt p{display:flex;justify-content:space-between;gap:10px;margin:0;padding:3px 0}
.op-thanks .h,.op-receipt .h{justify-content:center;letter-spacing:.14em;font-weight:700;border-bottom:1px dashed #9AA49C;padding-bottom:10px;margin-bottom:8px}
.op-thanks span,.op-receipt span{font-weight:700}
.op-thanks .d,.op-receipt .d{opacity:.7}
.op-thanks .t,.op-receipt .t{border-top:1px dashed #9AA49C;margin-top:8px;padding-top:10px}
.op-receipt .perk{color:#0F4229;font-weight:700}
.op-thanks small{display:block;margin-top:10px;font:12.5px/1.4 var(--sans,'Poppins',sans-serif);color:#4D5A52}.op-thanks a{color:inherit}
.op-home{background:var(--cream,#F7F3EA);padding:clamp(52px,7vw,92px) 0}
.op-home-in{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(24px,5vw,64px);align-items:center}
.op-home h2{font:600 clamp(28px,3.6vw,42px)/1.12 var(--serif,'Lora',serif);margin:0 0 12px;color:var(--forest,#0C2A1B)}
.op-home p{color:var(--ink-soft,#4D5A52);max-width:52ch}
.op-home .op-receipt{justify-self:center;width:100%;transform:rotate(1.5deg)}
.rwx-preview{position:fixed;left:12px;bottom:12px;z-index:9999;padding:8px 14px;border-radius:10px;background:#0C2A1B;color:#CDB070;font:600 12px/1 var(--sans,'Poppins',sans-serif)}
@media (max-width:820px){.op-home-in{grid-template-columns:1fr}}

/* ---------- the Office Perks page ---------- */
.op-hero{background:var(--forest,#0C2A1B);color:#fff;padding:clamp(56px,8vw,100px) 0}
.op-hero-in{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(24px,5vw,64px);align-items:center}
.op-hero .op-h1{font:600 clamp(36px,5vw,60px)/1.06 var(--serif,'Lora',serif);margin:0 0 16px;color:#fff;max-width:none}
.op-hero .op-y{color:var(--gold-lt,#CDB070)}
.op-hero p.lede{color:#D5DED8;font-size:17px;max-width:50ch}
.op-hero .acts{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.op-hero .op-receipt{justify-self:center;width:100%;transform:rotate(-2deg)}
.op-sec{padding:clamp(52px,7vw,92px) 0;background:var(--paper,#FFFCF5);color:var(--ink,#26332B)}
.op-sec.alt{background:var(--cream,#F7F3EA)}
.op-sec h2{font:600 clamp(28px,3.4vw,40px)/1.15 var(--serif,'Lora',serif);margin:0 0 8px;color:var(--forest,#0C2A1B)}
.op-sec .sub{color:var(--ink-soft,#4D5A52);margin:0 0 28px;max-width:60ch}
.op-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.op-grid li{list-style:none;padding:18px 18px 18px 52px;border-radius:var(--radius,12px);background:#fff;border:1px solid var(--line,#DDD3BC);position:relative;font-size:15px}
.op-grid li::before{content:'✓';position:absolute;left:16px;top:17px;width:24px;height:24px;border-radius:50%;background:var(--green,#0F4229);color:#fff;display:grid;place-items:center;font-size:13px}
.op-grid b{display:block;margin-bottom:2px;color:var(--forest,#0C2A1B)}
.op-grid ul{padding:0;margin:0}
.op-calc{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,4vw,40px);align-items:center;padding:clamp(22px,4vw,36px);border-radius:16px;background:#fff;border:2px solid var(--green,#0F4229)}
.op-calc label{display:grid;gap:8px;font-weight:600}
.op-calc input[type=range]{width:100%;accent-color:var(--green,#0F4229)}
.op-calc output{font:600 30px/1 var(--serif,'Lora',serif);color:var(--forest,#0C2A1B)}
.op-calc .res{display:grid;gap:10px}
.op-calc .res div{display:flex;justify-content:space-between;gap:10px;padding:12px 14px;border-radius:10px;background:var(--sand,#EEE7D4);font:15px ui-monospace,Menlo,Consolas,monospace}
.op-calc .res div b{color:var(--green,#0F4229)}
.op-calc small{color:var(--ink-soft,#4D5A52);font-weight:400}
.op-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.op-cards div{padding:22px;border-radius:var(--radius,12px);background:#fff;border:1px solid var(--line,#DDD3BC)}
.op-cards div:first-child{border:2px solid var(--gold,#AD935D)}
.op-cards b{font:600 20px/1.25 var(--serif,'Lora',serif);color:var(--forest,#0C2A1B);display:block;margin-bottom:6px}
.op-cards small{font-weight:600;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--gold-ink,#7A6230)}
.op-cards p{margin:6px 0 0;font-size:14.5px;color:var(--ink-soft,#4D5A52)}
.op-forms{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.op-forms>div{padding:clamp(20px,3.5vw,32px);border-radius:16px;background:#fff;border:1px solid var(--line,#DDD3BC)}
.op-forms h3{font:600 24px/1.2 var(--serif,'Lora',serif);margin:0 0 4px;color:var(--forest,#0C2A1B)}
.op-forms p.s{margin:0 0 14px;color:var(--ink-soft,#4D5A52)}
.op-forms form{display:grid;gap:10px}
.op-forms label{display:grid;gap:4px;font-size:13.5px;font-weight:600}
.op-forms input{padding:12px;border:1px solid var(--line,#DDD3BC);border-radius:10px;font:inherit;font-weight:400;background:var(--paper,#FFFCF5);color:var(--ink,#26332B)}
.op-forms .btn{justify-self:start}
.rwx-ok{color:var(--green,#0F4229);font-weight:600;margin:0}.rwx-err{color:#a3302a;margin:0}
.op-faq details{border:1px solid var(--line,#DDD3BC);border-radius:12px;padding:14px 16px;margin-bottom:8px;background:#fff}
.op-faq summary{cursor:pointer;font-weight:600}
.op-faq p{margin:8px 0 0;color:var(--ink-soft,#4D5A52)}
.op-fine{font-size:12.5px;color:var(--ink-soft,#4D5A52);margin-top:24px;max-width:90ch}
.op-hp{position:absolute;left:-9999px}
@media (max-width:860px){.op-hero-in,.op-calc,.op-forms{grid-template-columns:1fr}.op-grid,.op-cards{grid-template-columns:1fr}}
