/* Gift vouchers: the voucher artwork with the details written on its lines (home teaser + gift-vouchers.html) */
.voucher{position:relative;container-type:inline-size;margin:0;border-radius:10px;overflow:hidden;box-shadow:0 18px 45px #38223924;background:#fbf1f6}
.voucher img{width:100%;height:auto;aspect-ratio:1600/891}
.voucher [data-v]{position:absolute;font:italic 500 3.4cqw/1 var(--serif);color:var(--hot);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-bottom:.12em}
.voucher [data-v=to]{left:16%;right:12%;bottom:46.9%}
.voucher [data-v=from]{left:16%;right:12%;bottom:39.1%}
.voucher [data-v=value]{left:18.6%;right:53%;bottom:30.3%}
.voucher [data-v=treatment]{left:63.6%;right:11.8%;bottom:30.3%;font-size:2.35cqw}
.voucher [data-v=no]{left:22.4%;right:13%;bottom:22.7%;font-size:2.4cqw;color:var(--muted)}
.nav-gift{color:var(--hot)}
.site-header nav a{white-space:nowrap}
@media(min-width:1101px) and (max-width:1320px){.site-header{gap:22px}.site-header nav{gap:18px;font-size:14px}.site-header .button.small{font-size:14px;padding:12px 20px}}

/* Home page teaser */
.gift-teaser{background:#f9e6ef}
.gift-teaser-grid{display:grid;grid-template-columns:1fr 1.25fr;gap:7%;align-items:center}
.gift-teaser p:not(.eyebrow){margin-top:24px;max-width:430px}
.gift-teaser .gift-actions{display:flex;flex-wrap:wrap;align-items:center;gap:22px;margin-top:30px}
.gift-occasions{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px;padding:0;list-style:none}
.gift-occasions li{border:1px solid #e3bfd0;border-radius:30px;padding:7px 15px;font-size:12px;background:#fffafc99}

/* Gift vouchers page */
.voucher-page h1{font-size:clamp(46px,5.5vw,78px);letter-spacing:-2px;max-width:900px}
.voucher-page .service-lede{max-width:720px}
.voucher-builder{display:grid;grid-template-columns:1.25fr 1fr;gap:5%;align-items:start;margin-top:45px}
.voucher-preview{position:sticky;top:130px}
.voucher-preview figcaption{font-size:12px;color:var(--muted);margin-top:14px}
.voucher-form{background:#f9e6ef}
.voucher-form .field select,.voucher-form .field input{font-size:15px}
.voucher-form fieldset{border:0;margin:0;padding:0;min-width:0}
.voucher-form legend{font-size:11px;letter-spacing:.5px;padding:0;margin-bottom:10px}
.amount-chips{display:flex;flex-wrap:wrap;gap:8px}
.amount-chips label{position:relative}
.amount-chips input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.amount-chips span{display:block;padding:9px 18px;border:1px solid #bdaabc;border-radius:30px;font-size:13px;background:var(--paper)}
.amount-chips input:checked+span{background:var(--ink);border-color:var(--ink);color:#fff}
.amount-chips input:focus-visible+span{outline:3px solid var(--hot);outline-offset:3px}
.voucher-form .field[hidden]{display:none}
.voucher-form .book__fine{font-size:11px;margin-top:12px}
.voucher-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;margin-top:80px;padding:0;list-style:none;counter-reset:step}
.voucher-steps li{border-top:1px solid var(--ink);padding-top:22px;counter-increment:step}
.voucher-steps li:before{content:'0' counter(step);display:block;font-size:10px;letter-spacing:1px;margin-bottom:16px}
.voucher-steps h3{font-size:28px;margin-bottom:12px}
.voucher-steps p{font-size:14px}
.voucher-terms{list-style:none;padding:0;margin:15px 0 0}
.voucher-terms li{padding:10px 0;border-bottom:1px solid var(--line);font-size:15px}
@media(max-width:900px){.gift-teaser-grid,.voucher-builder{grid-template-columns:1fr;gap:35px}.voucher-preview{position:static}.voucher-steps{grid-template-columns:1fr;gap:10px;margin-top:55px}}
