/* Production logo treatment: preserve the selected folk artwork while giving
   the transparent mark enough breathing room in every placement. */
.brand-mark-full{
  width:82px;
  height:auto;
  box-sizing:border-box;
  padding:0;
  object-fit:contain;
  filter:drop-shadow(0 1px 0 rgba(21,20,17,.12));
}

.hero-talisman{
  width:500px;
  height:auto;
  right:0;
  top:8px;
  box-sizing:border-box;
  padding:20px 34px;
  object-fit:contain;
  transform:rotate(-1deg);
  filter:drop-shadow(7px 9px 0 rgba(21,20,17,.10));
}

.nav{min-height:100px}
.hero-copy{position:relative;z-index:2}
.hero h1{line-height:.82;letter-spacing:-.065em}
.trust-row{flex-wrap:wrap}

@media (min-width:1051px){
  .product-card,
  .product-large,
  .product-wide{grid-column:span 3}
  .product-image{height:540px}
}

/* Watermark containers keep their original layout role. */
.phone.preview-art{position:absolute}
.product-image.preview-art{position:relative}
.crop-card.preview-art{position:absolute}

@media (min-width:681px) and (max-width:1050px){
  .nav{min-height:96px;padding:12px 28px}
  .brand-mark-full{width:62px;height:auto}
  .hero{padding:132px 28px 68px;min-height:auto}
  .hero-copy{max-width:780px}
  .hero h1{font-size:clamp(68px,10.5vw,94px);line-height:.86;letter-spacing:-.06em}
  .hero-art{width:min(100%,760px);height:610px;margin:34px auto 0}
  .hero-talisman{width:440px;height:auto;right:0;top:0;padding:20px 34px}
  .phone-back{width:220px;right:255px;top:185px}
  .phone-front{width:255px;right:34px;top:215px}
  .section{padding-left:30px;padding-right:30px}
  .product-image{height:510px}
}

@media(max-width:680px){
  .nav{min-height:78px;padding:9px 16px}
  .brand-mark-full{width:54px;height:auto;padding:0}
  .hero{padding:96px 18px 48px;min-height:auto}
  .hero h1{font-size:clamp(54px,17vw,70px);line-height:.88;letter-spacing:-.055em;transform:none}
  .hero-kicker{margin-top:25px;line-height:1.08}
  .hero-intro{font-size:15px;line-height:1.6;margin:18px 0 26px}
  .hero-actions{gap:14px}
  .trust-row{gap:10px 16px;margin-top:28px}
  .hero-art{height:465px;margin-top:24px}
  .hero-talisman{width:315px;height:auto;right:-46px;top:8px;padding:16px 24px}
  .phone-front{width:185px;right:-4px;top:166px}
  .phone-back{width:154px;right:132px;top:158px}
  .seal-note{left:0;bottom:2px;font-size:12px}
  .product-image{height:480px}
}

/* Five Elements edition */
.quiz-link{display:inline-flex;flex-direction:column;gap:2px;color:var(--ink);text-decoration:none;font-weight:800;font-size:12px;border-bottom:2px solid var(--ink);padding:8px 0}.quiz-link span{font-family:var(--heavy);font-size:9px;color:var(--red);letter-spacing:.08em}.elements-intro{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);gap:72px;align-items:center;background:var(--cream);max-width:none;padding-left:max(42px,calc((100vw - 1296px)/2));padding-right:max(42px,calc((100vw - 1296px)/2));border-bottom:3px solid var(--ink)}.elements-title-block{max-width:720px}.elements-title-block h2,.element-quiz h2,.element-products h2{font-family:var(--display);font-size:clamp(48px,6vw,88px);line-height:.93;margin:0 0 28px;color:var(--red)}.elements-title-block>p:last-child{max-width:650px;font-size:18px;line-height:1.65;font-weight:600}.element-orbit{width:min(42vw,500px);aspect-ratio:1;justify-self:end;border:3px solid var(--ink);border-radius:50%;position:relative;background:var(--yellow);box-shadow:14px 14px 0 var(--red);transform:rotate(-2deg)}.orbit-core{position:absolute;inset:31%;display:grid;place-items:center;border:3px solid var(--ink);background:var(--cream);font-family:var(--display);font-size:clamp(46px,7vw,86px);color:var(--red)}.orbit-word{position:absolute;font-family:var(--heavy);font-size:12px;letter-spacing:.12em;background:var(--ink);color:var(--yellow);padding:9px 12px}.metal-word{top:7%;left:38%}.wood-word{top:28%;right:-4%}.water-word{bottom:15%;right:4%}.fire-word{bottom:10%;left:5%}.earth-word{top:28%;left:-4%}

.element-quiz{max-width:none;background:var(--yellow);display:grid;grid-template-columns:minmax(260px,.72fr) minmax(0,1.28fr);gap:70px;padding-left:max(42px,calc((100vw - 1296px)/2));padding-right:max(42px,calc((100vw - 1296px)/2));border-bottom:3px solid var(--ink)}.quiz-aside{position:sticky;top:40px;align-self:start}.quiz-aside>p{font-size:17px;line-height:1.6;font-weight:600}.quiz-note{margin-top:28px;border:2px solid var(--ink);background:var(--cream);padding:20px;font-size:13px;line-height:1.55;box-shadow:6px 6px 0 var(--red)}.quiz-card{background:var(--cream);border:3px solid var(--ink);padding:32px;box-shadow:12px 12px 0 var(--red);min-height:650px;display:flex;flex-direction:column}.quiz-progress{display:flex;align-items:center;gap:16px;font-family:var(--heavy);font-size:10px;letter-spacing:.08em;margin-bottom:34px}.quiz-progress-track{height:8px;flex:1;border:2px solid var(--ink);background:transparent}.quiz-progress-track i{display:block;height:100%;width:20%;background:var(--red);transition:width .25s ease}.quiz-step{border:0;padding:0;margin:0;display:none}.quiz-step.is-active{display:grid;gap:11px}.quiz-step legend{font-family:var(--heavy);font-size:clamp(22px,3vw,38px);line-height:1.15;margin-bottom:26px}.quiz-step label{display:block;cursor:pointer}.quiz-step input{position:absolute;opacity:0;pointer-events:none}.quiz-step label span{display:flex;flex-direction:column;gap:3px;border:2px solid var(--ink);padding:15px 17px;background:rgba(255,255,255,.28);transition:.15s}.quiz-step label b{font-size:15px}.quiz-step label small{font-size:12px;color:rgba(21,20,17,.7)}.quiz-step label:hover span,.quiz-step input:focus-visible+span{transform:translateX(4px);box-shadow:-4px 0 0 var(--gold)}.quiz-step input:checked+span{background:var(--ink);color:var(--yellow);box-shadow:5px 5px 0 var(--red);transform:translate(-2px,-2px)}.quiz-step input:checked+span small{color:var(--cream)}.quiz-controls{display:flex;align-items:center;gap:16px;margin-top:auto;padding-top:26px}.quiz-back{font:inherit;font-weight:800;border:0;background:none;border-bottom:2px solid var(--ink);padding:10px 0;cursor:pointer}.quiz-back:disabled{opacity:.35;cursor:not-allowed}.quiz-next{margin-left:auto;min-width:120px}.quiz-controls p{color:var(--red);font-size:12px;font-weight:800;margin:0}.quiz-result{margin:auto 0;text-align:center}.quiz-result[hidden]{display:none}.result-symbol{width:112px;height:112px;margin:8px auto 20px;display:grid;place-items:center;border:3px solid var(--ink);background:var(--yellow);box-shadow:7px 7px 0 var(--red);font-family:var(--display);font-size:60px;color:var(--red);transform:rotate(-3deg)}.quiz-result h3{font-family:var(--display);font-size:clamp(38px,5vw,62px);margin:0 0 18px;color:var(--red)}.quiz-result>p:not(.eyebrow){max-width:620px;margin:0 auto 24px;font-size:17px;line-height:1.6}.result-actions{display:flex;justify-content:center;align-items:center;gap:26px;margin:30px 0}.quiz-result>small{display:block;opacity:.7}

.element-products{max-width:none;background:var(--ink);color:var(--cream);padding-left:max(42px,calc((100vw - 1296px)/2));padding-right:max(42px,calc((100vw - 1296px)/2))}.element-products .section-heading>p{max-width:480px;line-height:1.6}.element-product-grid{display:grid;grid-template-columns:repeat(10,1fr);gap:18px}.element-product{grid-column:span 2;border:2px solid var(--cream);background:var(--paper);color:var(--ink);position:relative;transition:.2s}.element-product:hover{transform:translateY(-7px);box-shadow:8px 8px 0 var(--red)}.element-image{height:440px;overflow:hidden;border-bottom:2px solid var(--ink)}.element-image img{width:100%;height:100%;object-fit:cover}.element-image .preview-stamp{position:absolute;right:10px;bottom:10px;z-index:5;background:var(--ink);color:var(--cream);font-family:var(--heavy);font-size:8px;letter-spacing:.1em;padding:7px 9px}.element-card-copy{padding:22px;position:relative}.element-card-copy .element-glyph{position:absolute;right:18px;top:12px;font-family:var(--display);font-size:50px;color:var(--red);opacity:.32}.element-card-copy .eyebrow{margin-bottom:8px}.element-card-copy h3{font-family:var(--display);font-size:29px;color:var(--red);margin:0 0 8px}.element-card-copy>p:not(.eyebrow){min-height:42px;font-size:12px;font-weight:700}.element-card-copy>div:last-child{display:flex;justify-content:space-between;align-items:center;margin-top:18px;padding-top:14px;border-top:2px solid var(--ink)}.element-card-copy strong{font-family:var(--heavy);font-size:16px}.element-card-copy button{border:0;background:none;font:inherit;font-size:11px;font-weight:800;text-decoration:underline;cursor:pointer}.element-dialog{max-width:920px}.element-dialog-layout{display:grid;grid-template-columns:320px 1fr;gap:36px;align-items:center}.element-dialog-preview{height:520px;overflow:hidden;border:3px solid var(--ink);box-shadow:8px 8px 0 var(--red)}.element-dialog-preview img{width:100%;height:100%;object-fit:cover}.launch-note{background:var(--yellow);border:2px solid var(--ink);padding:13px;font-size:12px;font-weight:700}

@media(max-width:1050px){.nav-links{gap:16px}.elements-intro,.element-quiz{grid-template-columns:1fr;gap:40px}.element-orbit{justify-self:center;width:min(70vw,480px)}.quiz-aside{position:static}.element-product-grid{grid-template-columns:repeat(2,1fr)}.element-product{grid-column:auto}.element-product:last-child{grid-column:1/-1;max-width:50%;width:100%;justify-self:center}.element-image{height:560px}}
@media(max-width:680px){.nav-links{display:none}.quiz-link{width:100%;order:3}.hero-actions{flex-wrap:wrap}.elements-intro,.element-quiz,.element-products{padding:74px 18px}.elements-title-block h2,.element-quiz h2,.element-products h2{font-size:48px}.element-orbit{width:82vw;box-shadow:8px 8px 0 var(--red)}.orbit-word{font-size:9px}.quiz-card{padding:20px;min-height:620px;box-shadow:7px 7px 0 var(--red)}.quiz-step legend{font-size:24px}.quiz-controls{flex-wrap:wrap}.quiz-controls p{order:3;width:100%}.result-actions{flex-direction:column;gap:12px}.element-product-grid{grid-template-columns:1fr}.element-product,.element-product:last-child{grid-column:auto;max-width:none}.element-image{height:560px}.element-dialog-layout{grid-template-columns:1fr}.element-dialog-preview{height:430px}.element-dialog{padding:26px 18px}.elements-intro .eyebrow{margin-bottom:15px}}
.quiz-controls[hidden]{display:none}.element-image .preview-stamp{display:none}