/* Layout and palette reuse the approved design; these rules adapt it to a brand website. */
body.mandila-brand-page{background:var(--cream);color:var(--ink);font:14px/1.9 Tahoma,Arial,sans-serif;margin:0}
.mandila-brand-page h1,.mandila-brand-page h2,.mandila-brand-page h3{font-family:Tahoma,Arial,sans-serif;color:var(--ink);font-weight:400}
.mandila-brand-page a{color:inherit;text-decoration:none}
.mandila-brand-page .primary{color:var(--paper)}
[hidden]{display:none!important}
ul.collection-swatches,ul.colour-rail{list-style:none;padding:0;margin:0}
.quality-icon{grid-row:span 2;color:var(--rose);font:32px/1 Georgia,serif}
.qualities .quality-icon{font-size:32px}
.header-motto,.header-follow{font-size:11px;color:var(--rose)}
.header-follow{display:flex;gap:12px;align-items:center;min-height:44px}
.desktop-nav a{font-size:11px;position:relative;padding:12px 0;min-height:47px}
.desktop-nav a:hover{color:var(--rose);text-decoration:underline;text-underline-offset:7px}
.brand-mobile-menu{display:none}
.hero h1{white-space:normal}
.hero-photo>img{object-position:48% 44%}
.collection-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;border-block:1px solid var(--border);padding:16px 0;margin-bottom:18px}
.category-tabs button{border-radius:0;line-height:1.9;background:none;color:var(--rose);min-height:44px}
.category-tabs button.selected{background:var(--rose);color:var(--paper)}
[data-result-count]{font-size:10px;color:var(--muted);white-space:nowrap}
.reference-note{font-size:10px;color:var(--muted);margin:15px 0 25px;line-height:2}
.product-photo{cursor:default}
.product-photo:hover>img{transform:none}
.product-card .product-title-row h3{font-size:18px}
.collection-swatches{display:flex;flex-wrap:wrap;gap:10px 15px;padding-top:8px!important;padding-bottom:16px!important}
.collection-swatches li{display:flex;gap:6px;align-items:center;font-size:10px;color:var(--muted)}
.collection-swatches i{width:17px;height:17px;border-radius:50%;display:inline-block;border:1px solid var(--border)}
.collection-details{border-top:1px solid var(--border);color:var(--rose)}
.collection-details summary{min-height:48px;display:flex;gap:20px;align-items:center;justify-content:space-between;cursor:pointer;font-size:11px;list-style:none}
.collection-details summary::-webkit-details-marker{display:none}
.collection-details summary>span{font-size:20px;font-family:Arial,sans-serif;font-weight:300}
.collection-details[open] summary>span{transform:rotate(45deg)}
.collection-details>p{font-size:11px;line-height:2.1;color:var(--muted);margin:5px 0 12px}
.collection-details>.text-button{display:inline-flex;align-items:center;gap:15px;padding-bottom:16px}
.colour-tile{margin:0;cursor:default}
.story-photo small.image-credit{position:absolute;font-size:8px;font-family:Tahoma,Arial,sans-serif;letter-spacing:0;right:auto;bottom:auto;max-width:calc(100% - 32px)}
.follow-section{padding:58px 0;background:var(--soft);border-top:1px solid var(--border)}
.follow-layout{display:grid;grid-template-columns:1.3fr 1fr;gap:60px;align-items:center}
.follow-layout h2{font-size:34px;margin:10px 0 14px;letter-spacing:-1px}
.follow-layout p{font-size:12px;line-height:2.3;color:var(--muted)}
.social-links{display:flex;gap:14px;justify-content:flex-end}
.social-button{border:1px solid var(--blush);display:flex;justify-content:space-between;align-items:center;gap:32px;padding:16px 22px;min-height:58px;font-size:13px;flex:1;color:var(--rose);max-width:210px}
a.social-button:hover{background:var(--petal);border-color:var(--rose)}
.social-pending{display:flex;flex-direction:column;align-items:flex-start;gap:2px;color:var(--muted);font-size:11px}
.social-pending small{font-size:9px;color:var(--muted)}
.social-pending.social-button{justify-content:center;gap:3px;opacity:.7;border-style:dashed}
.footer-links>a{font-size:11px;color:var(--muted);display:inline-flex;align-items:center;gap:10px;min-height:36px;padding:5px 0}
.footer-links>.social-pending{padding:6px 0}
.footer-links a:hover{color:var(--rose);text-decoration:underline;text-underline-offset:4px}
.footer-bottom>a{min-height:32px;display:flex;align-items:center}
.footer-bottom{align-items:center}
body.admin-bar .site-header{top:32px}
@media(max-width:1100px){.follow-layout{gap:30px}.social-links{gap:10px}.social-button{padding:14px 15px;gap:18px}.desktop-nav{gap:30px}}
@media(max-width:782px){body.admin-bar .site-header{top:46px}}
@media(max-width:780px){
  .desktop-nav,.header-motto{display:none}
  .header-follow{font-size:10px;gap:8px}
  .brand-mobile-menu{display:block}
  .brand-mobile-menu summary{display:flex;align-items:center;gap:9px;min-height:44px;cursor:pointer;list-style:none;font-size:10px;color:var(--rose)}
  .brand-mobile-menu summary::-webkit-details-marker{display:none}
  .brand-mobile-menu summary>span:first-child{font-size:20px}
  .brand-mobile-menu nav{position:absolute;top:100%;right:0;left:0;display:flex;flex-direction:column;background:var(--cream);border-bottom:1px solid var(--border);padding:12px 25px 20px;box-shadow:0 16px 24px #42302e0a}
  .brand-mobile-menu nav a{min-height:48px;display:flex;align-items:center;font-size:13px;border-bottom:1px solid #8b5e5a14}
  .follow-layout{grid-template-columns:1fr;gap:24px}
  .follow-layout h2{font-size:29px}
  .social-links{justify-content:flex-start}
  .social-button{max-width:none}
  .collection-toolbar{gap:15px}
  .product-card .product-title-row h3{font-size:16px}
  .collection-swatches{gap:8px 12px}
  .collection-swatches li{font-size:9px}
  .footer-links>a{font-size:10px;min-height:40px}
}
@media(max-width:600px){body.admin-bar .site-header{top:0}}
@media(max-width:520px){
  .header-inner{gap:10px;grid-template-columns:1fr 112px 1fr}
  .header-follow{font-size:9px;gap:4px}
  .brand-mobile-menu summary{gap:7px}
  .hero h1{font-size:clamp(30px,8.4vw,38px);letter-spacing:-1.6px}
  .hero-copy{padding-inline:24px}
  .hero-photo{height:360px}
  .qualities .quality-icon{font-size:25px;line-height:1.2;margin-bottom:4px}
  .qualities small{font-size:8px;line-height:1.8}
  .collection-toolbar{align-items:flex-start;flex-direction:column;gap:10px}
  .category-tabs{width:100%}
  .category-tabs button{padding:8px 12px}
  .reference-note{font-size:9px;line-height:2}
  .product-card .product-title-row h3{font-size:14px}
  .product-meta{flex-wrap:wrap;gap:3px}
  .product-meta>span:first-child{font-size:7px;letter-spacing:.5px}
  .collection-swatches{gap:7px!important;flex-direction:column;align-items:flex-start}
  .collection-swatches li{font-size:9px}
  .collection-details summary{font-size:9px;gap:8px}
  .collection-details>p{font-size:10px}
  .collection-details>.text-button{font-size:9px;gap:8px}
  .follow-section{padding:36px 0}
  .follow-layout h2{font-size:29px}
  .follow-layout p{font-size:11px}
  .social-button{font-size:12px;padding:14px 17px;gap:14px}
  .social-pending small{font-size:8px}
  .footer-links>a{font-size:10px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation-duration:.01ms!important}}

/* The approved layout is retained; photographs show the complete scarf without cropping source labels. */
.product-photo>img{object-fit:contain;background:#f0e9e6}
.fabric-stripes{background:#edddd7}
.fabric-tones{background:#e9dbd5}
.collection-colours{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin:12px 0 6px}
.collection-colours>button{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--border);border-radius:0;min-height:44px;padding:7px 10px;color:var(--rose);background:transparent;font-size:11px;line-height:1.7}
.collection-colours>button.selected{border-color:var(--rose);background:var(--petal)}
.collection-colours>button:hover{border-color:var(--rose)}
.collection-colours i{width:15px;height:15px;flex-shrink:0;border-radius:50%;border:1px solid #42302e22}
.colour-status,.colour-fallback{font-size:11px;line-height:1.9;color:var(--muted);margin:8px 0 12px;min-height:21px}
.colour-status{color:var(--rose)}
@media(max-width:780px){.collection-colours>button{font-size:11px;padding:7px 9px}}
@media(max-width:520px){
  .collection-colours{gap:6px}
  .collection-colours>button{font-size:11px;padding:7px 8px;gap:5px}
  .collection-colours i{height:13px;width:13px}
  .colour-status,.colour-fallback{font-size:11px}
  .collection-details summary{font-size:11px}
  .collection-details>p{font-size:11px}
  .collection-details>.text-button{font-size:11px}
}
