

@media (min-width: 961px) { .ph--pricing .ph__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.pr-stacks { display: grid; gap: var(--s5); margin: 0; view-timeline: --lift block; }
.pr-stacks__row { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--s3); align-items: end; }
.stk { display: grid; justify-items: center; align-content: end; gap: 0.15rem; text-align: center; }
.stk__svg { width: min(100%, 6.25rem); height: auto; margin-bottom: var(--s3); }
.stk .price { position: relative; font-size: var(--t-base); line-height: 1.15; white-space: nowrap; }
.stk small, .pt__price small { font-size: 0.66em; font-weight: 500; color: var(--fg-soft); letter-spacing: 0.02em; }

.stk small { position: absolute; left: 50%; bottom: 100%; transform: translateX(-50%); line-height: 1.2; }
.pr-stacks__pg { font-family: var(--f-display); font-weight: 500; font-size: var(--t-xs); color: var(--fg-soft); letter-spacing: 0.04em; }
.pr-stacks__cap { justify-self: center; text-align: center; }
@media (max-width: 560px) {
  .pr-stacks__row { gap: var(--s2); }
  .stk .price { font-size: var(--t-sm); }
}

.pt-plate { padding: 0; }

.pt-plate .tablewrap { position: relative; }
.pt-plate .tablewrap:focus-visible { outline-offset: -3px; }
.pt-hint { display: none; }
.pt { width: 100%; min-width: 50rem; border-collapse: separate; border-spacing: 0; font-size: var(--t-sm); line-height: 1.45; }
.pt th, .pt td { padding: 0.85rem 1rem; text-align: left; vertical-align: middle; border-bottom: 1px solid var(--rule); }
.pt tbody:last-child tr:last-child > * { border-bottom: 0; }
.pt thead th { vertical-align: bottom; padding-top: 1.5rem; padding-bottom: 1.15rem; font-weight: 400; }
.pt__corner, .pt th[scope="row"] { position: sticky; left: 0; z-index: 1; background: var(--plate); }
.pt th[scope="row"] { width: 13.5rem; font-family: var(--f-text); font-weight: 500; color: inherit; }
.pt__name { display: block; font-family: var(--f-display); font-weight: 600; font-size: var(--t-lg); line-height: 1.1; letter-spacing: var(--track-snug); }
.pt__flag { display: block; margin-top: 0.3rem; font-size: var(--t-xs); font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; color: var(--accent); }
.pt__price { display: block; margin-top: 0.55rem; font-size: var(--t-xl); line-height: 1.05; white-space: nowrap; }
.pt__meta { display: block; margin-top: 0.3rem; font-family: var(--f-display); font-size: var(--t-xs); letter-spacing: 0.03em; color: var(--fg-soft); }
col.is-pick { background: color-mix(in oklab, var(--accent) 5%, transparent); }
.pt thead th.is-pick { box-shadow: inset 0 2px 0 var(--accent); }
.pt__group th {
  padding-top: 1.75rem; padding-bottom: 0.6rem;
  font-family: var(--f-display); font-weight: 500; font-size: var(--t-xs);
  letter-spacing: 0.08em; text-transform: uppercase; color: var(--accent);
  border-bottom-color: var(--teal-hair);
}
.pt__num td { font-family: var(--f-display); font-weight: 600; font-size: var(--t-base); font-variant-numeric: tabular-nums; }
@media (hover: hover) and (pointer: fine) {
  .pt tbody tr:not(.pt__group):hover > * { background-color: color-mix(in srgb, var(--plate) 93%, var(--fg)); }
}
@media (max-width: 820px) {
  .pt-hint { display: block; padding: var(--s4) var(--s4) 0; font-family: var(--f-display); font-size: var(--t-xs); letter-spacing: 0.03em; color: var(--fg-soft); }
  .pt th[scope="row"] { width: 9.5rem; min-width: 9.5rem; }
  .pt th, .pt td { padding: 0.75rem 0.8rem; }
}

.pt-after {
  display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: var(--s6); align-items: center; margin-top: var(--s6);
}
.custom { display: grid; gap: var(--s3); }
.custom__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--s2) var(--s4); }
.custom p { color: var(--fg-soft); max-width: 58ch; }
.custom .link { justify-self: start; }
.hedge { font-size: var(--t-sm); color: var(--fg-soft); max-width: 50ch; padding-left: var(--s5); border-left: 1px solid var(--rule); }
@media (max-width: 860px) {
  .pt-after { grid-template-columns: minmax(0, 1fr); }
  .hedge { padding-left: 0; border-left: 0; padding-top: var(--s4); border-top: 1px solid var(--rule); }
}

.ex { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.ex__head { margin-bottom: 0; }
.ex__plate { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.85fr); gap: var(--s6); align-items: center; }
.ex__pages { position: relative; display: grid; }
.ex__pages::before { content: ""; position: absolute; left: 1.8rem; top: 1.2rem; bottom: 1.2rem; border-left: 1px dashed var(--rule); }
.ex__pages li { position: relative; display: grid; grid-template-columns: 3.6rem 1.6rem minmax(0, 1fr); align-items: center; gap: var(--s3); padding-block: 0.55rem; }
.ex__plate-art { width: 3.6rem; height: auto; }
.ex__plate-art use { fill: var(--plate); }
.ex__n { font-size: var(--t-lg); text-align: right; }
.ex__t { font-family: var(--f-display); font-weight: 500; line-height: 1.25; }
.ex__sum { display: grid; gap: var(--s4); padding-left: var(--s5); border-left: 1px solid var(--rule); }
.ex__total { display: grid; gap: 0.2rem; justify-items: start; }
.ex__pkg { font-family: var(--f-display); font-weight: 600; font-size: var(--t-lg); line-height: 1.1; }
.ex__price { font-size: var(--t-2xl); line-height: 1; }
.ex__terms { color: var(--fg-soft); font-size: var(--t-sm); max-width: 34ch; }
@media (max-width: 960px) { .ex { grid-template-columns: minmax(0, 1fr); gap: var(--s5); } }
@media (max-width: 600px) {
  .ex__plate { grid-template-columns: minmax(0, 1fr); gap: var(--s4); }
  .ex__sum { padding-left: 0; border-left: 0; padding-top: var(--s4); border-top: 1px solid var(--rule); }
}

.est { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 0.7fr); gap: var(--s5); align-items: start; }
.est__in { display: grid; gap: var(--s6); }
.est__group { position: relative; min-width: 0; margin: 0; padding: 0; border: 0; }
.est__legend { padding: 0; margin-bottom: var(--s3); font-family: var(--f-display); font-weight: 600; font-size: var(--t-base); }
.est__price { display: inline-block; margin-left: 0.35em; font-family: var(--f-display); font-weight: 500; font-size: var(--t-sm); color: var(--fg-soft); font-variant-numeric: tabular-nums; }

.seg { position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--s2); }
.seg__in { position: absolute; left: 0; top: 0; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.seg__b {
  display: grid; place-items: center; min-height: 3.25rem;
  border: 1px solid var(--hair-strong); border-radius: var(--r-md); cursor: pointer;
  font-family: var(--f-display); font-weight: 600; font-size: var(--t-lg); font-variant-numeric: tabular-nums;
  transition: border-color var(--d-fast) var(--ease), background-color var(--d-fast) var(--ease), color var(--d-fast) var(--ease), transform var(--d-fast) var(--ease);
}
@media (hover: hover) and (pointer: fine) { .seg__b:hover { border-color: var(--accent); color: var(--accent); } }
.seg__b:active { transform: translateY(1px); }
.seg__in:checked + .seg__b { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.seg__in:focus-visible + .seg__b { outline: 2px solid var(--accent); outline-offset: 3px; }

.est__row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s3) var(--s5); }
.est__label { font-family: var(--f-display); font-weight: 600; }

.est__choices { display: grid; gap: var(--s2); }
.est__choices--list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.chk {
  position: relative; display: grid; grid-template-columns: 1.25rem minmax(0, 1fr); gap: var(--s3); align-items: start;
  padding: 0.7rem 0.85rem; border: 1px solid var(--hair); border-radius: var(--r-md); cursor: pointer;
  transition: border-color var(--d-fast) var(--ease), background-color var(--d-fast) var(--ease);
}
.chk input { position: absolute; left: 0.85rem; top: 0.85rem; width: 1px; height: 1px; opacity: 0; }
.chk__box {
  display: grid; place-items: center; width: 1.25rem; height: 1.25rem; margin-top: 0.12rem;
  border: 1px solid var(--hair-strong); border-radius: var(--r-sm);
  transition: background-color var(--d-fast) var(--ease), border-color var(--d-fast) var(--ease), transform var(--d-fast) var(--ease);
}
.chk input[type="radio"] + .chk__box { border-radius: 50%; }
.chk input:checked + .chk__box { background: var(--accent); border-color: var(--accent); }
.chk input[type="checkbox"]:checked + .chk__box::after {
  content: ""; width: 0.55rem; height: 0.3rem; border-left: 2px solid var(--accent-ink); border-bottom: 2px solid var(--accent-ink);
  transform: translateY(-1px) rotate(-45deg);
}
.chk input[type="radio"]:checked + .chk__box::after { content: ""; width: 0.45rem; height: 0.45rem; border-radius: 50%; background: var(--accent-ink); }
.chk input:focus-visible + .chk__box { outline: 2px solid var(--accent); outline-offset: 3px; }
.chk:has(input:checked) { border-color: var(--teal-hair); background: color-mix(in oklab, var(--accent) 6%, transparent); }
@media (hover: hover) and (pointer: fine) { .chk:hover { border-color: var(--hair-strong); } .chk:hover .chk__box { border-color: var(--accent); } }
.chk:active .chk__box { transform: scale(0.94); }
.chk__t { line-height: 1.4; }
.chk .est__price { display: block; margin: 0.1rem 0 0; }

.est__out { position: sticky; top: calc(var(--bar-h) + 1.25rem); display: grid; gap: var(--s3); justify-items: start; }
.est__k { font-family: var(--f-display); font-weight: 500; font-size: var(--t-xs); letter-spacing: var(--track-wide); text-transform: uppercase; color: var(--accent); }
.est__stack { width: min(100%, 8.5rem); justify-self: center; margin-block: var(--s2) 0; }

.est__stack use {
  opacity: 0; translate: 0 calc(var(--y, 0) * -1px);
  transition: opacity 240ms var(--ease), translate 320ms var(--ease);
}
.est__stack use.is-on { opacity: var(--o, 0.5); }
.est__stack use.crown { opacity: 1; }
.est__read { display: grid; gap: 0.15rem; }
.est__total { font-size: var(--t-3xl); line-height: 1; }
.est__sum { font-family: var(--f-display); font-weight: 500; color: var(--fg-soft); }
.est__month { font-size: var(--t-sm); color: var(--accent); }
.est__note { font-size: var(--t-sm); color: var(--fg-soft); max-width: 36ch; }
.est__cta { margin-top: var(--s2); }
.est__bar { display: none; }
@media (max-width: 900px) {
  
  html { scroll-padding-bottom: 5.5rem; }
  .est { grid-template-columns: minmax(0, 1fr); }
  .est__out { position: static; }
  .est__bar {
    position: sticky; bottom: 0.75rem; z-index: 3;
    display: flex; align-items: baseline; justify-content: space-between; gap: var(--s4);
    margin-top: calc(var(--s2) * -1); padding: 0.7rem 1rem;
    background: color-mix(in srgb, var(--g0) 94%, transparent); border: 1px solid var(--teal-hair); border-radius: var(--r-md);
    box-shadow: var(--e2); font-family: var(--f-display); font-weight: 500; color: var(--fg-soft);
  }
  .est__bar .price { font-size: var(--t-lg); color: var(--fg); }
}
@media (max-width: 640px) { .est__choices--list { grid-template-columns: minmax(0, 1fr); } }

.care { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 0.9fr); gap: var(--s4); align-items: stretch; }
.care__plan { display: grid; gap: var(--s3); align-content: start; }
.care__price { font-family: var(--f-display); color: var(--fg-soft); }
.care__price .price { margin-right: 0.15em; font-size: var(--t-2xl); line-height: 1; }
.care__what { color: var(--fg-soft); }
.care__stop { align-self: center; display: grid; gap: var(--s2); padding-left: var(--s5); border-left: 1px solid var(--rule); }
.care__stop p { color: var(--fg-soft); }
.care__free { margin-top: var(--s5); color: var(--fg-soft); max-width: 72ch; }
.care__free .ro { margin-right: 0.3em; }
.terms__h { margin-top: clamp(3rem, 6vw, 5rem); margin-bottom: var(--s4); }
@media (max-width: 960px) {
  .care { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .care__stop { grid-column: 1 / -1; padding: var(--s4) 0 0; border-left: 0; border-top: 1px solid var(--rule); }
}
@media (max-width: 600px) { .care { grid-template-columns: minmax(0, 1fr); } }

@media (prefers-reduced-motion: no-preference) {
  .stk__svg { animation: stk-in 900ms var(--ease) both; animation-delay: calc(var(--s) * 90ms + 120ms); }
}
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    
    .stk__svg use { animation: stk-lift linear both; animation-timeline: --lift; animation-range: cover 58% cover 100%; }
  }
}
@keyframes stk-in { from { transform: translateY(16px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes stk-lift { to { translate: 0 calc(var(--i, 0) * -2.2px); } }

@media (prefers-reduced-motion: reduce) {
  .stk__svg, .stk__svg use { animation: none !important; }
  .est__stack use { transition: none; }
  .seg__b:active, .chk:active .chk__box { transform: none; }
}
