/* Visual language inspired by Viktoria's white packaging, dark type, yellow Gold line and soft sage details. */
.vr{--ink:#20283b;--forest:#20283b;--gold:#f6c500;--sand:#fff;--paper:#fff;--line:#e3e5e7;color:var(--ink);background:#fff;font-family:Arial,Helvetica,sans-serif}
.vr h1,.vr h2,.vr-routine__head h3,.vr-product h4{font-family:'Courier New',Courier,monospace;font-weight:700;letter-spacing:-.05em}
.vr h3{font-family:'Courier New',Courier,monospace;font-weight:700;letter-spacing:-.035em}
.vr-hero{min-height:560px;grid-template-columns:1fr 1fr;background:#fff;border-bottom:1px solid var(--line)}
.vr-hero__copy{padding:clamp(35px,6vw,90px)}
.vr-eyebrow,.vr-kicker{color:var(--ink);font:700 12px 'Courier New',monospace;letter-spacing:.16em}
.vr-eyebrow span{color:var(--gold);font-size:18px;vertical-align:-1px}
.vr-hero h1{font-size:clamp(40px,4.5vw,67px);margin:28px 0 23px}
.vr-hero h1 em,.vr-philosophy em{font-style:normal;color:var(--ink);background:linear-gradient(transparent 67%,var(--gold) 67%)}
.vr-hero p,.vr-section__intro p{color:#596071}
.vr-button{background:var(--ink);font:700 13px 'Courier New',monospace;text-transform:uppercase;letter-spacing:.07em;border-radius:0}
.vr-button:hover{background:#111725}
.vr-hero__art{background:#fff;display:grid;place-items:center;min-height:0;padding:20px}
.vr-hero__art:before{content:'';width:24px;height:24px;border-radius:50%;background:#afcdb7;position:absolute;top:14%;left:3%}
.vr-hero__art img{display:block;width:100%;max-height:555px;object-fit:contain;position:relative}
.vr-progress{background:#fff}
.vr-progress span{color:#7c8490;font-family:'Courier New',monospace}
.vr-progress .is-current{background:#fff;box-shadow:inset 0 -5px var(--gold)}
.vr-section__intro h2{font-size:clamp(34px,3.8vw,56px)}
.vr-question__title h3{font-size:26px}
.vr-number{background:var(--gold);border-radius:0;font-family:'Courier New',monospace;font-weight:700}
.vr-ages button{border-radius:0;background:#fff;color:var(--ink)}
.vr-ages button[aria-pressed=true]{background:var(--ink);color:#fff;box-shadow:inset 0 -4px var(--gold)}
.vr-choice-columns legend,.vr-choice__body strong{font-family:'Courier New',monospace}
.vr-choice{border-radius:0;box-shadow:none}
.vr-choice:hover{box-shadow:none;border-color:var(--ink)}
.vr-choice[aria-pressed=true]{border-color:var(--ink);box-shadow:4px 4px 0 #afcdb7}
.vr-choice__body small{color:#596071}
.vr-results{background:#fafafa}
.vr-routine,.vr-product,.vr-tips__grid p,.vr-body__choices button,.vr-foundations__grid article{border-radius:0;box-shadow:none}
.vr-routine__head{background:#fff;border-left:8px solid var(--gold);border-bottom:1px solid var(--line)}
.vr-routine[data-routine=soothe] .vr-routine__head{border-left-color:#afcdb7}
.vr-routine__head>span{color:var(--ink);font-family:'Courier New',monospace}
.vr-routine__head h3{font-size:clamp(33px,3.7vw,53px)}
.vr-routine__head p,.vr-product p,.vr-foundations__grid p{color:#596071}
.vr-product__image{background:#fff;border-radius:0;width:145px;min-width:145px;height:160px}
.vr-product__image span{color:var(--gold)}
.vr-product h4{font-size:15px}
.vr-product__bottom a{text-decoration-color:var(--gold);text-decoration-thickness:3px;text-underline-offset:3px;font-family:'Courier New',monospace}
.vr-gold-note{background:#fff9da}
.vr-tips__grid p{background:#fff}
.vr-tips__grid p:before{content:'●';display:block;color:var(--gold);font-size:18px;line-height:1;margin-bottom:12px}
.vr-tips__grid p:nth-child(2):before{color:#afcdb7}
.vr-body{background:#fff}
.vr-body__choices button{background:#fff}
.vr-body__choices button[aria-pressed=true]{background:#fff;color:var(--ink);border:2px solid var(--ink);box-shadow:inset 0 -6px var(--gold)}
.vr-body__choices strong{font-family:'Courier New',monospace}
.vr-body__choices span{color:#a48200}
.vr-body__tip{background:#edf5ee;border-color:#afcdb7}
.vr-foundations{background:#f6f8f6}
.vr-foundations__grid article{background:#fff}
.vr-foundations__grid span{color:#a48200;font-family:'Courier New',monospace;font-weight:700}
.vr-philosophy{background:#fff;color:var(--ink);border-top:10px solid var(--gold)}
.vr-philosophy .vr-kicker,.vr-philosophy small{color:var(--ink)}
.vr-philosophy em{background:linear-gradient(transparent 67%,#afcdb7 67%)}
.vr-philosophy p{color:#596071}
.vr-philosophy strong{font-style:normal;font-family:'Courier New',monospace;font-weight:700}
@media(max-width:900px){.vr-hero{grid-template-columns:1fr 1fr;min-height:430px}.vr-hero__copy{padding:35px}.vr-hero__art{min-height:0}}
@media(max-width:680px){.vr-hero{grid-template-columns:1fr}.vr-hero__copy{padding:45px 24px 15px}.vr-hero__art{display:grid;padding:0 25px 15px}.vr-hero__art img{max-height:320px}.vr-product__image{width:105px;min-width:105px;height:135px}}

/* Theme-resistant card sizing and wrapping. The quiz may live in a narrow theme column. */
.vr { container: viktoria-ritual / inline-size; min-width: 0; width: 100%; }
.vr .vr-choice-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); min-width: 0; }
.vr .vr-choice-columns fieldset,
.vr .vr-choice-grid,
.vr .vr-product,
.vr .vr-product__copy { min-width: 0; }
.vr .vr-choice-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.vr .vr-choice {
  display: flex !important;
  flex-direction: column;
  width: 100% !important;
  min-width: 0;
  max-width: 100%;
  height: 100%;
  padding: 0 !important;
  margin: 0 !important;
  border: 1px solid var(--line) !important;
  border-radius: 0 !important;
  background: #fff !important;
  color: var(--ink) !important;
  text-align: left !important;
  white-space: normal !important;
  overflow: hidden;
}
.vr .vr-choice[aria-pressed="true"] { border: 2px solid var(--ink) !important; box-shadow: 4px 4px 0 #afcdb7; }
.vr .vr-choice__photo {
  display: block !important;
  flex: none;
  width: 100%;
  aspect-ratio: 1 / 1;
  background-size: 300% auto;
  background-repeat: no-repeat;
}
.vr .vr-choice__photo--custom { background-size: cover; background-position: center; }
.vr .vr-choice__body {
  display: block !important;
  flex: 1;
  width: 100%;
  min-width: 0;
  padding: 14px !important;
  white-space: normal !important;
  text-align: left !important;
}
.vr .vr-choice__body strong,
.vr .vr-choice__body small {
  display: block;
  width: 100%;
  color: var(--ink) !important;
  white-space: normal !important;
  overflow-wrap: anywhere;
  word-break: normal;
  hyphens: auto;
}
.vr .vr-choice__body strong { font-size: clamp(11px, 1.05vw, 14px); line-height: 1.3; }
.vr .vr-choice__body small { color: #596071 !important; font-size: 12px; line-height: 1.4; }
.vr .vr-body__choices button { white-space: normal !important; overflow-wrap: anywhere; }
.vr .vr-product h4,
.vr .vr-routine__head h3,
.vr .vr-section__intro h2,
.vr .vr-hero h1 { overflow-wrap: anywhere; }
.vr .vr-products { grid-template-columns: repeat(2, minmax(0, 1fr)); }

@container viktoria-ritual (max-width: 1050px) {
  .vr-choice-columns { grid-template-columns: 1fr !important; }
  .vr-choice__body strong { font-size: 14px !important; }
}
@container viktoria-ritual (max-width: 760px) {
  .vr-hero { grid-template-columns: 1fr; }
  .vr-hero__copy { padding: 42px 30px 10px; }
  .vr-hero__art { display: grid; padding: 0 30px 15px; }
  .vr-hero__art img { max-height: 360px; }
  .vr-products, .vr-tips__grid, .vr-foundations__grid { grid-template-columns: 1fr !important; }
  .vr-body__choices { grid-template-columns: 1fr; }
  .vr-progress span { padding: 10px 6px; text-align: center; }
  .vr-progress b { font-size: 11px; }
}
@container viktoria-ritual (max-width: 600px) {
  .vr-choice-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .vr-choice__body { padding: 11px !important; }
  .vr-ages { margin-left: 0; }
  .vr-ages button { flex: 1 1 28%; min-width: 0; }
  .vr-product__image { width: 105px; min-width: 105px; height: 135px; }
}
@container viktoria-ritual (max-width: 390px) {
  .vr-choice-grid { grid-template-columns: 1fr !important; }
  .vr-choice { display: grid !important; grid-template-columns: 115px minmax(0, 1fr); }
  .vr-choice__photo { height: 100%; aspect-ratio: auto; }
  .vr-progress b { font-size: 9px; }
  .vr-product { gap: 10px; }
  .vr-product__image { width: 80px; min-width: 80px; }
}