/* Compact header and scrollable navigation shared by every page. */
:root{--gutter:clamp(16px,4.4vw,36px);--bar:calc(62px + env(safe-area-inset-top,0px))}
html{scroll-padding-top:calc(var(--bar) + 8px)}
.masthead,.catalog-shell .masthead{
  height:var(--bar);padding:env(safe-area-inset-top,0px) var(--gutter) 0;
  display:flex;align-items:center;gap:10px;background:#fffdf9;
}
.masthead.is-glass{background:rgb(255 253 248/.84)}
.hamburger,.wordmark,.tools{position:static;transform:none}
.hamburger{width:44px;height:44px;gap:6px;flex:none}
.hamburger span{width:28px;height:1.5px}.hamburger:hover span:last-child{width:23px}
.wordmark{width:clamp(84px,20vw,122px);height:44px;display:flex;align-items:center}
.tools{margin-left:auto;gap:0}
.icon{width:44px;height:44px;padding:4px}.icon .highlight{inset:4px;width:36px;height:36px}
.catalog-shell{height:var(--bar)}
.menu{width:min(360px,94vw);height:100dvh;max-height:100dvh;overflow-y:auto;background:#58442b;color:white;border-radius:0 16px 16px 0;padding:24px 22px max(24px,env(safe-area-inset-bottom));}
.menu-art{display:none}
.menu::before{content:"";display:block;width:116px;height:44px;background:url("assets/idyliya.svg") center/contain no-repeat}
.menu::backdrop{background:rgb(38 29 18/.35)}
.menu .reach{position:static;display:flex;align-items:center;width:auto;height:auto;min-height:46px}
.menu .menu-close{position:absolute;inset:21px 20px auto auto;width:44px;height:44px;min-height:44px;justify-content:center;background:#ffffff15}
.menu-close::after{content:"×";font-size:28px}
.menu nav{margin:28px 0 22px;border-top:1px solid #ffffff38}
.menu nav .reach{position:relative;inset:auto;padding:9px 0;border-bottom:1px solid #ffffff38;border-radius:0}
.menu nav .row-label{padding:0;font-size:clamp(24px,5.5vw,30px);line-height:1.18}
.menu nav .reach::after{content:"↗";right:3px;opacity:.7;transform:translateY(-50%);font-size:16px}
.menu-contact{display:inline;font-size:15px;color:#f3e8d6}
.menu nav:has(.reach:is(:hover,:focus-visible)) .reach:not(:is(:hover,:focus-visible)) .row-label{opacity:1;filter:none}

/* Hero artwork gets its own frame so the heading and actions stay legible. */
.composition{--u:1px;aspect-ratio:auto;padding:calc(var(--bar) + 22px) var(--gutter) 24px;display:grid;grid-template-areas:"title" "art" "intro" "action" "benefits";gap:18px}
.hero h1,.intro,.choose,.benefits{position:static}
.hero h1{grid-area:title;font-size:clamp(31px,7.3vw,54px);line-height:1.06;letter-spacing:-.035em;color:#635f58}
.hero h1>span{white-space:normal}
.hero-art{grid-area:art;display:block;position:relative;isolation:isolate;height:clamp(205px,57vw,360px);margin-inline:calc(-1 * var(--gutter));overflow:hidden;background:linear-gradient(#fff,#f6f4ef)}
.hero-art .watermark{width:135%;left:-17.5%;top:auto;bottom:12%;z-index:0}
.hero-art .sculpture{width:auto;height:104%;max-width:none;top:auto;left:50%;bottom:-4%;transform:translateX(-50%);z-index:1}
.intro{grid-area:intro;border-left:2px solid var(--gold);padding-left:12px;font-size:16px;line-height:1.46;max-width:50ch}
.intro::before{display:none}.intro span{display:inline;white-space:normal}.intro span:not(:last-child)::after{content:" "}
.choose{grid-area:action;width:min(100%,420px);height:50px;font-size:16px;border-radius:8px;position:relative;inset:auto}
.choose svg{width:14px;height:14px;top:18px;right:18px}
.benefits{grid-area:benefits;display:grid;grid-template-columns:1fr 1fr;gap:16px;text-align:left;font-size:14px;line-height:1.36;color:#61594d}
.benefits li+li{margin:0}.benefits i{margin:0 0 5px}
.collections{--u:1px;grid-template-columns:repeat(2,minmax(0,1fr));padding:6px var(--gutter) 28px;gap:8px}
.category-card{height:auto;aspect-ratio:0.67;border-radius:10px}
.category-wordmark{width:44px;top:11px}
.category-label{height:auto;min-height:54px;justify-content:space-between;gap:6px;padding:8px 10px;font-size:clamp(14px,3.5vw,18px);background:rgb(61 48 30/.78)}
.category-label::after{width:7px;height:7px;flex:none}
.discount,.contact{--u:1px;grid-template-columns:minmax(0,1fr);gap:12px;padding:32px var(--gutter)}
.offer-copy,.discount-form,.contact-intro,#contact-form{padding:clamp(19px,4vw,30px);border-radius:14px}
.offer-copy h2,.contact h2{font-size:clamp(28px,5vw,38px)}
.offer-copy p{font-size:16px;line-height:1.45;margin-top:14px}
.offer-fields,.contact-fields{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.offer-fields label,.contact-fields label,.checkout-grid>*{min-width:0}
.offer-fields input,.contact-fields :is(input,textarea),.checkout fieldset input,#query{font-size:16px}
.offer-consent{align-items:flex-start;gap:9px;line-height:1.48}.offer-consent span{max-width:none}
.contact-actions{flex-wrap:wrap;align-items:center}.contact-agreement{max-width:none}
.choice-list{max-height:min(230px,35dvh);overscroll-behavior:contain}
.choice-option{min-height:44px}
.showcase-head,.catalog-intro,.page-section,.store-footer,.product-content{padding-inline:var(--gutter)}
.showcase-head{padding-block:28px 16px;flex-wrap:wrap;gap:4px 20px}
.catalog-link{min-height:44px}
.product-grid{grid-template-columns:repeat(2,minmax(0,1fr));padding:0 var(--gutter) 28px;gap:14px 10px}
.product-tile,.catalog-page .product-tile{aspect-ratio:auto;border-radius:10px;border:1px solid #e9e4dc;background:white}
.tile-main,.catalog-page .tile-main{display:flex;flex-direction:column;height:100%;padding-top:44px;background:#f1f1ef}
.tile-main>img,.catalog-page .tile-main>img{height:auto;aspect-ratio:1;object-fit:contain}
.tile-code{left:7px;top:15px;font-size:11px;letter-spacing:0}
.tile-tools{right:1px;top:1px;gap:0}
.tile-action{width:44px;height:44px;background:transparent}
.tile-action[aria-pressed=true]{background:#805d27}
.tile-caption,.catalog-page .tile-caption{position:static;flex:1;opacity:1;transform:none;min-height:0;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:8px;padding:11px 10px;background:#fff;font-size:14px;line-height:1.33;overflow-wrap:anywhere}
.tile-caption strong{font-size:15px}
.catalog-trail{flex-wrap:wrap;gap:6px}
.catalog-title-row{flex-wrap:wrap;gap:8px 14px}
.catalog-filters{gap:7px;margin-top:16px}.catalog-filter{min-height:44px;font-size:14px;max-width:100%}
.product-content{padding-top:20px}
.product-layout{grid-template-columns:1fr 1fr;gap:22px}.product-info{min-width:0}
.product-portrait{max-height:52dvh}.product-info h1{font-size:clamp(26px,5vw,38px)}
.tone-picker label,.product-actions button{min-height:44px}.product-actions{flex-wrap:wrap}
.product-offer{padding-block:10px}
.section-heading{align-items:flex-start;flex-direction:column;gap:6px}
.home-photos{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.faq{grid-template-columns:minmax(0,1fr);gap:0}.faq p{overflow-wrap:anywhere}
.footer-columns>*{min-width:0}.footer-columns a{overflow-wrap:anywhere}
.shop-panel,.checkout,.offer-notice,.photo-view{max-height:100dvh;overscroll-behavior:contain}
.shop-panel{padding:max(18px,env(safe-area-inset-top)) var(--gutter) max(20px,env(safe-area-inset-bottom))}
.panel-head,.checkout-head{gap:12px}
.dismiss{width:44px;height:44px;flex:none}
.item-controls .text-btn{min-height:44px}.item-controls{gap:4px 12px}
.order-summary .text-btn{min-height:44px}
.checkout h2,.order-summary h3,.cart-item h3{overflow-wrap:anywhere}

@media(max-width:700px){
  .offer-fields,.contact-fields,.product-layout{grid-template-columns:minmax(0,1fr)}
  .offer-submit,.delivery-cta{width:100%}
  .contact-actions{display:grid;grid-template-columns:minmax(0,1fr)}
  .product-actions{display:grid;grid-template-columns:1fr 1fr}
  .product-actions button{padding-inline:8px}
  .product-portrait{max-height:48dvh}
  .tone-picker{margin:18px 0}
  .home-photos{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;padding-bottom:10px}
  .home-photos figure{flex:0 0 min(78vw,325px);scroll-snap-align:start}
  .delivery-steps{grid-template-columns:1fr}.step-art{height:85px}.step-art::before{width:96px;height:96px}
  .footer-columns{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer-brand,.footer-columns>div:last-child{grid-column:1/-1}
  .footer-columns a{padding-block:5px}.footer-bottom{align-items:flex-start;flex-wrap:wrap}
  .shop-panel,.checkout{width:100%;max-width:none;height:100dvh;max-height:100dvh;margin:0;border-radius:0}
  .checkout{padding:max(18px,env(safe-area-inset-top)) var(--gutter) max(24px,env(safe-area-inset-bottom))}
  .checkout-grid{gap:20px}.checkout{scroll-padding-block:125px 22px}.order-summary{padding:16px}
  .panel-head,.checkout-head{position:sticky;top:calc(-1 * max(18px,env(safe-area-inset-top)));z-index:1;background:#fff;padding-block:10px}
  .order-consent{align-items:flex-start}.offer-notice,.catalog-page .offer-notice{padding:25px;width:min(440px,calc(100% - 28px))}
}
@media(max-width:359px){
  .masthead,.catalog-shell .masthead{gap:3px;padding-inline:10px}
  .product-grid{gap:12px 6px}.tile-code{font-size:10px;left:4px}
}
@media(min-width:701px){
  .composition{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);grid-template-areas:"title art" "intro art" "action art" "benefits art";align-items:center;gap:18px 24px}
  .hero-art{height:100%;min-height:320px;margin:0;border-radius:12px}
  .hero h1{font-size:clamp(32px,4.4vw,45px)}
  .collections{grid-template-columns:repeat(4,minmax(0,1fr))}.category-label{font-size:15px}
  .product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
