
/* iCalm — editorial secondary pages and commerce. Loaded after base theme CSS. */
#magnesium-hero,#about-hero{background:var(--bg)}
#magnesium-hero .hero-inner,#about-hero .hero-inner{min-height:0;padding-block:clamp(3rem,5.5vw,5.8rem);gap:clamp(2rem,6vw,6rem)}
#magnesium-hero .hero-content h1,#about-hero .hero-content h1{font-size:clamp(2.9rem,5.1vw,5.3rem);line-height:1.06;max-width:13ch}
#magnesium-hero .hero-product-visual,#about-hero .hero-product-visual{max-width:560px;min-height:0;border:0;padding:0;background:transparent;box-shadow:none}
#magnesium-hero .hero-product-photo,#about-hero .hero-product-photo{margin:0;padding:0}
#magnesium-hero .hero-product-photo .theme-photo,#about-hero .hero-product-photo .theme-photo{aspect-ratio:4/4.5;height:auto;max-height:none;border-radius:2px}
#magnesium-hero .hero-product-photo img,#about-hero .hero-product-photo img{object-fit:cover;height:100%;max-height:none;border-radius:2px}
#magnesium-overview .prose,#about-approach .prose{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(1.8rem,6vw,6rem);align-items:center;max-width:1200px}
#magnesium-overview h2,#about-approach h2{margin:0;max-width:17ch}
#magnesium-overview p,#about-approach p{margin:0;font-size:1rem;line-height:1.86}
#magnesium-comparison .container,#guide-comparison .container{max-width:1160px}
#magnesium-comparison .comparison-scroll,#guide-comparison .comparison-scroll{box-shadow:0 10px 34px rgba(16,38,56,.035)}
#guide-intro,#faq-intro,#ordering-intro,#contacts-intro{border-bottom:1px solid var(--line);padding-block:clamp(3.7rem,7vw,7rem)}
#guide-intro .prose,#faq-intro .prose,#ordering-intro .prose,#contacts-intro .prose{display:grid;max-width:1180px;grid-template-columns:minmax(0,1fr) minmax(0,.83fr);gap:clamp(1.7rem,6vw,6rem);align-items:center}
#guide-intro h1,#faq-intro h1,#ordering-intro h1,#contacts-intro h1{font-size:clamp(3rem,5.4vw,5.5rem);line-height:1.05;letter-spacing:-.052em;margin:0;max-width:14ch}
#guide-intro p,#faq-intro p,#ordering-intro p,#contacts-intro p{font-size:clamp(1.02rem,1.4vw,1.18rem);line-height:1.82;color:var(--muted);margin:0;max-width:46ch}
#faq-product .container,#faq-store .container,#ordering-note .container,#contacts-questions .container{max-width:980px}
#faq-product h2,#faq-store h2,#ordering-note h2{max-width:20ch}
#faq-product .ui-accordion,#faq-store .ui-accordion,#ordering-note .ui-accordion{padding-block:1.1rem}
#faq-product .ui-accordion summary,#faq-store .ui-accordion summary,#ordering-note .ui-accordion summary{font-size:1.04rem}
#ordering-steps .block-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.8rem 3rem}
#ordering-steps .block-steps li{padding-top:1.7rem}
#about-values .feature-card{padding:1.8rem;border:1px solid var(--line);border-radius:8px;background:var(--panel)}
#about-values .feature-grid{align-items:stretch}
#about-values .feature-card h3{font-size:clamp(1.15rem,1.7vw,1.5rem)}
#contacts-intro .prose{align-items:start;row-gap:1.4rem}
#contacts-intro h1{grid-row:span 2}
.contact-email-link{grid-column:2;display:inline-flex;justify-content:space-between;gap:1.5rem;align-items:center;width:fit-content;max-width:100%;padding:.75rem 0;border-bottom:2px solid var(--accent);color:var(--ink);font-size:clamp(1.25rem,2.3vw,2rem);font-weight:550;text-decoration:none;letter-spacing:-.03em;overflow-wrap:anywhere}
.contact-email-link:hover{color:var(--accent);text-decoration:none}
.catalog-page .eyebrow{color:var(--accent)}
.catalog-page>.container>h1{max-width:19ch}
.catalog-page>.container>.lead{max-width:66ch}
.catalog-fact-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.2rem,3vw,3rem);margin:2.8rem 0 .6rem;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:1.35rem 0}
.catalog-fact-strip>div{display:flex;flex-direction:column;gap:.3rem;min-width:0}
.catalog-fact-strip span{letter-spacing:.1em;font-size:.7rem;color:var(--accent)}
.catalog-fact-strip strong{font-weight:600;font-size:1.02rem}
.catalog-fact-strip small{color:var(--muted);line-height:1.6;font-size:.85rem}
.catalog-showcase-intro{margin-top:1.5rem}
.catalog-under-grid{display:flex;flex-wrap:wrap;align-items:start;justify-content:space-between;gap:1rem 2.5rem;margin-top:2rem;border-top:1px solid var(--line);padding-top:1.2rem}
.catalog-under-grid .showcase-note{padding:0;margin:0;border:0;max-width:64ch}
.catalog-under-grid .text-link{flex-shrink:0;font-size:.875rem}
.checkout-cart-page,.checkout-page{padding-top:clamp(2.7rem,5vw,5rem)}
.checkout-cart-page .commerce-heading,.checkout-page .commerce-heading{margin-bottom:2rem}
.commerce-heading .eyebrow{display:block;margin-bottom:.65rem;color:var(--accent)}
.commerce-heading h1{max-width:17ch;font-size:clamp(2.7rem,5.2vw,5rem)}
.order-panel,.checkout-summary{border-radius:9px}
.cart-order-media{border-radius:5px}
.cart-preview-notice{border-left-width:2px}
.checkout-primary .checkout-form,.checkout-demo-form{gap:1rem}
.checkout-primary .checkout-form>p,.checkout-demo-form>p{margin-top:-.25rem;color:var(--muted)}
.checkout-process{padding:2rem 0 0;margin-top:2rem;border-top:1px solid var(--line)}
.checkout-process h2{font:400 clamp(1.65rem,2.3vw,2.2rem)/1.2 var(--serif);margin:0 0 1.5rem}
.checkout-process ol{list-style:none;padding:0;margin:0;display:grid;gap:1rem;counter-reset:step}
.checkout-process li{display:grid;grid-template-columns:30px minmax(0,1fr);gap:0 .9rem;align-items:start;counter-increment:step}
.checkout-process li::before{content:counter(step,decimal-leading-zero);border:1px solid var(--line);color:var(--accent);width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-size:.65rem;grid-row:span 2}
.checkout-process li strong{font-size:.91rem;font-weight:600}
.checkout-process li span{font-size:.85rem;line-height:1.65;color:var(--muted)}
.checkout-process>.quiet{margin-top:1.1rem}
.order-success-page .container{max-width:950px}
.success-receipt{margin:clamp(1.7rem,4vw,3.5rem) 0;border:1px solid var(--line);border-radius:12px;padding:clamp(1.5rem,5vw,4rem);background:var(--panel)}
.success-receipt-icon{display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;width:52px;height:52px;background:var(--soft);color:var(--accent);margin-bottom:2rem;font-size:1.4rem}
.success-receipt h1{max-width:16ch}
.success-receipt>.lead{color:var(--muted)}
.success-reference{display:flex;align-items:center;justify-content:space-between;gap:1.4rem;flex-wrap:wrap;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:1.4rem 0;margin:2rem 0}
.success-reference span{font-size:.85rem;color:var(--muted)}
.success-reference strong{font-variant-numeric:tabular-nums;letter-spacing:.06em;font-size:1.1rem;overflow-wrap:anywhere}
.success-receipt h2{font:400 1.65rem/1.3 var(--serif);margin:0 0 .75rem}
.success-receipt>p:not(.lead):not(.eyebrow){color:var(--muted);font-size:.94rem;line-height:1.75}
.success-actions{display:flex;gap:.9rem;flex-wrap:wrap;margin-top:1.75rem}
@media(max-width:1000px) and (min-width:761px){#magnesium-hero .hero-inner,#about-hero .hero-inner{gap:2rem}#guide-intro .prose,#faq-intro .prose,#ordering-intro .prose,#contacts-intro .prose{gap:2rem}}
@media(max-width:760px){
 #magnesium-hero .hero-content h1,#about-hero .hero-content h1{font-size:clamp(2.6rem,9vw,3.5rem)}
 #magnesium-hero .hero-inner,#about-hero .hero-inner{padding-block:2.5rem;gap:1.4rem}
 #magnesium-hero .hero-product-photo .theme-photo,#about-hero .hero-product-photo .theme-photo{height:auto;aspect-ratio:4/4;max-height:none}
 #magnesium-hero .hero-product-photo img,#about-hero .hero-product-photo img{max-height:none!important;width:100%;height:100%}
 #magnesium-overview .prose,#about-approach .prose{grid-template-columns:1fr;gap:1.1rem}
 #guide-intro .prose,#faq-intro .prose,#ordering-intro .prose,#contacts-intro .prose{grid-template-columns:1fr;gap:1.2rem}
 #guide-intro h1,#faq-intro h1,#ordering-intro h1,#contacts-intro h1{font-size:clamp(2.7rem,9vw,3.8rem)}
 #guide-intro,#faq-intro,#ordering-intro,#contacts-intro{padding-block:3.4rem}
 #contacts-intro h1{grid-row:auto}
 .contact-email-link{grid-column:1;font-size:clamp(1.4rem,5.6vw,2rem)}
 #ordering-steps .block-steps{grid-template-columns:1fr;gap:1.2rem}
 .catalog-fact-strip{gap:.8rem 1.2rem;margin-top:2rem}
 .catalog-under-grid .text-link{flex-shrink:1}
 .checkout-process{margin-top:1.4rem;padding-top:1.5rem}
 .success-actions .button{width:100%}
}
@media(max-width:480px){.catalog-fact-strip{grid-template-columns:1fr 1fr}.catalog-fact-strip>div:last-child{grid-column:1/-1}.catalog-showcase-intro h2{font-size:clamp(1.8rem,7.4vw,2.25rem)}#magnesium-hero .hero-product-photo .theme-photo,#about-hero .hero-product-photo .theme-photo{aspect-ratio:4/4.5}}


/* Storefront mobile: a full-width, legible item per row. */
@media (max-width:760px) {
  .product-grid,
  .product-grid.product-preview-grid,
  .product-preview-grid,
  #home-products .product-preview-grid,
  #magnesium-products .product-preview-grid,
  .catalog-page .product-preview-grid {
    display:grid;
    grid-template-columns:minmax(0,1fr);
    gap:1.35rem;
    align-items:stretch;
  }
  .product-preview-card,
  .product-card {
    width:100%;
    max-width:540px;
    min-width:0;
    justify-self:center;
  }
  .product-preview-card .product-preview-media {
    width:100%;
    aspect-ratio:5/5.3;
  }
  .product-preview-card .product-info {
    padding:1.25rem 1.4rem 1.4rem;
  }
  .product-preview-card .product-card-eyebrow {
    display:block;
    font-size:.7rem;
    letter-spacing:.075em;
  }
  .product-preview-card h3 {font-size:clamp(1.35rem,4.5vw,1.7rem)}
  .product-preview-card .product-preview-description {font-size:.93rem}
  .product-preview-card .product-preview-price {font-size:1.65rem}
  .product-preview-buy-form .button {min-height:50px}
}
@media(max-width:390px){
  .product-preview-card .product-info {padding:1.1rem 1.2rem 1.3rem}
}

/* Historical NatMag package editorial: authoritative product identity without sales claims. */
.variant-editorial-page{padding-block:clamp(2.6rem,5vw,5rem)}
.variant-editorial-page .container{max-width:1200px}
.variant-editorial-layout{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);align-items:center;gap:clamp(2rem,5vw,5rem);margin-top:1.3rem}
.variant-editorial-photo{margin:0;max-width:600px;min-width:0}
.variant-editorial-photo picture,.variant-editorial-photo img{width:100%;display:block;border-radius:2px}
.variant-editorial-photo img{aspect-ratio:4/5;object-fit:cover}
.variant-editorial-copy h1{font-size:clamp(2.9rem,4.7vw,5.1rem);line-height:1.05;letter-spacing:-.05em;max-width:16ch}
.variant-editorial-copy>.lead{font-size:clamp(1rem,1.3vw,1.15rem);line-height:1.75;max-width:48ch}
.variant-facts{margin:1.8rem 0;border-block:1px solid var(--line)}
.variant-facts div{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:1rem;padding:1rem 0;border-bottom:1px solid var(--line)}
.variant-facts div:last-child{border-bottom:0}
.variant-facts dt{font-size:.82rem;color:var(--muted)}
.variant-facts dd{margin:0;font-size:.91rem;font-weight:550}
.variant-editorial-actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.4rem}
.variant-editorial-note{margin-top:1.15rem;color:var(--muted);font-size:.82rem;line-height:1.7}
.product-preview-detail-link{font-size:.85rem;display:inline-flex;justify-content:space-between;align-items:center;gap:.5rem;min-height:40px;margin:.1rem 0 .4rem;text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:4px;color:var(--ink)}
.product-preview-detail-link:hover{color:var(--accent)}
@media(max-width:760px){.variant-editorial-layout{grid-template-columns:minmax(0,1fr);gap:1.4rem}.variant-editorial-photo{max-width:540px}.variant-editorial-copy h1{font-size:clamp(2.5rem,9vw,3.5rem)}.variant-editorial-actions .button{flex:1 1 auto;justify-content:center}}
