/* All Vital Supplements. Visual language: a bento box. The whole store sits in tiles of different sizes in one grid; lifestyle photos are washed to grayscale on a tinted tile so they stop reading warm. Boldness is spent on the price numerals only. */
:root{
  --qv-lilac:#ECE3F4;--qv-mint:#DCEFD9;--qv-honey:#F6E7B4;--qv-blush:#F7DEDA;
  --qv-ink:#3F2556;--qv-gold:#C9A44C;--qv-paper:#F5F3F8;--qv-white:#fff;--qv-line:#3F255622
}
*{box-sizing:border-box}
html,body{margin:0}
.qv-page{background:var(--qv-paper);color:var(--qv-ink);font:300 17px/1.55 Outfit,system-ui,sans-serif}
.qv-page a{color:inherit}
.qv-page :focus-visible{outline:3px solid var(--qv-ink);outline-offset:3px}
.qv-page img{max-width:100%}

.qv-top{max-width:1280px;margin:0 auto;padding:18px 24px;display:grid;grid-template-columns:auto 1fr auto;gap:24px;align-items:center;font-weight:500;font-size:15px}
.qv-mark{display:flex;align-items:center;gap:10px;font-weight:700;font-size:24px;text-decoration:none;letter-spacing:-.3px}
.qv-mark img{width:34px;height:auto}
.qv-menu{display:flex;gap:24px;justify-content:center;flex-wrap:wrap}
.qv-menu a,.qv-reach a{text-decoration:none}
.qv-menu a:hover,.qv-menu a[aria-current]{text-decoration:underline;text-underline-offset:4px}
.qv-reach{display:flex;gap:14px;align-items:center;white-space:nowrap}
.qv-bag{background:var(--qv-ink);color:var(--qv-white)!important;padding:8px 16px;border-radius:30px}

.qv-main{max-width:1280px;margin:0 auto;padding:6px 24px 30px}
.qv-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}
.qv-grid--home{grid-auto-rows:150px}
.qv-tile{border-radius:28px;overflow:hidden;position:relative;padding:24px;background:var(--qv-white);min-width:0}
.qv-tile h1{font-weight:700;font-size:clamp(32px,3.6vw,54px);line-height:1.04;margin:0 0 12px;letter-spacing:-1px}
.qv-tile h2{font-weight:700;font-size:24px;margin:0 0 6px;letter-spacing:-.3px}
.qv-tile h3{font-weight:500;font-size:15px;margin:8px 0 0}
.qv-tile h3 a{text-decoration:none}
.qv-tile p{margin:0 0 10px}
.qv-lead{background:var(--qv-lilac);display:flex;flex-direction:column;justify-content:flex-end}
.qv-honey{background:var(--qv-honey)}
.qv-mint{background:var(--qv-mint)}
.qv-blush{background:var(--qv-blush)}
.qv-plain{background:var(--qv-white)}

/* home placement */
.qv-grid--home .qv-lead{grid-column:1/4;grid-row:1/3}
.qv-spot-photo1{grid-column:4/7;grid-row:1/4}
.qv-spot-rate{grid-column:1/3;grid-row:3/4}
.qv-spot-hero{grid-column:3/4;grid-row:3/4;display:flex;align-items:center;justify-content:center;padding:8px}
.qv-spot-hero img{max-height:100%;border-radius:18px}
.qv-spot-box1{grid-column:1/3;grid-row:4/6}
.qv-spot-box2{grid-column:3/5;grid-row:4/6}
.qv-spot-box3{grid-column:5/7;grid-row:4/6}
.qv-spot-repeat{grid-column:1/5;grid-row:6/8;display:grid;grid-template-columns:auto 1fr;gap:24px;align-items:center}
.qv-spot-photo2{grid-column:5/7;grid-row:6/8}
.qv-spot-rate p{font-size:15px}

.qv-film{padding:0}
.qv-film--lilac{background:#B9A4D6}
.qv-film--mint{background:#9ACB93}
.qv-wash{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:contrast(1.1);mix-blend-mode:multiply}

.qv-box{display:flex;flex-direction:column}
.qv-box ul{margin:0 0 18px;padding-left:18px;font-size:15px}
.qv-box li em{font-style:normal;opacity:.7;margin-left:6px;font-size:13px}
.qv-boxno{font-size:14px;opacity:.75}
.qv-sum{font-weight:700;font-size:40px;letter-spacing:-1px;line-height:1;margin:auto 0 0!important}
.qv-sum a{text-decoration:none}
.qv-box small,.qv-item small{display:block;margin:4px 0 12px}
.qv-box--ink{background:var(--qv-ink);color:var(--qv-white)}
.qv-box--ink .qv-sum{color:var(--qv-gold)}
.qv-sum--big{font-size:56px;letter-spacing:-2px}
.qv-sum--big small{display:block;font-size:16px;letter-spacing:0;font-weight:500}

.qv-one{grid-row:span 2;padding:12px;display:flex;flex-direction:column;text-align:center}
.qv-one--blush{background:var(--qv-blush)}
.qv-one b{font-weight:700;font-size:19px}
.qv-shot{width:100%;flex:1;min-height:0;object-fit:cover;border-radius:16px}
.qv-ask{grid-column:span 3;grid-row:span 2;display:flex;flex-direction:column;justify-content:center;overflow-wrap:anywhere}

.qv-typecard{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:14px;border:2px solid var(--qv-ink)}
.qv-typecard b{font-weight:700;font-size:22px;line-height:1.1;letter-spacing:-.5px}
.qv-typecard span{font-size:13px;margin-top:6px}
.qv-tint-lilac{background:var(--qv-lilac)}
.qv-tint-mint{background:var(--qv-mint)}
.qv-tint-honey{background:var(--qv-honey)}
.qv-tint-blush{background:var(--qv-blush)}

.qv-add{margin:8px 0 0;display:flex;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap}
.qv-box .qv-add,.qv-item .qv-add{justify-content:flex-start}
.qv-btn{display:inline-block;background:var(--qv-ink);color:var(--qv-white)!important;border:0;border-radius:30px;padding:10px 18px;font:500 15px Outfit,sans-serif;cursor:pointer;text-decoration:none}
.qv-btn--pale{background:var(--qv-white);color:var(--qv-ink)!important}
.qv-btn:disabled{opacity:.4;cursor:not-allowed}
.qv-btn--go{font-size:17px;padding:13px 26px}
.qv-qty{font-size:14px;font-weight:500}
.qv-qty select{font:inherit;padding:6px 8px;border-radius:10px;border:1px solid var(--qv-line);margin-left:6px}
.qv-flash{font-size:13px;width:100%}

/* stacked pages */
.qv-grid--stack{align-items:start}
.qv-wide{grid-column:1/-1}
.qv-half{grid-column:span 3}
.qv-item{display:grid;grid-template-columns:220px minmax(0,1fr) minmax(0,1.2fr);gap:24px;align-items:start}
.qv-item-pic .qv-shot{aspect-ratio:1/1;height:auto}
.qv-item-text p{font-size:15px}
.qv-subtitle{font-weight:500;color:#6A4C82}
.qv-claims{font-size:15px;padding-left:18px;margin:0 0 10px}
.qv-other{font-size:14px;margin-top:10px}
.qv-facts{width:100%;border-collapse:collapse;font-size:14px;border:2px solid var(--qv-ink)}
.qv-facts caption{text-align:left;font-weight:700;font-size:20px;padding:0 0 6px}
.qv-facts th,.qv-facts td{text-align:left;padding:6px 10px;border-bottom:1px solid var(--qv-line);font-weight:300;vertical-align:top}
.qv-facts thead th{font-weight:500;border-bottom:4px solid var(--qv-ink)}
.qv-facts td{text-align:right;white-space:nowrap}
.qv-facts .qv-sub th{padding-left:26px}

.qv-scroll{overflow-x:auto}
.qv-table{width:100%;border-collapse:collapse;font-size:15px;margin:8px 0 12px}
.qv-table th,.qv-table td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--qv-line);vertical-align:top}
.qv-table th{font-weight:500}

.qv-legal{max-width:none;font-size:16px}
.qv-legal h2{font-size:20px;margin-top:22px}
.qv-legal h3{font-size:17px}
.qv-optout{background:var(--qv-lilac);border-radius:18px;padding:16px 18px;margin:12px 0}

/* basket */
.qv-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;gap:14px;align-items:center;padding:10px 0;border-bottom:1px solid var(--qv-line)}
.qv-row small{display:block;font-size:13px;opacity:.75}
.qv-row input{width:62px;font:inherit;padding:5px 8px;border-radius:10px;border:1px solid var(--qv-line)}
.qv-row button{background:none;border:0;font:inherit;text-decoration:underline;cursor:pointer;color:inherit}
.qv-total{display:flex;justify-content:space-between;font-weight:700;font-size:24px;padding-top:14px}
.qv-tick{display:grid;grid-template-columns:22px 1fr;gap:12px;align-items:start;margin:8px 0;font-size:16px}
.qv-tick input{width:20px;height:20px;margin:3px 0 0}
.qv-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px;margin-bottom:14px}
.qv-field span{display:block;font-size:14px;font-weight:500;margin-bottom:4px}
.qv-field input{width:100%;font:inherit;padding:10px 12px;border-radius:12px;border:1px solid #3F255655;background:#fff}
.qv-alert{background:var(--qv-blush);border-radius:12px;padding:10px 14px}

.qv-foot{max-width:1280px;margin:0 auto;padding:30px 24px 40px;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:28px;font-size:15px;border-top:1px solid var(--qv-line)}
.qv-foot-id strong{font-weight:700;font-size:20px;display:block;margin-bottom:6px}
.qv-foot-list{list-style:none;padding:0;margin:0;line-height:2}
.qv-foot a{text-decoration:none}
.qv-foot a:hover{text-decoration:underline}
.qv-fine{grid-column:1/-1;font-size:13px;margin:6px 0 0;opacity:.8}

@media (max-width:980px){
  .qv-top{grid-template-columns:1fr;justify-items:start;gap:10px}
  .qv-menu{justify-content:flex-start;gap:8px 16px}
  .qv-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .qv-grid--home{grid-auto-rows:auto}
  .qv-grid > .qv-tile{grid-column:1/-1!important;grid-row:auto!important}
  .qv-grid > .qv-one{grid-column:span 1!important;height:310px}
  .qv-spot-photo1,.qv-spot-photo2{height:260px}
  .qv-spot-hero{height:280px}
  .qv-box{min-height:300px}
  .qv-spot-repeat{grid-template-columns:1fr}
  .qv-item{grid-template-columns:1fr}
  .qv-item-pic{max-width:260px}
  .qv-fields{grid-template-columns:1fr}
  .qv-row{grid-template-columns:minmax(0,1fr) auto;row-gap:6px}
  .qv-foot{grid-template-columns:1fr}
}
@media (max-width:420px){
  .qv-tile{padding:18px;border-radius:22px}
  .qv-grid > .qv-one{height:280px}
  .qv-reach{flex-wrap:wrap}
}
.qv-item-text .qv-sum{font-size:32px;margin:14px 0 0!important}
@media (max-width:700px){.qv-table thead{display:none}.qv-table,.qv-table tbody,.qv-table tr,.qv-table td{display:block;width:100%}.qv-table tr{padding:10px 0;border-bottom:1px solid var(--qv-line)}.qv-table td{border:0;padding:2px 0;display:grid;grid-template-columns:84px minmax(0,1fr);gap:10px}.qv-table td::before{content:attr(data-col);font-weight:500}}
