/* Landing layout for phones and tablets. Loaded after the reference styling. */
.template-index *, .template-index *::before, .template-index *::after { box-sizing: border-box; }
.template-index .arrival-copy, .template-index .story-copy, .template-index .footer-grid > *, .template-index .review-card { min-width: 0; }
.template-index .arrival-images > img:only-child { width: 100%; }
.template-index .arrival-images > img:not(:only-child) { width: 50%; object-fit: cover; }
.template-index .arrival-copy .rte, .template-index .story-copy .rte, .template-index .review-card .rte { overflow-wrap: break-word; }

@media (min-width: 768px) and (max-width: 1024px) {
  .template-index .container { width: 90%; }
  .template-index .section { padding-block: 56px; }
  .template-index .hero-copy { max-width: 620px; }
  .template-index .dos-hero { min-height: 470px; height: auto; }
  .template-index .hero-copy { padding-block: 120px 64px; }
  .template-index .dos-hero h1 { font-size: 46px; }
  .template-index .dos-hero .rte { font-size: 15px; }
  .template-index .arrival-copy { padding: 36px 28px; }
  .template-index .arrival-copy h3 { font-size: 27px; margin-bottom: 18px; }
  .template-index .arrival-copy .rte { font-size: 16px; }
  .template-index .arrival-copy .button { margin-top: 36px; padding: 16px 24px; font-size: 14px; }
  .template-index .arrival-price { font-size: 22px; gap: 16px; }
  .template-index .product-carousel { grid-auto-columns: calc((100% - 32px) / 3); column-gap: 16px; }
  .template-index .product-card h3 { font-size: 13px; }
  .template-index .product-card .price { font-size: 12px; }
  .template-index .story-copy { min-height: 400px; padding: 48px 36px; }
  .template-index .story-copy .rte { font-size: 17px; }
  .template-index .story-copy .section-title { font-size: 28px; }
  .template-index .service-benefits { height: auto; min-height: 260px; padding: 80px 0; }
  .template-index .service-benefits .benefits-grid { gap: 24px; }
  .template-index .faq { width: 78%; padding-block: 64px 80px; }
  .template-index .footer-newsletter { width: 85%; }
}

@media (max-width: 767px) {
  .template-index { --landing-unit: calc(100vw / 800); }
  .template-index .container, .template-index .dos-hero .container { width: calc(100% - 40px); max-width: none; }
  .template-index .section { padding-block: 48px; }
  .template-index .section-title { font-size: 23px; line-height: 1.15; margin-bottom: 24px; }
  .template-index .dos-header { height: auto; min-height: 0; }
  .template-index .header-inner {
    width: calc(100% - 40px); grid-template-columns: minmax(0,1fr) minmax(0,1fr);
    gap: 14px; padding: 18px 0 10px; min-height: 0;
  }
  .template-index .header-inner > .brand { grid-area: 1 / 1; }
  .template-index .header-inner > .brand img { width: 56px; min-width: 0; height: auto; }
  .template-index .header-inner > .bag { grid-area: 1 / 2; min-width: 96px; min-height: 44px; padding: 8px 18px; font-size: 14px; }
  .template-index .header-inner > .home-nav { grid-area: 2 / 1 / 3 / 3; width: 100%; margin: 0; gap: clamp(18px,6vw,36px); font-size: 11px; }
  .template-index .home-nav a { display: flex; align-items: center; min-height: 44px; padding: 8px 0; }
  .template-index .dos-hero { height: auto; min-height: 480px; min-height: clamp(480px,70svh,650px); align-items: flex-end; }
  .template-index .hero-copy { max-width: 100%; margin: 0; padding: 100px 0 64px; }
  .template-index .dos-hero h1 { font-size: clamp(34px,9vw,48px); line-height: 1.04; margin-bottom: 18px; }
  .template-index .dos-hero .rte, .template-index .dos-hero .rte p { font-size: 14px; line-height: 1.35; }
  .template-index .dos-hero .rte p { margin-bottom: 28px; }
  .template-index .button, .template-index button { font-size: 14px; line-height: 1.2; padding: 14px 24px; min-height: 44px; border-radius: 12px; }
  .template-index .button-light { min-width: 170px; }
  .hero-background-video { object-fit: cover; }
  .template-index .hero-video-toggle { bottom: 16px; right: 20px; min-height: 36px; }
  .template-index .arrival-card { height: auto; grid-template-columns: minmax(0,1fr); border-radius: 18px; }
  .template-index .arrival-images { height: auto; min-height: 0; aspect-ratio: 405 / 473; width: 100%; }
  .template-index .arrival-copy { padding: 28px 24px 32px; }
  .template-index .arrival-copy h3 { font-size: 27px; margin: 0 0 16px; }
  .template-index .arrival-copy .rte { font-size: 16px; line-height: 1.35; }
  .template-index .arrival-price { font-size: 22px; min-height: 50px; margin-top: 22px; gap: 20px; }
  .template-index .arrival-price .card-bag { width: 44px; height: 44px; padding: 9px; }
  .template-index .arrival-copy .button { margin-top: 30px; padding: 16px 28px; font-size: 14px; }
  .template-index .delivery-strip.delivery-marquee { min-height: 42px; height: auto; }
  .template-index .delivery-marquee__group > span { font-size: 11px; padding: 11px 22px; gap: 28px; }
  .template-index .product-carousel { grid-auto-columns: calc((100% - 12px) / 2); column-gap: 12px; padding-bottom: 0; }
  .template-index .product-card__image { border-radius: 14px; }
  .template-index .product-card__caption { min-height: 62px; padding: 6px 5px 6px 8px; margin-top: 10px; gap: 5px; border-radius: 10px; }
  .template-index .product-card h3 { font-size: 11px; line-height: 1.2; overflow-wrap: break-word; }
  .template-index .product-card .price { font-size: 11px; }
  .template-index .product-card .card-bag { padding: 7px; flex-shrink: 0; }
  .template-index .product-card .card-bag .icon { width: 19px; height: 19px; }
  .template-index .center { margin-top: 28px; }
  .template-index .bestseller-controls, .template-index .review-controls { gap: 10px; margin-top: 16px; }
  .template-index .bestseller-controls button, .template-index .review-controls button { flex: 0 0 44px; width: 44px; height: 44px; min-height: 44px; padding: 0; font: 20px Arial,sans-serif; }
  .bestseller-position, .review-position { min-width: 0; height: 44px; border-radius: 0; background: linear-gradient(white,white) center / 100% 10px no-repeat; }
  .template-index .category-tiles { grid-template-columns: minmax(0,1fr); height: auto; padding: 20px; gap: 16px; }
  .template-index .category-tile { height: auto; aspect-ratio: 4 / 5; border-radius: 14px; }
  .template-index .category-tile span { bottom: 22px; width: max-content; max-width: calc(100% - 32px); min-height: 44px; padding: 12px 20px; font-size: 14px; }
  .template-index .story-teaser { grid-template-columns: minmax(0,1fr); height: auto; }
  .template-index .story-copy { min-height: 350px; align-items: center; padding: 48px 28px; }
  .template-index .story-copy .section-title { text-align: center; font-size: 28px; margin-bottom: 22px; }
  .template-index .story-copy .rte { font-size: 17px; line-height: 1.3; max-width: 440px; text-align: center; }
  .template-index .story-copy .button { min-width: 170px; margin-top: 26px; }
  .template-index .story-art { min-height: 240px; }
  .template-index .dos-reviews { margin-top: -28px; padding: 48px 0 32px; border-radius: 28px 28px 0 0; }
  .template-index .dos-reviews .container { width: calc(100% - 40px); }
  .template-index .dos-reviews .section-title { font-size: 23px; margin-bottom: 24px; }
  .review-track { gap: 12px; }
  .review-card { flex-basis: 88%; min-height: 245px; padding: 22px; }
  .template-index .dos-reviews .review-card .rte { font-size: 14px; line-height: 1.2; }
  .template-index .dos-reviews .review-card cite { font-size: 12px; padding-top: 24px; }
  .template-index .dos-reviews .stars { font-size: 26px; }
  .template-index .service-benefits { height: auto; padding: 60px 0; border-radius: 28px 28px 0 0; }
  .template-index .service-benefits .benefits-grid { grid-template-columns: minmax(0,1fr); gap: 28px; }
  .template-index .service-benefits .benefits-grid > div { display: flex; flex-direction: column; align-items: center; }
  .template-index .service-benefits .benefits-grid .rte, .template-index .service-benefits .benefits-grid > div > p { display: none; }
  .template-index .service-benefits .benefits-grid .icon { width: 26px; height: 26px; }
  .template-index .service-benefits .benefits-grid h2 { font-size: 14px; margin: 12px 0 0; line-height: 1.3; }
  .template-index .faq { width: calc(100% - 40px); max-width: none; padding: 48px 0 60px; }
  .template-index .faq details { padding: 7px 8px 7px 16px; margin-bottom: 14px; border-radius: 16px; }
  .template-index .faq summary { font-size: 13px; line-height: 1.25; min-height: 38px; gap: 10px; }
  .template-index .faq summary .faq-arrow { flex: 0 0 38px; width: 38px; height: 36px; padding: 7px 8px; }
  .faq-arrow .faq-arrow-icon { width: 22px; height: 24px; }
  .template-index .faq details > .rte, .template-index .faq details > p { font-size: 14px; padding-right: 12px; }
  .template-index .site-footer { padding: 48px 0 28px; }
  .template-index .site-footer .container { width: calc(100% - 40px); }
  .template-index .footer-grid { grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 32px 24px; }
  .template-index .footer-grid > div:first-child { grid-column: 1 / -1; }
  .template-index .footer-grid .brand img { width: 100px; }
  .template-index .footer-tagline { font-size: 12px; margin-top: 20px; line-height: 1.3; }
  .template-index .site-footer .footer-grid h2 { font-size: 16px; margin-bottom: 20px; }
  .template-index .footer-grid nav a { font-size: 14px; min-height: 44px; display: flex; align-items: center; margin-bottom: 8px; }
  .template-index .footer-newsletter { grid-column: 1 / -1; width: 100%; min-width: 0; margin: 0; }
  .template-index .site-footer .footer-newsletter h2 { font-size: 14px; margin-bottom: 12px; }
  .template-index .newsletter-field { height: 56px; }
  .template-index .newsletter-field input { font-size: 16px; min-width: 0; }
  .template-index .newsletter-field button { flex: 0 0 46px; width: 46px; padding: 8px; min-height: 44px; }
  .template-index .footer-bottom { flex-direction: column; align-items: flex-start; gap: 20px; font-size: 12px; line-height: 1.4; margin-top: 30px; }
  .template-index .social-links { gap: 12px; }
  .template-index .social-links a, .template-index .social-links > span { width: 32px; height: 32px; }
  .preview-bar { gap: 8px; padding: 10px; }
  .preview-bar small { flex-basis: 100%; margin-left: 0; }
}

@media (max-width: 360px) {
  .template-index .container, .template-index .header-inner, .template-index .dos-hero .container,
  .template-index .dos-reviews .container, .template-index .faq, .template-index .site-footer .container { width: calc(100% - 32px); }
  .template-index .product-carousel { grid-auto-columns: 78%; }
  .template-index .arrival-copy { padding: 24px 20px; }
  .template-index .header-inner > .home-nav { gap: 18px; font-size: 10px; }
  .template-index .faq summary { font-size: 12px; }
}
@media(max-width:767px){.template-index .hero-video-toggle{min-height:44px}}
/* Smaller footer typography and wordmark. */
.site-footer .footer-grid .brand img,.template-index .site-footer .footer-grid .brand img{width:88px;min-width:0;height:auto}
.site-footer .footer-grid h2,.template-index .site-footer .footer-grid h2{font-size:17px}
.site-footer .footer-grid nav a,.template-index .site-footer .footer-grid nav a{font-size:14px}
.site-footer .footer-tagline,.template-index .site-footer .footer-tagline{font-size:11px}
.site-footer .footer-newsletter h2,.template-index .site-footer .footer-newsletter h2{font-size:14px}
.site-footer .newsletter-field input{font-size:14px}
.site-footer .footer-bottom,.template-index .site-footer .footer-bottom{font-size:12px}
@media(max-width:767px){.site-footer .footer-grid .brand img,.template-index .site-footer .footer-grid .brand img{width:68px}.site-footer .footer-grid h2,.template-index .site-footer .footer-grid h2{font-size:14px}.site-footer .footer-grid nav a,.template-index .site-footer .footer-grid nav a{font-size:12px}.site-footer .footer-tagline,.template-index .site-footer .footer-tagline{font-size:10px}.site-footer .footer-newsletter h2,.template-index .site-footer .footer-newsletter h2{font-size:12px}.site-footer .footer-bottom,.template-index .site-footer .footer-bottom{font-size:10px}.site-footer .newsletter-field input{font-size:16px}}

/* Mobile New Arrivals: swipe between the supplied original front/back photos. */
.arrival-mobile-gallery{display:none}
@media(max-width:767px){
.template-index .arrival-card>.arrival-images{display:none}
.arrival-mobile-gallery{display:flex;min-width:0;width:100%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:#48172d #f3ece7;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch;background:white}
.arrival-mobile-slide{flex:0 0 100%;min-width:0;height:clamp(420px,70svh,650px);scroll-snap-align:start;scroll-snap-stop:always;padding:12px 20px}
.arrival-mobile-slide img{width:100%;height:100%;object-fit:contain;display:block}
.arrival-mobile-gallery::-webkit-scrollbar{height:6px}
.arrival-mobile-gallery::-webkit-scrollbar-track{background:#f3ece7}
.arrival-mobile-gallery::-webkit-scrollbar-thumb{background:#48172d;border-radius:4px}
}
/* Center the New Arrivals discovery button beneath the mobile product details. */
@media(max-width:767px){.template-index .arrival-copy .button{align-self:center;text-align:center}}
/* Center the New Arrivals price and bag control on mobile. */
@media(max-width:767px){.template-index .arrival-copy .arrival-price{align-self:center}}
/* Smaller Our Story heading and body copy. */
.template-index .story-copy .section-title{font-size:clamp(22px,2.1vw,32px)}
.template-index .story-copy .rte{font-size:clamp(14px,1.35vw,20px);line-height:1.25}
@media(max-width:767px){.template-index .story-copy .section-title{font-size:24px}.template-index .story-copy .rte{font-size:15px;line-height:1.3}}
/* Compact mobile editorial strip and icon-only cart. */
@media(max-width:767px){
.template-collection .shop-editorial{grid-template-columns:repeat(3,minmax(0,1fr));gap:0}
.template-collection .shop-editorial-reference,.template-collection .shop-editorial-fill{aspect-ratio:4/5;width:100%;height:auto}
.template-collection .shop-editorial-fill img{object-fit:cover;object-position:center 25%}
.dos-header .bag>span:not(.visually-hidden){display:none}
.template-index .header-inner>.bag{min-width:44px;width:44px;height:44px;padding:9px;gap:0}
}
/* Consistent mobile footer on landing and Shop pages. */
@media(max-width:767px){
.site-footer,.template-index .site-footer,.template-collection .site-footer{padding:40px 0 24px}
.site-footer .container,.template-index .site-footer .container,.template-collection .site-footer .container{width:calc(100% - 40px);max-width:none}
.site-footer .footer-grid,.template-index .footer-grid,.template-collection .footer-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:24px;row-gap:28px}
.site-footer .footer-grid>*{min-width:0}
.site-footer .footer-grid>div:first-child{grid-column:1/-1}
.site-footer .footer-grid .brand img{width:68px;min-width:0;height:auto}
.site-footer .footer-tagline{font-size:10px;line-height:1.4;margin:16px 0 0}
.site-footer .footer-grid h2{font-size:14px;line-height:1.25;margin:0 0 14px}
.site-footer .footer-grid nav a{font-size:12px;line-height:1.3;min-height:44px;display:flex;align-items:center;margin:0;padding:6px 0}
.site-footer .footer-grid .footer-newsletter,.template-index .footer-newsletter,.template-collection .footer-newsletter{grid-column:1/-1;justify-self:stretch;width:100%;min-width:0;max-width:none;margin:0}
.site-footer .footer-newsletter h2{font-size:12px;text-align:left;margin-bottom:12px}
.site-footer .newsletter-field{display:flex;align-items:stretch;width:100%;height:52px;min-height:52px;padding:4px;border-radius:12px}
.site-footer .newsletter-field input{display:block;flex:1 1 0;width:0;min-width:0;max-width:100%;font-size:16px;padding:8px 12px;border:0;background:white;color:#48172d}
.site-footer .newsletter-field button,.template-index .site-footer .newsletter-field button{display:flex;align-items:center;justify-content:center;flex:0 0 44px;width:44px;min-height:44px;height:44px;margin:0;padding:8px;border-radius:9px}
.site-footer .footer-bottom,.template-index .footer-bottom,.template-collection .footer-bottom{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:16px;margin-top:28px;padding-top:18px;font-size:10px;line-height:1.4}
.site-footer .social-links{display:flex;flex-wrap:wrap;gap:12px}
.site-footer .social-links a,.site-footer .social-links>span{display:flex;align-items:center;justify-content:center;width:36px;height:36px}
.site-footer .social-links svg{width:26px;height:26px}
}