/* Marco Benetti V27 — Daniel Ruffo inspired storefront system */
:root{
  --ink:#26313a;
  --muted:#6f7780;
  --line:#dde1e4;
  --soft:#f3f5f6;
  --cream:#f8f9f9;
  --accent:#9a7448;
  --serif:Georgia,'Times New Roman',serif;
  --sans:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;
  --page:max(18px,4.2vw);
}

html{scroll-padding-top:154px}
body{background:#fff;color:var(--ink);font-size:15px}
.container{width:min(1250px,calc(100% - var(--page)*2))}
h1,h2{font-family:var(--sans);font-weight:700;letter-spacing:-.03em}
h1{font-size:clamp(32px,4vw,50px)}
h2{font-size:clamp(27px,3vw,38px)}
.overline{font-size:11px;font-weight:650;letter-spacing:.12em;color:var(--muted)}
.button{border-radius:8px;font-weight:600;letter-spacing:.01em}
.button-dark{background:#26313a}
.button-dark:hover{background:#12191f}

/* Utility and navigation */
.announcement{height:36px;background:#eef1f3;color:#47515b;border-bottom:1px solid #dce1e4}
.utility-inner{width:min(1240px,calc(100% - var(--page)*2));margin:auto;display:flex;align-items:center;justify-content:space-between;font-size:12px}
.utility-inner nav{display:flex;gap:26px;align-items:center}
.utility-inner a:hover{text-decoration:underline;text-underline-offset:4px}
.site-header{top:0;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 4px 18px rgba(25,37,46,.025)}
.header-inner{height:80px;max-width:1250px;padding:0;grid-template-columns:230px minmax(300px,520px) 1fr;gap:30px}
.header-inner>.wordmark{grid-column:1;grid-row:1;justify-self:start;align-items:flex-start;font-family:var(--serif);font-size:29px;text-transform:uppercase;letter-spacing:-.03em}
.wordmark span{font-size:7px;letter-spacing:.32em;margin-top:5px;margin-left:3px}
.header-left{display:none}
.header-search{grid-column:2;grid-row:1;height:43px;border:1px solid #d8dde1;border-radius:24px;display:flex;align-items:center;background:#fff;overflow:hidden;transition:border-color .2s,box-shadow .2s}
.header-search:focus-within{border-color:#9ca5ac;box-shadow:0 0 0 3px #26313a0d}
.header-search input{width:100%;height:100%;border:0;outline:0;padding:0 12px 0 19px;background:transparent;font-size:13px}
.header-search button{width:48px;height:100%;display:grid;place-items:center}
.header-search .icon{width:20px;height:20px}
.header-right{grid-column:3;grid-row:1;gap:9px}
.header-right .icon-btn{width:auto;height:44px;border-radius:8px;padding:8px 10px;gap:7px}
.header-right .icon{width:21px;height:21px}
.header-action-label{font-size:13px;white-space:nowrap}
.count{right:0;top:0}
.category-nav{height:47px;gap:34px;border-top:1px solid #f0f1f2;padding:0 var(--page)}
.category-nav a{font-size:13px;color:#3f4952}
.category-nav a:after{height:2px;background:var(--accent)}

/* Homepage */
.hero{width:min(1250px,calc(100% - var(--page)*2));height:438px;min-height:0;margin:22px auto 0;border-radius:16px;background:#d8d8d5}
.hero picture img{object-position:center 58%}
.hero-shade{background:linear-gradient(90deg,rgba(16,22,25,.56),rgba(16,22,25,.06) 68%),linear-gradient(0deg,rgba(16,22,25,.2),transparent 48%)}
.hero-copy{left:6%;bottom:14%;max-width:500px}
.hero-copy h1{font-family:var(--serif);font-weight:400;font-size:clamp(39px,4.7vw,64px);margin-bottom:25px}
.hero-copy .button{border-radius:7px;min-width:205px}
.hero-caption{right:4%;bottom:28px}

.category-showcase{padding:38px 0 8px}
.category-showcase>h2{text-align:center;margin-bottom:27px;font-size:30px}
.quick-categories{max-width:none;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.quick-categories a{font-size:14px;text-align:left;font-weight:600}
.quick-categories a>div{height:auto;aspect-ratio:1/1;border-radius:11px;background:var(--soft)}
.quick-categories img{object-fit:cover}
.quick-categories span{margin:9px 3px 0}
.quick-categories a:hover img{transform:scale(1.035)}

.section{padding-block:52px}
.section-head{align-items:center;margin-bottom:21px}
.section-head h2{font-size:31px;margin-top:5px}
.section-head .text-link{font-weight:600;text-decoration:none}
.collection-tabs{margin-top:-6px}
.product-rail{padding-top:25px}
.product-grid{gap:22px;row-gap:30px}
.product-card{border:1px solid #e8ebed;border-radius:13px;background:#fff;overflow:hidden;box-shadow:0 6px 18px rgba(26,36,44,.035);transition:transform .22s,box-shadow .22s}
.product-card:hover{transform:translateY(-3px);box-shadow:0 12px 26px rgba(26,36,44,.08)}
.card-visual{aspect-ratio:1/1;background:#f8f9f9}
.card-image-link img{padding:12px;mix-blend-mode:multiply}
.card-copy{padding:14px 15px 18px;background:#f7f8f9;border-top:1px solid #eceff0}
.card-category{font-size:10px;letter-spacing:.08em}
.card-copy h3{font-size:14px;min-height:21px;margin-bottom:10px;font-weight:550}
.card-bottom{align-items:flex-end}
.card-quick{border-radius:7px;box-shadow:0 5px 20px #22313c14}
.favorite-btn{border:1px solid #e6e9eb}
.more-products{margin-top:32px;border-radius:8px}

.editorial-pair{width:min(1250px,calc(100% - var(--page)*2));margin:15px auto 0;gap:18px}
.editorial-card{height:510px;border-radius:14px}
.editorial-card h2{font-family:var(--serif);font-weight:400}
.material-story{padding-block:72px}
.material-photo{border-radius:14px}

/* Catalog */
body[data-page="catalog"],body[data-page="favorites"],body[data-page="product"]{background:#f6f7f8}
.catalog-heading{padding-top:18px;padding-bottom:22px}
.catalog-heading-row{background:#fff;border:1px solid #e6e9eb;border-radius:13px;padding:24px 28px;min-height:135px}
.catalog-heading-row h1{font-size:34px;margin:6px 0 8px}
.catalog-heading-row>img{width:170px;height:105px;border-radius:9px}
.catalog-section{padding-bottom:72px}
.catalog-toolbar{top:163px;min-height:67px;padding:0 14px;border:1px solid #e4e7e9;border-radius:11px;background:rgba(255,255,255,.96);backdrop-filter:blur(9px);margin-bottom:22px}
.toolbar-btn{padding:10px 13px;border:1px solid #cfd5d9;border-radius:8px}
.sort-control select{border:1px solid #d5dade;border-radius:8px;padding:10px 32px 10px 12px;background:#fff}
.active-filters{margin-inline:4px}
.filter-chip{border-radius:18px;background:#e9edf0}

/* Product */
.product-main{padding-bottom:30px}
.product-main>.breadcrumb{padding-block:22px}
.product-layout{grid-template-columns:1.05fr 1fr;gap:34px;background:#fff;border:1px solid #e5e8ea;border-radius:15px;padding:28px;box-shadow:0 8px 28px rgba(25,35,43,.035)}
.gallery-wrap{border-radius:11px;background:#fafafa;overflow:hidden}
.gallery-track{aspect-ratio:1.06/1}
.gallery-slide{background:#fafafa}
.gallery-slide img{padding:10px}
.gallery-thumbs{margin-top:11px}
.gallery-thumb{border-radius:7px;background:#fafafa;overflow:hidden}
.product-panel{top:172px;padding:7px 4px 0}
.product-title{font-family:var(--sans);font-weight:750;font-size:30px}
.product-price{font-size:22px}
.sizes{grid-template-columns:repeat(7,minmax(0,1fr))}
.size-option{border-radius:6px;background:#fff}
.product-add-row .button,.product-add-row .icon-btn{border-radius:7px}
.product-accordions summary{font-weight:600}
.related-section{padding-bottom:40px}

/* Service and footer */
.service-strip{margin-top:30px;padding:25px 22px;border:1px solid #e2e6e8;border-radius:12px;background:#fff}
.site-footer{background:#eef1f3;color:#26313a;padding:54px 0 18px;border-top:1px solid #dfe4e7}
.footer-brand p,.footer-group a,.footer-bottom{color:#69737b}
.footer-brand .wordmark{font-family:var(--serif);font-size:32px;text-transform:uppercase}
.footer-group summary{font-weight:700;text-transform:uppercase;font-size:12px;letter-spacing:.06em}
.footer-group a:hover{color:#111820}
.footer-bottom{border-top-color:#d9dee1}
.side-dialog{border-radius:14px 0 0 14px}
.dialog-head h2{font-family:var(--sans);font-weight:700;font-size:26px}
.search-field,.contact-card,.checkout-card{border-radius:9px}

@media (max-width:900px){
  html{scroll-padding-top:111px}
  .utility-inner nav{display:none}
  .utility-inner{justify-content:center;font-size:11px}
  .site-header{position:sticky}
  .header-inner{height:59px;padding:0 15px;grid-template-columns:1fr auto 1fr;gap:8px}
  .header-inner>.wordmark{grid-column:2;justify-self:center;align-items:center;font-size:21px}
  .wordmark span{font-size:6px;margin-top:3px}
  .header-left{display:flex;grid-column:1;grid-row:1;gap:0}
  .header-left .icon-btn{width:38px;height:42px;padding:9px}
  .header-right{grid-column:3;gap:0}
  .header-right .icon-btn{width:39px;height:42px;padding:9px;border-radius:50%}
  .header-action-label,.header-wish{display:none!important}
  .header-search{grid-column:1/-1;grid-row:2;margin:0 15px 9px;height:40px}
  .header-search input{font-size:13px}
  .header-inner{margin-bottom:49px}
  .category-nav{display:none}
  .hero{margin-top:14px;height:56vw;min-height:310px;border-radius:11px}
  .hero-copy{left:7%;bottom:10%;max-width:72%}
  .hero-copy h1{font-size:clamp(31px,7vw,48px);margin-bottom:17px}
  .hero-copy .overline{margin-bottom:10px}
  .hero-caption{display:none}
  .quick-categories{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .category-showcase>h2{font-size:26px}
  .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;row-gap:18px}
  .editorial-pair{grid-template-columns:1fr;gap:12px}
  .editorial-card{height:72vw;min-height:390px}
  .material-story{grid-template-columns:1fr;gap:34px}
  .catalog-toolbar{top:108px}
  .product-layout{grid-template-columns:1fr;padding:15px;gap:22px}
  .product-panel{position:static}
}

@media (max-width:600px){
  :root{--page:14px}
  body{font-size:14px}
  .announcement{height:28px}
  .utility-inner{font-size:10px;letter-spacing:.03em}
  .hero{width:calc(100% - 20px);height:430px;margin-top:10px}
  .hero picture img{object-position:61% center}
  .hero-shade{background:linear-gradient(0deg,rgba(17,23,27,.65),transparent 74%)}
  .hero-copy{left:20px;right:20px;bottom:22px;max-width:none}
  .hero-copy h1{font-size:38px}
  .hero-copy .button{min-height:45px;width:100%}
  .category-showcase{padding-top:28px}
  .category-showcase>h2{text-align:left;margin-bottom:16px}
  .quick-categories{gap:10px}
  .quick-categories a>div{border-radius:9px}
  .quick-categories span{font-size:12px;margin-top:7px}
  .section{padding-block:36px}
  .section-head{margin-bottom:16px}
  .section-head h2{font-size:25px}
  .section-head .text-link{font-size:12px}
  .collection-tabs{overflow-x:auto;white-space:nowrap}
  .product-grid{gap:9px;row-gap:14px}
  .product-card{border-radius:9px}
  .card-image-link img{padding:5px}
  .card-copy{padding:10px 10px 13px}
  .card-copy h3{font-size:12px;line-height:1.35;min-height:32px}
  .card-category,.card-color span{display:none}
  .card-price{font-size:13px}
  .card-offline{font-size:10px}
  .favorite-btn{top:6px!important;right:6px!important}
  .editorial-pair{width:calc(100% - 20px)}
  .editorial-card{height:490px}
  .editorial-card h2{font-size:35px}
  .material-story{padding-block:45px}
  .service-strip{grid-template-columns:1fr;padding:8px 16px;gap:0}
  .service-strip a{border-bottom:1px solid var(--line)}
  .service-strip a:last-child{border-bottom:0}
  .footer-grid{grid-template-columns:1fr}
  .footer-brand{margin-bottom:16px}
  .site-footer{padding-top:38px}
  .catalog-heading{padding-top:5px}
  .catalog-heading-row{padding:17px;min-height:0}
  .catalog-heading-row>img{display:none}
  .catalog-heading-row h1{font-size:28px}
  .catalog-toolbar{top:107px;margin-inline:-2px;padding:8px 9px;min-height:61px}
  .catalog-toolbar>div{gap:7px}
  .toolbar-btn{font-size:12px;padding:9px}
  .sort-control select{max-width:128px;font-size:12px}
  .product-main{width:100%;padding-inline:10px}
  .product-main>.breadcrumb{padding:15px 4px}
  .product-layout{border-radius:11px;padding:10px 10px 18px}
  .gallery-track{aspect-ratio:1/1}
  .product-title{font-size:25px}
  .sizes{grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}
  .size-option{height:42px;font-size:12px}
  .sticky-buy{display:flex}
  .related-section{padding-inline:4px}
  .side-dialog{border-radius:0;width:100vw}
}

@media (prefers-reduced-motion:reduce){
  .product-card,.quick-categories img{transition:none}
}