/* Apple Design refinements: instant feedback, measured hierarchy, and accessible materials. */
:root{
  --apple-settle:cubic-bezier(.22,.75,.24,1);
  --apple-press:cubic-bezier(.2,.85,.25,1);
}
body{
  font-optical-sizing:auto;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{
  font-optical-sizing:auto;
  text-wrap:balance;
}
#home h1,.section-head h2,.physical-page h1,.price-card h2,.faq h2{
  letter-spacing:-.035em;
}
.hero-copy>p,.section-desc,.feature p,.step p,.faq details p{
  line-height:1.72;
}
header{
  background:linear-gradient(180deg,rgba(17,7,14,.9),rgba(17,7,14,.74));
  -webkit-backdrop-filter:blur(22px) saturate(145%);
  backdrop-filter:blur(22px) saturate(145%);
  box-shadow:0 1px 0 rgba(255,221,237,.08),0 14px 34px rgba(0,0,0,.14);
}
.nav nav a,.btn,.filter,.arrow,.bag-button,.segmented button,.format-switch,.tile,.physical-product,.swatches button,.promo-card{
  transition-timing-function:var(--apple-settle);
}
.nav nav a:focus-visible,.btn:focus-visible,button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{
  outline:2px solid #ffd4e5;
  outline-offset:3px;
}
.btn{
  transition:transform .34s var(--apple-settle),box-shadow .34s var(--apple-settle),filter .2s ease,background-color .25s ease;
}
.btn:active,.arrow:active,.filter:active,.bag-button:active,.segmented button:active,.format-switch:active,.text-link:active{
  transform:scale(.975);
  filter:brightness(1.08);
  transition-duration:110ms;
}
.btn.primary:active{box-shadow:inset 0 2px 8px rgba(45,5,25,.25),0 3px 12px rgba(233,75,139,.2)}
.tile,.physical-product{
  transition:transform .38s var(--apple-settle),border-color .3s ease,box-shadow .38s var(--apple-settle),background-color .3s ease;
}
.tile:active,.physical-product:active{transform:scale(.985)}
.swatches button{
  transition:transform .36s var(--apple-settle),box-shadow .36s var(--apple-settle),border-color .25s ease;
  scroll-snap-stop:always;
}
.hero-showcase .device{
  transition:filter .38s ease;
  will-change:transform;
}
.hero-showcase .device-float{animation-duration:8.4s}
.hero-showcase .selected-card{
  transition:transform .42s var(--apple-settle),filter .38s ease,box-shadow .38s ease;
}
.segmented,.tile,.filter:not(.active),.format-switch{
  -webkit-backdrop-filter:blur(14px) saturate(135%);
  backdrop-filter:blur(14px) saturate(135%);
}
.segmented{box-shadow:0 12px 34px rgba(0,0,0,.22),inset 0 1px rgba(255,255,255,.08)}
.tile:hover,.physical-product:hover{box-shadow:0 18px 38px rgba(0,0,0,.26),0 0 0 1px rgba(244,117,168,.18)}
.promo-card{transition:transform .5s var(--apple-settle),box-shadow .45s var(--apple-settle)}
@media(prefers-reduced-motion:reduce){
  .btn,.tile,.physical-product,.swatches button,.promo-card,.hero-showcase .device,.hero-showcase .selected-card{
    transition-duration:.01ms!important;
    animation:none!important;
    will-change:auto;
  }
  .btn:active,.arrow:active,.filter:active,.bag-button:active,.segmented button:active,.format-switch:active,.text-link:active,
  .tile:active,.physical-product:active{transform:none}
}
@media(prefers-reduced-transparency:reduce){
  header{background:#170a13;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:0 1px 0 #ffffff35}
  .segmented{background:#1c0b15;backdrop-filter:none;-webkit-backdrop-filter:none}
  .tile,.filter:not(.active),.format-switch{background:#24101d;backdrop-filter:none;-webkit-backdrop-filter:none}
}
@media(prefers-contrast:more){
  .nav nav a,.tile,.physical-product,.segmented,.filter,.format-switch{border-color:#f7c5dc88}
  .hero-copy>p,.section-desc,.feature p,.step p,.faq details p,.small-copy{color:#f2dce7}
  .btn:focus-visible,button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline-color:#fff;outline-width:3px}
}
.nav nav a:active,.tile button:active,.swatches button:active{transform:scale(.975);opacity:.86;transition-duration:110ms}
@media(prefers-reduced-motion:reduce){.nav nav a:active,.tile button:active,.swatches button:active{transform:none}}

/* Legibility pass: consistent system typography, calmer metadata, and aligned prices. */
body,
button,
input,
select,
textarea {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-optical-sizing: auto;
}
body { font-size: 15px; line-height: 1.55; }
#home .hero-copy > p,
.section-desc,
.feature p,
.step p,
.faq details p,
.physical-intro > p,
.physical-delivery > div > p,
.delivery-faq details p,
.physical-promo p,
.price-card p,
.checkout-copy,
.legal,
.small-copy,
.tiny,
.trust,
.showcase-order p,
.physical-order-art > p,
.form-note,
.notice {
  line-height: 1.65;
}
.tiny,
.small-copy,
.legal,
.showcase-order p,
.trust,
.physical-benefits small,
.product-category,
.physical-tag,
.showroom-caption,
.showroom-note,
.delivery-faq summary,
.delivery-faq details p,
.physical-order-info label,
.physical-order-info label span,
.order-breakdown > div,
.order-breakdown > p,
.physical-order-art > p,
.physical-preview-meta,
.upload-field small,
.form-note,
.form-status,
.notice,
.price-card .notice,
.tile small,
.tile strong,
.hero-proof,
.hero-proof small,
.physical-promo .small-copy,
#home .hero-meta small {
  font-size: 12px;
  line-height: 1.55;
}
.tile strong,
.product-category,
.physical-tag,
.showroom-caption,
.showroom-note {
  letter-spacing: .025em;
}
.hero-proof,
.hero-proof small,
.legal,
.small-copy,
.tiny,
.trust,
.product-category,
.physical-tag,
.showroom-caption,
.showroom-note,
.physical-benefits small,
.order-breakdown > p,
.form-note,
.notice {
  color: #e0cbd6;
}
.price,
.physical-promo-price,
.physical-hero-price,
.product-info .product-price,
.order-price,
.order-breakdown strong,
.physical-preview-meta strong,
#skinSubtotal,
.hero-meta b {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-variant-numeric: tabular-nums lining-nums;
  font-feature-settings: "tnum" 1, "lnum" 1;
  font-weight: 680;
  letter-spacing: -.035em;
}
.price { font-size: clamp(48px, 6vw, 70px); line-height: 1.05; }
.price small { font: 500 14px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; letter-spacing: 0; }
.product-info .product-price { font-size: 21px; line-height: 1.3; }
.product-info .product-price span { font-size: 12px; font-weight: 450; }
.physical-order-info label,
.physical-order-info label span { font-size: 12px; }
.order-breakdown > div,
.order-breakdown > div:nth-child(2),
.order-breakdown > p { font-size: 12px; }
.product-info .btn,
.physical-order-info .btn { font-size: 13px; }
.physical-benefits strong { font-size: 13px; line-height: 1.5; }
.physical-benefits small { display: block; margin-top: 4px; }
.showroom-caption,
.showroom-note { font-size: 12px; line-height: 1.5; letter-spacing: .04em; }
.physical-preview-meta { font-size: 12px; }
.upload-field small,
.form-status,
.physical-order-info .form-status { font-size: 12px; }
.order-price { font-size: 24px; line-height: 1.35; }
.order-price span { font-size: 13px; font-weight: 450; letter-spacing: 0; }
@media (max-width: 760px) {
  .physical-intro > p:not(.small-copy),
  .physical-delivery > div > p,
  .physical-catalog .section-desc,
  .physical-steps .step p,
  .delivery-faq summary,
  .delivery-faq details p,
  .physical-benefits strong,
  .physical-benefits small,
  .physical-promo .small-copy,
  .product-info .product-price span,
  .product-info .btn,
  .physical-order-info label,
  .physical-order-info label span,
  .order-breakdown > div,
  .order-breakdown > div:nth-child(2),
  .order-breakdown > p,
  .physical-order-info .form-status,
  .showroom-caption,
  .showroom-note,
  .physical-preview-meta,
  .physical-order-art > p {
    font-size: 12px;
    line-height: 1.55;
  }
  .physical-page .nav nav { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
}
@media (prefers-contrast: more) {
  .tiny,.small-copy,.legal,.trust,.product-category,.physical-tag,.showroom-caption,.showroom-note,
  .physical-benefits small,.order-breakdown > p,.form-note,.notice { color: #fff0f7; }
}

.order-details label,
.order-details label span,
.upload-header button,
.upload-field small,
.order-preview .preview-toggle,
.order-preview .preview-caption,
.order-preview .simulation-note,
.order-price span,
.form-note,
.form-status {
  font-size: 12px;
  line-height: 1.55;
}
.order-details label,
.order-details label span { color: #efd9e4; }
.upload-header button { color: #f4b8d2; }
.order-preview .simulation-note { color: #d2b8c5; }
@media (max-width: 900px) {
  body.physical-page .nav {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto auto;
    height: auto;
    min-height: 0;
    gap: 10px 12px;
    padding-top: 12px;
    padding-bottom: 12px;
  }
  body.physical-page .nav .brand { grid-column: 1; grid-row: 1; min-width: 0; }
  body.physical-page .nav .nav-order { grid-column: 2; grid-row: 1; min-width: 0; white-space: nowrap; }
  body.physical-page .nav nav {
    grid-column: 1 / -1;
    grid-row: 2;
    display: flex;
    justify-content: flex-start;
    min-width: 0;
    gap: 5px;
    overflow-x: auto;
    padding: 0 0 2px;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  body.physical-page .nav nav::-webkit-scrollbar { display: none; }
  body.physical-page .nav nav a { flex: 0 0 auto; font-size: 12px; white-space: nowrap; }
}
@media (max-width: 420px) {
  body.physical-page .nav .brand { font-size: 21px; gap: 8px; }
  body.physical-page .nav .brand-logo { width: 44px; height: 44px; }
  body.physical-page .nav .nav-order { padding: 12px 13px; font-size: 12px; }
}
