/** Shopify CDN: Minification failed Line 6510:19 Unexpected "__inner" **/ /* ===== fc-mobile-tighten.css ===== */ @media (max-width:749px){html body{font-size:14px !important;line-height:1.45 !important;}html body .page-width[class],html body .container[class],html body .fc-rv[class],html body main{padding-left:12px !important;padding-right:12px !important;}html body section[class],html body .shopify-section[class]>section,html body .shopify-section[class]>div[class]{padding-top:20px !important;padding-bottom:20px !important;margin-top:0 !important;margin-bottom:0 !important;}html body .shopify-section[class]{padding:0 !important;margin:0 !important;}html body h1[class],html body h1,html body .h1[class],html body .h1{font-size:24px !important;line-height:1.15 !important;letter-spacing:-0.01em !important;margin:0 0 6px !important;}html body h2[class],html body h2,html body .h2[class],html body .h2,html body section h2[class][class],html body section h2{font-size:19px !important;line-height:1.2 !important;letter-spacing:-0.005em !important;margin:0 0 6px !important;}html body h3[class],html body h3{font-size:15px !important;line-height:1.25 !important;margin:0 0 4px !important;}html body h4[class],html body h4{font-size:13px !important;line-height:1.3 !important;margin:0 0 4px !important;}html body p{font-size:13px !important;line-height:1.5 !important;margin:0 0 8px !important;}html body .fc-header[class][class],html body header.fc-header[class]{padding:8px 12px !important;min-height:52px !important;}html body .fc-header__logo[class][class],html body .fc-header__brand[class][class]{font-size:16px !important;}html body .fc-header__logo img,html body .fc-header__brand img{max-height:28px !important;width:auto !important;}html body .fc-header__nav[class][class],html body .fc-header__menu[class][class]{display:none !important;}html body .fc-announcement[class][class],html body [class*="announcement"][class]{font-size:11px !important;padding:4px 8px !important;letter-spacing:0 !important;min-height:auto !important;}html body .fc-hero[class][class],html body .fc-hero2[class][class],html body .fc-hero3[class][class],html body .fc-hero4[class][class],html body [class*="fc-hero"][class]{padding:20px 12px !important;min-height:auto !important;}html body .fc-hero4[class] .fc-hero4__headline[class][class],html body .fc-hero[class] .fc-hero__title[class][class],html body [class*="fc-hero"][class] h1[class],html body [class*="fc-hero"][class] h1,html body main h1:first-of-type[class],html body main h1:first-of-type{font-size:26px !important;line-height:1.1 !important;margin:0 0 8px !important;}html body [class*="fc-hero"][class] h2[class],html body [class*="fc-hero"][class] h2{font-size:15px !important;line-height:1.3 !important;margin:0 0 6px !important;}html body [class*="fc-hero"][class] p{font-size:13px !important;line-height:1.45 !important;margin:0 0 10px !important;}html body [class*="fc-hero"][class] .btn[class],html body [class*="fc-hero"][class] a.button[class],html body [class*="fc-hero"][class] button[class],html body [class*="fc-hero"][class] button{padding:10px 18px !important;font-size:13px !important;min-height:42px !important;}html body .fc-shop[class][class],html body section[class*="fc-shop"][class]{padding:20px 10px !important;}html body .fc-shop[class] .fc-shop__grid[class][class],html body .fc-shop[class] [class*="grid"][class]{display:grid !important;grid-template-columns:1fr 1fr !important;gap:8px !important;}html body .fc-shop[class] .fc-shop__card[class][class],html body .fc-shop[class] .fc-shop__item[class],html body .fc-shop[class] .card[class]{padding:6px !important;border-radius:8px !important;}html body .fc-shop[class] .fc-shop__card[class] img,html body .fc-shop[class] .fc-shop__item[class] img{border-radius:6px !important;width:100% !important;aspect-ratio:1 !important;object-fit:cover !important;}html body .fc-shop[class] .fc-shop__name[class][class],html body .fc-shop[class] .fc-shop__title[class][class][class],html body section .fc-shop__title[class][class][class]{font-size:12px !important;line-height:1.2 !important;margin:4px 0 2px !important;}html body .fc-shop[class] .fc-shop__price[class][class],html body .fc-shop[class] .price[class]{font-size:12px !important;font-weight:600 !important;}html body .fc-coll[class][class]{padding:20px 10px !important;}html body .fc-coll[class] .fc-coll__grid[class][class],html body .fc-coll[class] [class*="grid"][class]{grid-template-columns:1fr !important;gap:10px !important;}html body .fc-coll[class] .fc-coll__card[class][class]{padding:10px !important;}html body .fc-coll[class] .fc-coll__card[class] img{width:100% !important;aspect-ratio:16/9 !important;object-fit:cover !important;}html body .fc-coll[class] .fc-coll__title[class][class][class],html body section .fc-coll__title[class][class][class]{font-size:16px !important;}html body .fc-matvid[class][class],html body .fc-prod-story[class][class],html body [class*="fc-material-video"][class]{padding:20px 10px !important;}html body .fc-matvid[class] .fc-matvid__inner[class][class],html body .fc-matvid[class] [class*="grid"][class],html body .fc-prod-story[class] [class*="grid"][class],html body .fc-prod-story[class] .columns[class]{display:flex !important;flex-direction:column !important;grid-template-columns:1fr !important;gap:12px !important;}html body .fc-matvid[class] h2[class],html body .fc-matvid[class] h2,html body .fc-prod-story[class] h2[class],html body .fc-prod-story[class] h2{font-size:19px !important;}html body .fc-matvid[class] video,html body [class*="fc-material-video"][class] video{width:100% !important;max-height:40vh !important;object-fit:cover !important;border-radius:10px !important;}html body .fc-matvid[class] .fc-matvid__stats[class][class]{display:grid !important;grid-template-columns:1fr 1fr !important;gap:8px !important;}html body .fc-matvid[class] .fc-matvid__stat[class][class]{padding:8px !important;font-size:12px !important;}html body .cm-vers[class][class],html body .fc-versatility[class][class],html body [class*="versatility"][class]{padding:20px 10px !important;}html body .cm-vers[class] h2,html body .cm-vers[class] h2[class][class],html body [class*="versatility"][class] h2{font-size:19px !important;margin:0 0 10px !important;}html body .cm-vers[class] [class*="grid"][class],html body [class*="versatility"][class] [class*="grid"][class]{display:grid !important;grid-template-columns:1fr 1fr !important;gap:8px !important;}html body .cm-vers[class] [class*="card"][class],html body .cm-vers[class] [class*="item"][class],html body [class*="versatility"][class] [class*="card"][class]{padding:10px 8px !important;min-height:0 !important;}html body .cm-vers[class] [class*="card"][class] svg,html body .cm-vers[class] [class*="icon"][class]{width:24px !important;height:24px !important;}html body .fc-match[class][class],html body [class*="fc-quiz"][class]{padding:20px 10px !important;}html body .fc-match[class] h1[class],html body .fc-match[class] h1,html body .fc-match[class] h2[class],html body .fc-match[class] h2,html body [class*="fc-quiz"][class] h1,html body [class*="fc-quiz"][class] h2{font-size:19px !important;line-height:1.2 !important;margin:0 0 8px !important;}html body .fc-match[class] .fc-match__options[class][class],html body [class*="fc-quiz"][class] [class*="options"][class]{display:grid !important;grid-template-columns:1fr !important;gap:8px !important;}html body .fc-match[class] .fc-match__option[class][class],html body [class*="fc-quiz"][class] .fc-quiz__option[class],html body [class*="fc-quiz"][class] button{padding:12px 14px !important;font-size:13px !important;min-height:44px !important;}html body .fc-accord[class][class],html body .fc-faq[class][class]{padding:20px 10px !important;}html body .fc-accord[class] h2[class],html body .fc-accord[class] h2,html body .fc-faq[class] h2[class],html body .fc-faq[class] h2{font-size:19px !important;margin:0 0 10px !important;}html body .fc-accord[class] .fc-accord__grid[class][class]{grid-template-columns:1fr !important;gap:6px !important;}html body .fc-accord[class] .fc-accord__item[class][class],html body .fc-faq[class] .fc-faq__item[class]{margin-bottom:6px !important;}html body .fc-accord[class] .fc-accord__trigger[class][class][class],html body .fc-faq[class] .fc-faq__q[class][class],html body button.fc-accord__trigger[class][class][class]{padding:10px 12px !important;font-size:13px !important;gap:8px !important;line-height:1.3 !important;}html body .fc-accord[class] .fc-accord__content[class][class],html body .fc-faq[class] .fc-faq__a[class][class]{padding:0 12px 10px !important;font-size:13px !important;line-height:1.45 !important;}html body .fc-rev[class][class],html body [class*="fc-reviews"][class]{padding:20px 10px !important;}html body .fc-rev[class] h2[class],html body .fc-rev[class] h2,html body [class*="fc-reviews"][class] h2{font-size:19px !important;}html body .fc-rev[class] .fc-rev__grid[class][class],html body [class*="fc-reviews"][class] [class*="grid"][class]{display:grid !important;grid-template-columns:1fr !important;gap:10px !important;}html body .fc-rev[class] .fc-rev__card[class][class][class]{padding:12px !important;border-radius:10px !important;font-size:13px !important;}html body .fc-materials[class][class]{padding:20px 10px !important;}html body .fc-materials[class] .fc-materials__grid[class][class],html body .fc-materials[class] [class*="grid"][class]{grid-template-columns:1fr 1fr !important;gap:8px !important;}html body .fc-materials[class] .fc-materials__card[class][class]{padding:8px !important;font-size:12px !important;}html body [class*="fc-compare"][class],html body .fc-comp[class][class]{padding:20px 10px !important;}html body [class*="fc-compare"][class] h2,html body .fc-comp[class] h2{font-size:19px !important;}html body [class*="fc-compare"][class] [class*="grid"][class],html body .fc-comp[class] .fc-comp__grid[class][class]{grid-template-columns:1fr 1fr !important;gap:8px !important;}html body .fc-comp[class] .fc-comp__col[class][class],html body .fc-comp[class] .fc-comp__card[class][class]{padding:10px !important;}html body .fc-comp[class] .fc-comp__col[class] h3,html body .fc-comp[class] .fc-comp__card[class] h3{font-size:14px !important;}html body .fc-mega[class][class],html body .fc-prod[class][class],html body .fc-prod-details[class][class]{padding:20px 10px !important;}html body .fc-mega[class]>div,html body .fc-mega[class] .fc-mega__inner[class],html body .fc-prod-details[class]>div,html body .fc-prod-details[class] .fc-prod-details__inner[class]{display:flex !important;flex-direction:column !important;grid-template-columns:1fr !important;gap:12px !important;}html body .fc-mega[class] h2{font-size:19px !important;}html body .fc-mega[class] img{width:100% !important;height:auto !important;border-radius:10px !important;}html body .fc-trust[class][class],html body [class*="fc-trust"][class]{padding:10px 8px !important;}html body .fc-trust[class] .fc-trust__row[class],html body [class*="fc-trust"][class] [class*="grid"][class]{grid-template-columns:repeat(2,1fr) !important;gap:6px !important;}html body .trust-badge[class],html body .fc-trust[class] .fc-trust__badge[class]{padding:4px 6px !important;font-size:10px !important;}html body .fc-cta[class][class]{padding:24px 10px !important;text-align:center !important;}html body .fc-cta[class] .fc-cta__title[class][class],html body .fc-cta[class] h2{font-size:19px !important;line-height:1.2 !important;}html body .fc-cta[class] p{font-size:13px !important;}html body .fc-nl[class][class]{padding:20px 10px !important;}html body .fc-nl[class] h2{font-size:18px !important;}html body .fc-nl[class] .fc-nl__form[class][class]{display:flex !important;flex-direction:column !important;gap:6px !important;}html body .fc-nl[class] .fc-nl__input[class][class]{font-size:16px !important;padding:10px 12px !important;width:100% !important;}html body .fc-ft[class][class],html body .fc-foot[class][class],html body [class*="fc-footer"][class]{padding:20px 12px 12px !important;}html body .fc-ft[class] .fc-ft__grid[class][class],html body .fc-foot[class] .fc-foot__cols[class],html body [class*="fc-footer"][class] [class*="grid"][class]{display:grid !important;grid-template-columns:1fr 1fr !important;gap:14px !important;}html body .fc-ft[class] .fc-ft__col[class]:first-child,html body .fc-ft[class] .fc-ft__brand[class],html body .fc-foot[class] .fc-foot__brand[class],html body .fc-foot[class] .fc-foot__cols[class]>:first-child{grid-column:1/-1 !important;}html body .fc-ft[class] .fc-ft__h[class][class],html body .fc-foot[class] h4{font-size:12px !important;margin-bottom:6px !important;text-transform:uppercase !important;letter-spacing:0.05em !important;}html body .fc-ft[class] .fc-ft__link[class][class],html body .fc-foot[class] a{font-size:12px !important;line-height:1.7 !important;}html body #cart-drawer.fc-cart-drawer,html body .cart-drawer[class][class],html body cart-drawer{width:100vw !important;max-width:100vw !important;}html body .cart-drawer[class] .cart-drawer__body[class],html body .cart-drawer[class] .cart-drawer__items[class]{padding:10px !important;}html body .cart-drawer[class] .cart-drawer__item[class]{padding:8px 0 !important;gap:8px !important;}html body .cart-drawer[class] .cart-drawer__item[class] img{width:56px !important;height:56px !important;}html body .cart-drawer[class] .cart-drawer__title[class]{font-size:13px !important;line-height:1.3 !important;}html body .cart-drawer[class] .cart-drawer__price[class]{font-size:13px !important;}html body .fc-cart[class][class],html body main-cart,html body .main-cart[class]{padding:16px 10px !important;}html body .fc-cart[class] .fc-cart__item[class],html body .cart-item[class]{gap:10px !important;padding:10px 0 !important;}html body .fc-cart[class] .fc-cart__item[class] img,html body .cart-item[class] img{width:64px !important;height:64px !important;}html body .fc-popup[class][class],html body [class*="fc-popup"][class]{padding:14px !important;max-width:calc(100vw - 24px) !important;}html body .fc-popup[class] h2{font-size:18px !important;}html body .fc-popup[class] p{font-size:12px !important;}html body .btn[class],html body button.button[class],html body a.button[class],html body [class*="fc-btn"][class],html body .shopify-payment-button__button[class]{padding:10px 18px !important;font-size:13px !important;min-height:42px !important;line-height:1.2 !important;}html body input,html body textarea,html body select{font-size:16px !important;padding:10px 12px !important;}html body img,html body video,html body iframe{max-width:100% !important;height:auto;}html body .fc-rv[class],html body [class*="fc-rv"][class]{overflow-x:hidden !important;}html body [class*="grid-3"][class],html body [class*="grid-4"][class],html body [class*="cols-3"][class],html body [class*="cols-4"][class],html body [class*="-3col"][class],html body [class*="-4col"][class]{grid-template-columns:1fr 1fr !important;gap:8px !important;}html body .fc-decor[class],html body [class*="fc-parallax"][class],html body [class*="decorative"][class]:not(h1):not(h2){display:none !important;}}@media (max-width:380px){html body h1[class],html body h1,html body .h1[class]{font-size:22px !important;}html body h2[class],html body h2,html body .h2[class]{font-size:17px !important;}html body [class*="fc-hero"][class] h1,html body .fc-hero4[class] .fc-hero4__headline[class][class]{font-size:23px !important;}html body .fc-shop[class] .fc-shop__grid[class][class]{gap:6px !important;}html body .page-width[class],html body .container[class],html body .fc-rv[class]{padding-left:8px !important;padding-right:8px !important;}html body .fc-ft[class] .fc-ft__grid[class][class]{grid-template-columns:1fr !important;}}@media (min-width:750px) and (max-width:989px){html body h1,html body .h1{font-size:40px;}html body h2,html body .h2{font-size:28px;}html body [class*="fc-hero"]{padding:48px 28px;}html body .fc-shop .fc-shop__grid{grid-template-columns:repeat(3,1fr);gap:14px;}html body .fc-ft .fc-ft__grid,html body .fc-foot .fc-foot__cols{grid-template-columns:repeat(3,1fr);}} /* ===== fc-mobile-v6.css ===== */ /* ============================================================ fc-mobile-v6.css — Hero proportions + Collection overlays Premium mobile polish pass ============================================================ */ /* ---------- MOBILE (≤ 849px) ---------- */ @media (max-width: 849px){ /* ============================================================ 1) HERO4 — proper vertical rhythm, no overlap ============================================================ */ html body .fc-hero4{ position: relative !important; height: auto !important; min-height: 0 !important; aspect-ratio: auto !important; padding: 0 !important; display: flex !important; flex-direction: column !important; background: #1B2A4A !important; overflow: hidden !important; } /* Image wrapper sits at top, fixed ratio */ html body .fc-hero4 .fc-hero4__bg, html body .fc-hero4 > img, html body .fc-hero4 picture{ position: relative !important; width: 100% !important; height: auto !important; aspect-ratio: 4 / 5 !important; max-height: 62vh !important; overflow: hidden !important; z-index: 1 !important; } html body .fc-hero4 .fc-hero4__bg img, html body .fc-hero4 > img{ width: 100% !important; height: 100% !important; object-fit: cover !important; object-position: center 45% !important; display: block !important; } /* Premium overlay gradient — bottom scrim for text legibility */ html body .fc-hero4 .fc-hero4__overlay{ position: absolute !important; inset: 0 !important; background: linear-gradient(180deg, rgba(15,22,40,0.12) 0%, rgba(15,22,40,0.0) 30%, rgba(15,22,40,0.05) 55%, rgba(15,22,40,0.62) 88%, rgba(15,22,40,0.85) 100%) !important; z-index: 2 !important; pointer-events: none !important; } /* Content stack sits in bottom ~40% of image — not overlapping badly */ html body .fc-hero4 .fc-hero4__content{ position: absolute !important; left: 0 !important; right: 0 !important; bottom: 0 !important; padding: 0 22px 26px !important; display: flex !important; flex-direction: column !important; align-items: center !important; gap: 12px !important; z-index: 3 !important; text-align: center !important; } /* Pill tag — compact, no wrap overflow */ html body .fc-hero4 .fc-hero4__tag{ display: inline-block !important; max-width: 100% !important; padding: 7px 14px !important; background: rgba(255,255,255,0.14) !important; backdrop-filter: blur(10px) !important; -webkit-backdrop-filter: blur(10px) !important; border: 1px solid rgba(201,184,122,0.45) !important; border-radius: 999px !important; color: #E8D69A !important; font-family: "Inter", sans-serif !important; font-size: 10px !important; font-weight: 600 !important; letter-spacing: 0.18em !important; text-transform: uppercase !important; line-height: 1.3 !important; white-space: normal !important; text-align: center !important; margin: 0 !important; } /* Headline — clean, legible on scrim */ html body .fc-hero4 .fc-hero4__headline{ font-family: "Playfair Display", "Cormorant Garamond", Georgia, serif !important; font-size: 30px !important; line-height: 1.1 !important; font-weight: 600 !important; letter-spacing: -0.01em !important; color: #ffffff !important; margin: 2px 0 6px !important; max-width: 340px !important; text-shadow: 0 2px 18px rgba(15,22,40,0.35) !important; } /* CTA — compact premium pill */ html body .fc-hero4 .fc-hero4__cta{ display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 13px 28px !important; background: linear-gradient(135deg, #E8D69A 0%, #C9B87A 55%, #8A6A1E 100%) !important; color: #0F1628 !important; font-family: "Inter", sans-serif !important; font-size: 12px !important; font-weight: 700 !important; letter-spacing: 0.14em !important; text-transform: uppercase !important; text-decoration: none !important; border: none !important; border-radius: 999px !important; box-shadow: 0 10px 24px rgba(15,22,40,0.45), inset 0 1px 0 rgba(255,255,255,0.35) !important; width: auto !important; min-width: 0 !important; max-width: 86% !important; margin: 4px 0 0 !important; } html body .fc-hero4 .fc-hero4__cta:active{ transform: scale(0.97) !important; } /* Hide or shrink hero timer to declutter top of page */ html body .fc-hero4-timer{ padding: 14px 16px !important; background: #1B2A4A !important; border-top: 1px solid rgba(201,184,122,0.12) !important; } html body .fc-hero4-timer__inner{ flex-direction: row !important; gap: 10px !important; justify-content: center !important; align-items: center !important; flex-wrap: wrap !important; } html body .fc-hero4-timer__label{ font-size: 11px !important; letter-spacing: 0.14em !important; color: #C9B87A !important; } html body .fc-hero4-timer__number{ font-size: 14px !important; padding: 4px 7px !important; min-width: 30px !important; } /* ============================================================ 2) COLLECTION GRID — premium mobile card polish + overlays ============================================================ */ /* Collection header block tightening */ html body .fc-shop__header, html body .fc-coll__header{ padding: 28px 20px 14px !important; text-align: center !important; } html body .fc-shop__eyebrow, html body .fc-coll__eyebrow{ font-size: 11px !important; font-weight: 700 !important; letter-spacing: 0.24em !important; color: #C9A23A !important; margin: 0 0 8px !important; text-transform: uppercase !important; } html body .fc-shop__title, html body .fc-coll__title{ font-family: "Playfair Display", Georgia, serif !important; font-size: 26px !important; font-weight: 600 !important; line-height: 1.15 !important; color: #0F1628 !important; margin: 0 0 10px !important; letter-spacing: -0.01em !important; } html body .fc-shop__intro, html body .fc-coll__intro, html body .fc-shop__desc, html body .fc-coll__desc{ font-size: 14px !important; line-height: 1.55 !important; color: #5a6580 !important; max-width: 420px !important; margin: 0 auto 8px !important; } /* Divider line below header */ html body .fc-shop__header::after, html body .fc-coll__header::after{ content: ""; display: block; width: 100%; max-width: 560px; margin: 16px auto 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(27,42,74,0.12) 50%, transparent); } /* Product card — premium lift */ html body .fc-coll__card:not(.fc-coll__card--oro):not(.fc-coll__card--argento), html body .fc-shop__card, html body .product-card, html body .card-wrapper{ position: relative !important; background: #ffffff !important; border-radius: 14px !important; overflow: hidden !important; box-shadow: 0 4px 18px rgba(15,22,40,0.06), 0 1px 2px rgba(15,22,40,0.04) !important; transition: transform 0.24s ease, box-shadow 0.24s ease !important; } html body .fc-coll__card:not(.fc-coll__card--oro):not(.fc-coll__card--argento):active, html body .fc-shop__card:active, html body .product-card:active{ transform: scale(0.985) !important; box-shadow: 0 2px 10px rgba(15,22,40,0.08) !important; } /* Product image — consistent ratio + subtle overlay */ html body .fc-coll__card-media, html body .fc-shop__card-media, html body .card-media, html body .product-card__media, html body .card__media{ position: relative !important; aspect-ratio: 1 / 1 !important; width: 100% !important; overflow: hidden !important; background: linear-gradient(180deg, #FAF7F1 0%, #F3EDE2 100%) !important; } html body .fc-coll__card-media img, html body .fc-shop__card-media img, html body .card-media img, html body .product-card__media img, html body .card__media img{ width: 100% !important; height: 100% !important; object-fit: contain !important; padding: 14px !important; transition: transform 0.4s ease !important; } /* Beautiful overlay on image — gold top glaze + bottom fade */ html body .fc-coll__card-media::before, html body .fc-shop__card-media::before, html body .card-media::before, html body .product-card__media::before{ content: "" !important; position: absolute !important; inset: 0 !important; background: radial-gradient(120% 80% at 50% -20%, rgba(201,154,58,0.10) 0%, transparent 55%), linear-gradient(180deg, transparent 60%, rgba(15,22,40,0.04) 100%) !important; pointer-events: none !important; z-index: 1 !important; } /* Sale badge if present */ html body .fc-coll__card-badge, html body .fc-shop__card-badge, html body .badge--sale, html body .price-badge--sale{ position: absolute !important; top: 10px !important; left: 10px !important; z-index: 2 !important; background: #1B2A4A !important; color: #E8D69A !important; font-size: 10px !important; font-weight: 700 !important; letter-spacing: 0.12em !important; padding: 4px 9px !important; border-radius: 999px !important; text-transform: uppercase !important; } /* Card body */ html body .fc-coll__card-body, html body .fc-shop__card-body, html body .card__content, html body .card-information{ padding: 12px 12px 14px !important; } /* Title — 2 line clamp, readable */ html body .fc-coll__card-title, html body .fc-shop__card-title, html body .card__heading, html body .card-information a, html body .product-card__title{ font-family: "Inter", sans-serif !important; font-size: 13px !important; font-weight: 600 !important; line-height: 1.3 !important; color: #0F1628 !important; letter-spacing: -0.005em !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; margin: 0 0 6px !important; min-height: 34px !important; } /* Price row — aligned, premium */ html body .fc-coll__card-price-row, html body .fc-shop__card-price-row, html body .price, html body .card__price{ display: flex !important; align-items: baseline !important; gap: 8px !important; flex-wrap: wrap !important; margin-top: 2px !important; } html body .fc-coll__card-price, html body .fc-shop__card-price, html body .price__regular, html body .price-item--regular, html body .price-item--sale{ font-family: "Inter", sans-serif !important; font-size: 15px !important; font-weight: 700 !important; color: #1B2A4A !important; letter-spacing: -0.01em !important; } html body .fc-coll__card-price--compare, html body .fc-shop__card-price--compare, html body .price__compare, html body .price-item--regular.price-item--compare, html body s.price-item--regular{ font-size: 12px !important; font-weight: 500 !important; color: #8791a8 !important; text-decoration: line-through !important; } /* Image gentle zoom on press (mobile tap) */ html body .fc-coll__card:active .fc-coll__card-media img, html body .fc-shop__card:active .fc-shop__card-media img, html body .product-card:active .card-media img{ transform: scale(1.03) !important; } /* Section background subtle warm */ html body .fc-shop, html body .fc-coll{ background: linear-gradient(180deg, #FAF7F1 0%, #F3EDE2 100%) !important; } } /* ---------- VERY SMALL PHONES (≤ 380px) ---------- */ @media (max-width: 380px){ html body .fc-hero4 .fc-hero4__headline{ font-size: 26px !important; } html body .fc-hero4 .fc-hero4__cta{ padding: 12px 22px !important; font-size: 11px !important; } html body .fc-coll__card-title, html body .fc-shop__card-title, html body .card__heading{ font-size: 12px !important; } } /* End fc-mobile-v6.css */ /* ===== fc-mobile-tight.css ===== */ /* fc-mobile-tight.css — Zalando-style compact proportions * Loaded AFTER fc-mobile-fix-v3.css to down-tune aggressive sizes. * Target: 390–430px viewports. Mobile-only via @media. */ @media (max-width: 849px) { /* ---------- HERO / SECTION HEADINGS — tighter scale ---------- */ .fc-hero__title, .fc-hero4__title, .fc-hero-title, h1.fc-hero__title, section[class*="hero"] h1, section[class*="Hero"] h1 { font-size: clamp(22px, 6vw, 28px) !important; line-height: 1.12 !important; letter-spacing: -.018em !important; margin: 0 0 8px !important; } .fc-hero__tag, .fc-hero4__tag, .fc-hero-tag, section[class*="hero"] [class*="tag"], section[class*="Hero"] [class*="tag"] { font-size: 10px !important; letter-spacing: .18em !important; padding: 4px 10px !important; } .fc-hero__sub, .fc-hero4__sub, .fc-hero-sub, section[class*="hero"] p, section[class*="Hero"] p { font-size: 13px !important; line-height: 1.45 !important; margin: 0 0 12px !important; } /* ---------- USP2 FEATURE CARDS — tighter ---------- */ .cm-usp2 { padding: 24px 0 !important; } .cm-usp2__title { font-size: clamp(18px, 5vw, 22px) !important; line-height: 1.18 !important; letter-spacing: -.01em !important; margin: 0 0 6px !important; } .cm-usp2__grid { gap: 10px !important; } .cm-usp2__card { padding: 14px 14px 16px !important; } .cm-usp2__card h3, .cm-usp2__card-title { font-size: 13px !important; letter-spacing: .03em !important; margin: 0 0 6px !important; } .cm-usp2__card p, .cm-usp2__card-text { font-size: 13px !important; line-height: 1.45 !important; } .cm-usp2__card li { font-size: 12.5px !important; padding: 1px 0 !important; } .cm-usp2__card .cm-usp2__icon { width: 32px !important; height: 32px !important; margin: 0 0 8px !important; } /* ---------- ORO / ARGENTO HERO CARDS — tighter ---------- */ .fc-coll__card { min-height: 340px !important; padding: 20px 18px 22px !important; } .fc-coll__card-title, .fc-coll__card h3 { font-size: 22px !important; line-height: 1.1 !important; margin: 2px 0 4px !important; } .fc-coll__card-tag { font-size: 10px !important; letter-spacing: .22em !important; } .fc-coll__card-desc, .fc-coll__card p { font-size: 12.5px !important; line-height: 1.45 !important; margin: 0 0 8px !important; } .fc-coll__card-cta, .fc-coll__card .btn { min-height: 38px !important; padding: 9px 16px !important; font-size: 11px !important; letter-spacing: .12em !important; margin-top: 4px !important; } /* ---------- PRODUCT GRID CARDS — compact Zalando feel ---------- */ .fc-coll__products-grid, .fc-coll-products, .fc-collection-product-grid { gap: 6px !important; padding: 12px 8px 32px !important; } .fc-coll__card-info { padding: 8px 2px 10px !important; gap: 2px !important; } .fc-coll__card-name { font-size: 12.5px !important; line-height: 1.3 !important; margin: 0 0 2px !important; min-height: 2.6em; } .fc-coll__card-price-row, .fc-coll__card-prices { gap: 6px !important; margin: 0 !important; } .fc-coll__card-price, .fc-collection-card-price-now { font-size: 14px !important; font-weight: 700 !important; line-height: 1.2 !important; } .fc-coll__card-compare, .fc-collection-card-price-old { font-size: 11.5px !important; line-height: 1.2 !important; } .fc-coll__card-btn { min-height: 32px !important; padding: 6px 10px !important; font-size: 10px !important; letter-spacing: .1em !important; margin-top: 6px !important; } .fc-coll__card-img, .fc-collection-card-img { aspect-ratio: 3/4 !important; border-radius: 10px !important; } .fc-coll__card { border-radius: 10px !important; } /* ---------- MATCH / RELATED PRODUCTS ---------- */ .fc-match__product-name { font-size: 12.5px !important; line-height: 1.3 !important; } .fc-match__product-price-now { font-size: 14px !important; } .fc-match__product-price-old { font-size: 11.5px !important; } /* ---------- COLLECTION PAGE HERO ---------- */ .fc-collection-hero { padding: 20px 16px 14px !important; } .fc-collection-hero h1, .fc-collection-hero__title { font-size: clamp(22px, 6vw, 28px) !important; line-height: 1.12 !important; letter-spacing: -.018em !important; margin: 0 0 6px !important; } .fc-collection-hero p, .fc-collection-hero__sub { font-size: 13px !important; line-height: 1.45 !important; } .fc-collection-stats { padding-top: 12px !important; margin-top: 10px !important; } .fc-collection-stats span, .fc-collection-stats__item { font-size: 12px !important; } /* ---------- PRODUCT TEMPLATE ---------- */ .product__title, .fc-product__title, main .product h1 { font-size: clamp(20px, 5.5vw, 26px) !important; line-height: 1.15 !important; letter-spacing: -.015em !important; margin: 0 0 6px !important; } .fc-product__price, .price__regular .price-item, .product__price, [data-product-price] { font-size: 18px !important; font-weight: 700 !important; } .fc-product__compare, .price__sale s { font-size: 13px !important; } .product__description p, .fc-product__desc p { font-size: 13.5px !important; line-height: 1.5 !important; } /* ---------- GLOBAL SECTION PADDINGS — less airy on phone ---------- */ section, .shopify-section { /* only nudge bottoms — avoid global havoc */ } .fc-section, [class*="__w"][class*="fc-"] { padding-left: 16px !important; padding-right: 16px !important; } /* ---------- BUTTONS GLOBAL — tighter default ---------- */ .btn, a[class*="button"]:not(.fc-coll__card-btn):not(.fc-coll__card-cta), button[class*="btn"]:not(.fc-coll__card-btn) { min-height: 40px !important; padding: 10px 18px !important; font-size: 12px !important; letter-spacing: .08em !important; } /* ---------- TICKER — slightly shorter ---------- */ .fc-ticker { padding: 8px 0 !important; } .fc-ticker__item, .fc-ticker span { font-size: 11px !important; letter-spacing: .14em !important; } /* ---------- BODY base — reduce overall zoom feel ---------- */ body { font-size: 14px !important; } h2, .fc-section__title { font-size: clamp(19px, 5vw, 24px) !important; line-height: 1.15 !important; letter-spacing: -.01em !important; margin: 0 0 10px !important; } h3 { font-size: 15px !important; line-height: 1.2 !important; } /* ---------- RATING STRIP ---------- */ .fc-rating-strip { padding: 10px 14px !important; } .fc-rating-strip__score { font-size: 14px !important; } .fc-rating-strip__label { font-size: 11px !important; } } /* ===== fc-mobile-final.css ===== */ /* fc-mobile-final.css * Cucina Modena - Authoritative mobile override layer. * Loads LAST in theme.liquid. Uses boosted specificity (html body) to win cascade * against fc-mobile-fixes.css, fc-mobile-premium.css, fc-mobile-fix-v3.css, * fc-mobile-tighten.css, fc-mobile-v6.css, fc-mobile-tight.css. * * Goal: premium mobile proportions (a la Zalando / Apple / Nespresso). * Targets ACTUAL DOM classes found in live inspection. * Breakpoint strategy: mobile-first up to 849px. */ /* ============================================================ * 1. GLOBAL MOBILE BASE * ============================================================ */ @media (max-width: 849px) { html body { font-size: 14px !important; -webkit-text-size-adjust: 100% !important; } html body, html body * { -webkit-tap-highlight-color: transparent; } /* Prevent horizontal scroll */ html, body { overflow-x: hidden !important; max-width: 100vw !important; } /* Container padding — consistent 16px edge gutter */ html body .fc-coll__inner, html body .fc-shop__inner, html body .fc-materials__container, html body .fc-rev__inner, html body .fc-faq__inner, html body .fc-hero4__content, html body .fc-vshow__inner, html body .fc-ft__inner, html body .fc-header__container, html body .fc-match, html body .fc-bundles, html body .fc-prod__inner, html body .fc-collection-hero-inner, html body .fc-collection-grid-wrap { padding-left: 16px !important; padding-right: 16px !important; max-width: 100% !important; box-sizing: border-box !important; } /* Section vertical rhythm */ html body .fc-coll, html body .fc-shop, html body .fc-materials, html body .fc-compare, html body .fc-rev, html body .fc-faq, html body .fc-vshow, html body .fc-hero4 { padding-top: 32px !important; padding-bottom: 32px !important; } html body h1, html body h2 { letter-spacing: -.01em !important; } html body h3, html body h4 { letter-spacing: 0 !important; } } /* ============================================================ * 2. HEADER / TICKER * ============================================================ */ @media (max-width: 849px) { html body .fc-header__container { padding: 10px 16px !important; gap: 10px !important; } html body .fc-header__logo-text { font-size: 17px !important; letter-spacing: .02em !important; } html body .fc-header__nav { display: none !important; } html body .fc-header__burger { width: 36px !important; height: 36px !important; padding: 8px !important; display: inline-flex !important; } html body .fc-header__cart { padding: 6px !important; } html body .fc-ticker { padding: 6px 0 !important; } html body .fc-ticker__track, html body .fc-ticker__row { gap: 28px !important; } html body .fc-ticker__item, html body .fc-ticker span { font-size: 10.5px !important; letter-spacing: .14em !important; white-space: nowrap !important; } html body .fc-ticker__dot { width: 3px !important; height: 3px !important; } } /* ============================================================ * 3. HERO (fc-hero4) * ============================================================ */ @media (max-width: 849px) { html body .fc-hero4 { min-height: 78vh !important; padding: 0 !important; } html body .fc-hero4__content { padding: 48px 20px 36px !important; text-align: center !important; } html body .fc-hero4__tag { font-size: 10px !important; letter-spacing: .22em !important; padding: 5px 12px !important; margin: 0 0 14px !important; display: inline-block !important; } html body .fc-hero4__headline { font-size: clamp(30px, 8.5vw, 40px) !important; line-height: 1.08 !important; letter-spacing: -.02em !important; margin: 0 0 14px !important; font-weight: 700 !important; } html body .fc-hero4__content p { font-size: 14px !important; line-height: 1.5 !important; margin: 0 auto 20px !important; max-width: 320px !important; } html body .fc-hero4__cta { min-height: 46px !important; padding: 13px 24px !important; font-size: 12px !important; letter-spacing: .12em !important; border-radius: 2px !important; } /* Timer in hero */ html body .fc-hero4-timer { margin-top: 18px !important; gap: 8px !important; } html body .fc-hero4-timer__block { padding: 8px 10px !important; min-width: 52px !important; border-radius: 4px !important; } html body .fc-hero4-timer__number { font-size: 18px !important; font-weight: 700 !important; } html body .fc-hero4-timer__label { font-size: 9px !important; letter-spacing: .12em !important; margin-top: 2px !important; } html body .fc-hero4-timer__sep { font-size: 14px !important; } } /* ============================================================ * 4. RATING STRIP * ============================================================ */ @media (max-width: 849px) { html body .fc-rating-strip { padding: 12px 16px !important; gap: 10px !important; } html body .fc-rating-strip__score { font-size: 13px !important; font-weight: 700 !important; } html body .fc-rating-strip__label { font-size: 10.5px !important; letter-spacing: .06em !important; } } /* ============================================================ * 5. USP BAR * ============================================================ */ @media (max-width: 849px) { html body .fc-usp-bar { padding: 14px 0 !important; gap: 0 !important; } html body .fc-usp-bar > * { font-size: 11px !important; letter-spacing: .08em !important; padding: 0 12px !important; } } /* ============================================================ * 6. HOMEPAGE COLLECTION HERO CARDS — Oro / Argento * (fc-collections.liquid uses .fc-coll__card--oro / .fc-coll__card--argento) * ============================================================ */ @media (max-width: 849px) { html body .fc-collections-section { padding: 24px 0 !important; } html body .fc-coll__heading { margin-bottom: 18px !important; text-align: center !important; } html body .fc-coll__title { font-size: clamp(22px, 6vw, 28px) !important; line-height: 1.12 !important; letter-spacing: -.015em !important; margin: 0 0 6px !important; font-weight: 700 !important; } html body .fc-coll__subtitle { font-size: 13px !important; line-height: 1.5 !important; margin: 0 auto !important; max-width: 320px !important; color: rgba(27,42,74,.6) !important; } /* HOMEPAGE collection grid — stack Oro/Argento hero cards vertically */ html body .fc-coll__grid { grid-template-columns: 1fr !important; gap: 14px !important; padding: 0 !important; } html body .fc-coll__card { min-height: 320px !important; padding: 22px 20px 24px !important; border-radius: 12px !important; aspect-ratio: auto !important; position: relative !important; overflow: hidden !important; display: flex !important; flex-direction: column !important; justify-content: flex-end !important; } html body .fc-coll__card-overlay { background: linear-gradient(180deg, rgba(0,0,0,0) 30%, rgba(0,0,0,.55) 100%) !important; } html body .fc-coll__card-content { position: relative !important; z-index: 2 !important; color: #fff !important; } html body .fc-coll__card-icon { width: 38px !important; height: 38px !important; margin: 0 0 10px !important; } html body .fc-coll__card-label { font-size: 10px !important; letter-spacing: .22em !important; margin: 0 0 6px !important; opacity: .85 !important; } html body .fc-coll__card-name { font-size: 24px !important; line-height: 1.1 !important; letter-spacing: -.01em !important; margin: 0 0 8px !important; font-weight: 700 !important; color: #fff !important; min-height: 0 !important; } html body .fc-coll__card-desc { font-size: 13px !important; line-height: 1.5 !important; margin: 0 0 14px !important; color: rgba(255,255,255,.85) !important; max-width: 100% !important; } html body .fc-coll__card-btn { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-height: 40px !important; padding: 10px 18px !important; font-size: 11px !important; letter-spacing: .14em !important; border-radius: 2px !important; width: auto !important; align-self: flex-start !important; font-weight: 600 !important; } html body .fc-coll__card--oro .fc-coll__card-btn { background: #C5975B !important; color: #fff !important; } html body .fc-coll__card--argento .fc-coll__card-btn { background: #fff !important; color: #1B2A4A !important; } } /* ============================================================ * 7. USP2 FEATURE CARDS * ============================================================ */ @media (max-width: 849px) { html body .cm-usp2 { padding: 28px 0 !important; } html body .cm-usp2__inner { padding: 0 16px !important; } html body .cm-usp2__header { margin-bottom: 18px !important; text-align: center !important; } html body .cm-usp2__title { font-size: clamp(20px, 5.5vw, 26px) !important; line-height: 1.15 !important; letter-spacing: -.01em !important; margin: 0 0 6px !important; font-weight: 700 !important; } html body .cm-usp2__subtitle { font-size: 13px !important; line-height: 1.5 !important; } html body .cm-usp2__grid { grid-template-columns: 1fr !important; gap: 10px !important; } html body .cm-usp2__card { padding: 16px 16px 18px !important; border-radius: 10px !important; } html body .cm-usp2__icon { width: 34px !important; height: 34px !important; margin: 0 0 10px !important; } html body .cm-usp2__card-title, html body .cm-usp2__card h3 { font-size: 14px !important; letter-spacing: .02em !important; margin: 0 0 6px !important; font-weight: 700 !important; } html body .cm-usp2__card-text, html body .cm-usp2__card p { font-size: 13px !important; line-height: 1.5 !important; margin: 0 !important; } } /* ============================================================ * 8. SHOP GRID (homepage product grid) * ============================================================ */ @media (max-width: 849px) { html body .fc-shop { padding: 28px 0 !important; } html body .fc-shop__inner { padding: 0 12px !important; } html body .fc-shop__head { margin-bottom: 16px !important; text-align: center !important; } html body .fc-shop__title { font-size: clamp(20px, 5.5vw, 26px) !important; line-height: 1.15 !important; margin: 0 0 4px !important; font-weight: 700 !important; letter-spacing: -.01em !important; } html body .fc-shop__desc { font-size: 13px !important; line-height: 1.5 !important; } html body .fc-shop__grid { grid-template-columns: 1fr 1fr !important; gap: 10px !important; padding: 0 !important; } html body .fc-shop__card { border-radius: 8px !important; overflow: hidden !important; background: #fff !important; display: flex !important; flex-direction: column !important; } html body .fc-shop__img-link, html body .fc-shop__img { aspect-ratio: 3/4 !important; width: 100% !important; overflow: hidden !important; display: block !important; border-radius: 8px 8px 0 0 !important; } html body .fc-shop__img img { width: 100% !important; height: 100% !important; object-fit: cover !important; } html body .fc-shop__info { padding: 8px 8px 12px !important; gap: 2px !important; display: flex !important; flex-direction: column !important; } html body .fc-shop__tag { font-size: 9px !important; letter-spacing: .14em !important; margin: 0 0 2px !important; color: #C5975B !important; } html body .fc-shop__name { font-size: 12.5px !important; line-height: 1.3 !important; font-weight: 600 !important; margin: 0 0 2px !important; color: #1B2A4A !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; min-height: 2.6em !important; } html body .fc-shop__price { margin: 2px 0 0 !important; font-size: 14px !important; font-weight: 700 !important; color: #1B2A4A !important; display: flex !important; align-items: baseline !important; gap: 6px !important; } html body .fc-shop__amount { font-size: 14px !important; font-weight: 700 !important; } html body .fc-shop__compare { font-size: 11.5px !important; text-decoration: line-through !important; opacity: .55 !important; } html body .fc-shop__atc { min-height: 34px !important; padding: 7px 10px !important; font-size: 10.5px !important; letter-spacing: .08em !important; border-radius: 2px !important; margin-top: 6px !important; font-weight: 600 !important; } html body .fc-shop__badge { font-size: 9px !important; padding: 3px 6px !important; letter-spacing: .1em !important; } } /* ============================================================ * 9. MATERIALS / VIDEO SHOW / COMPARE / ACCORDION / FAQ / REVIEWS / TRUST * ============================================================ */ @media (max-width: 849px) { html body .fc-materials__title, html body .fc-vshow__heading, html body .fc-rev__title, html body .fc-faq__title, html body .fc-compare4__title, html body .fc-accord__title, html body .fc-versatility__title { font-size: clamp(20px, 5.5vw, 26px) !important; line-height: 1.15 !important; letter-spacing: -.01em !important; margin: 0 0 8px !important; font-weight: 700 !important; } html body .fc-materials__intro p, html body .fc-vshow__content p, html body .fc-rev__head p, html body .fc-faq__head p { font-size: 13px !important; line-height: 1.5 !important; } /* Materials layers */ html body .fc-materials__layers { grid-template-columns: 1fr !important; gap: 10px !important; margin-top: 18px !important; } html body .fc-materials__layer { padding: 14px !important; border-radius: 8px !important; } html body .fc-materials__layer-title { font-size: 14px !important; margin: 0 0 4px !important; } html body .fc-materials__layer-desc { font-size: 12.5px !important; line-height: 1.45 !important; } html body .fc-materials__layer-number { font-size: 11px !important; } /* Video Show */ html body .fc-vshow__inner { gap: 18px !important; grid-template-columns: 1fr !important; } html body .fc-vshow__eyebrow { font-size: 10px !important; letter-spacing: .18em !important; } html body .fc-vshow__cta { min-height: 42px !important; padding: 11px 18px !important; font-size: 11px !important; letter-spacing: .12em !important; } /* Compare */ html body .fc-compare, html body .fc-compare4 { padding: 28px 0 !important; } html body .fc-compare__grid, html body .fc-compare4__grid { grid-template-columns: 1fr !important; gap: 10px !important; } html body .fc-compare__col, html body .fc-compare4__col { padding: 16px !important; border-radius: 10px !important; } /* Accordion */ html body .fc-accord__grid { grid-template-columns: 1fr !important; gap: 8px !important; } html body .fc-accord__item { padding: 12px 14px !important; } html body .fc-accord__q { font-size: 13px !important; } html body .fc-accord__a { font-size: 12.5px !important; line-height: 1.5 !important; } /* FAQ */ html body .fc-faq__items { gap: 6px !important; } html body .fc-faq__item { padding: 12px 14px !important; border-radius: 8px !important; } html body .fc-faq__q { font-size: 13px !important; line-height: 1.35 !important; font-weight: 600 !important; } html body .fc-faq__a { font-size: 12.5px !important; line-height: 1.55 !important; padding-top: 8px !important; } html body .fc-faq__tag { font-size: 10px !important; letter-spacing: .18em !important; } /* Reviews */ html body .fc-rev__grid { grid-template-columns: 1fr !important; gap: 10px !important; } html body .fc-rev__card { padding: 14px !important; border-radius: 10px !important; } html body .fc-rev__card-text { font-size: 13px !important; line-height: 1.55 !important; } html body .fc-rev__card-name { font-size: 13px !important; font-weight: 600 !important; } html body .fc-rev__card-loc { font-size: 11px !important; opacity: .6 !important; } html body .fc-rev__card-stars { font-size: 13px !important; margin-bottom: 6px !important; } html body .fc-rev__stars-top { font-size: 13px !important; } html body .fc-rev__tag { font-size: 10px !important; letter-spacing: .18em !important; } /* Trust */ html body .fc-trust { padding: 24px 0 !important; } html body .fc-trust__grid { grid-template-columns: repeat(2, 1fr) !important; gap: 14px !important; } html body .fc-trust__item { padding: 10px !important; } html body .fc-trust__label { font-size: 11px !important; line-height: 1.35 !important; } } /* ============================================================ * 10. VERSATILITY / ACCESS / NEWSLETTER / POPUP * ============================================================ */ @media (max-width: 849px) { html body .fc-versatility__grid { grid-template-columns: 1fr !important; gap: 10px !important; } html body .fc-versatility__item { padding: 14px !important; } html body .fc-access { padding: 30px 16px !important; } html body .fc-access__title { font-size: clamp(20px, 5.5vw, 26px) !important; line-height: 1.15 !important; } html body .fc-access__text { font-size: 13px !important; line-height: 1.5 !important; } html body .fc-access__cta { min-height: 44px !important; padding: 12px 20px !important; font-size: 12px !important; } html body .fc-newsletter2 { padding: 30px 16px !important; } html body .fc-newsletter2__title { font-size: clamp(20px, 5.5vw, 26px) !important; margin: 0 0 8px !important; } html body .fc-newsletter2__text { font-size: 13px !important; line-height: 1.5 !important; margin: 0 0 16px !important; } html body .fc-newsletter2__form { flex-direction: column !important; gap: 8px !important; max-width: 100% !important; } html body .fc-newsletter2__input { min-height: 46px !important; font-size: 14px !important; padding: 12px 14px !important; width: 100% !important; border-radius: 4px !important; } html body .fc-newsletter2__btn { min-height: 46px !important; padding: 12px 20px !important; font-size: 12px !important; letter-spacing: .12em !important; width: 100% !important; } html body .fc-popup-it__inner { max-width: 340px !important; padding: 20px 18px !important; } html body .fc-popup-it__title { font-size: 18px !important; line-height: 1.2 !important; } html body .fc-popup-it__text { font-size: 13px !important; line-height: 1.5 !important; } } /* ============================================================ * 11. FOOTER * ============================================================ */ @media (max-width: 849px) { html body .fc-ft { padding: 28px 0 18px !important; } html body .fc-ft__grid { grid-template-columns: 1fr 1fr !important; gap: 20px 14px !important; } html body .fc-ft__col-title { font-size: 12px !important; letter-spacing: .14em !important; margin: 0 0 10px !important; } html body .fc-ft__links { gap: 6px !important; } html body .fc-ft__links a { font-size: 12.5px !important; line-height: 1.4 !important; } html body .fc-ft__brand-name { font-size: 16px !important; letter-spacing: .02em !important; } html body .fc-ft__brand-text { font-size: 12.5px !important; line-height: 1.5 !important; } html body .fc-ft__bottom { padding: 14px 0 0 !important; margin-top: 18px !important; flex-direction: column !important; gap: 10px !important; text-align: center !important; } html body .fc-ft__copy { font-size: 11px !important; } html body .fc-ft__pay { gap: 8px !important; } html body .fc-ft__pay-item { height: 18px !important; } } /* ============================================================ * 12. COLLECTION PAGE (/collections/*) * Actual classes: fc-collection-page, fc-collection-hero, fc-collection-title, * fc-collection-product-grid, fc-collection-card, fc-collection-card-* * ============================================================ */ @media (max-width: 849px) { html body .fc-collection-page { padding-top: 0 !important; } /* Hero section — reduce massive padding */ html body .fc-collection-hero { padding: 22px 16px 18px !important; margin: 0 !important; } html body .fc-collection-hero-inner { padding: 0 !important; text-align: center !important; } html body .fc-collection-badge { font-size: 10px !important; letter-spacing: .22em !important; margin: 0 0 8px !important; color: #C5975B !important; display: inline-block !important; } html body .fc-collection-title { font-size: clamp(24px, 6.5vw, 32px) !important; line-height: 1.1 !important; letter-spacing: -.02em !important; margin: 0 0 8px !important; font-weight: 700 !important; } html body .fc-collection-desc, html body .fc-collection-desc p { font-size: 13px !important; line-height: 1.5 !important; margin: 0 auto !important; max-width: 320px !important; color: rgba(27,42,74,.65) !important; } /* Stats row */ html body .fc-collection-stats { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 10px !important; padding: 14px 0 0 !important; margin-top: 14px !important; border-top: 1px solid rgba(27,42,74,.08) !important; max-width: 100% !important; } html body .fc-collection-stat { text-align: center !important; } html body .fc-collection-stat-num { font-size: 18px !important; line-height: 1.1 !important; font-weight: 700 !important; color: #C5975B !important; display: block !important; margin-bottom: 2px !important; } html body .fc-collection-stat-label { font-size: 9.5px !important; letter-spacing: .14em !important; color: rgba(27,42,74,.5) !important; text-transform: uppercase !important; } /* Product grid — 2 columns like Zalando */ html body .fc-collection-grid-wrap { padding: 18px 12px 36px !important; } html body .fc-collection-product-grid { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 10px !important; padding: 0 !important; max-width: 100% !important; } /* Product card */ html body .fc-collection-card { display: flex !important; flex-direction: column !important; background: #fff !important; border-radius: 8px !important; overflow: hidden !important; border: 1px solid rgba(27,42,74,.04) !important; aspect-ratio: auto !important; min-height: 0 !important; padding: 0 !important; width: 100% !important; height: auto !important; } html body .fc-collection-card-img { display: block !important; width: 100% !important; aspect-ratio: 3/4 !important; object-fit: cover !important; border-radius: 8px 8px 0 0 !important; height: auto !important; max-height: none !important; } html body .fc-collection-card-body { display: flex !important; flex-direction: column !important; padding: 8px 10px 12px !important; gap: 2px !important; flex: 1 !important; } html body .fc-collection-card-tags { display: flex !important; flex-wrap: wrap !important; gap: 4px !important; margin: 0 0 4px !important; } html body .fc-collection-card-tag { font-size: 9px !important; letter-spacing: .12em !important; padding: 2px 5px !important; border-radius: 2px !important; text-transform: uppercase !important; } html body .fc-collection-card-sale { font-size: 9px !important; letter-spacing: .12em !important; padding: 2px 5px !important; background: #C5975B !important; color: #fff !important; border-radius: 2px !important; font-weight: 600 !important; } html body .fc-collection-card-title { font-size: 12.5px !important; line-height: 1.3 !important; font-weight: 600 !important; color: #1B2A4A !important; margin: 0 0 2px !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; text-overflow: ellipsis !important; min-height: 2.6em !important; width: 100% !important; max-width: 100% !important; white-space: normal !important; } html body .fc-collection-card-price { display: flex !important; align-items: baseline !important; gap: 6px !important; flex-wrap: wrap !important; margin: 2px 0 0 !important; } html body .fc-collection-card-price-now { font-size: 14px !important; font-weight: 700 !important; color: #1B2A4A !important; line-height: 1.2 !important; } html body .fc-collection-card-price-old { font-size: 11.5px !important; color: rgba(27,42,74,.5) !important; text-decoration: line-through !important; line-height: 1.2 !important; } html body .fc-collection-card-cta { display: none !important; } /* Bottom CTA under grid */ html body .fc-collection-bottom-cta { padding: 24px 16px !important; text-align: center !important; } html body .fc-collection-btn { min-height: 44px !important; padding: 12px 22px !important; font-size: 12px !important; letter-spacing: .12em !important; } } /* ============================================================ * 13. PRODUCT PAGE * fc-prod__title, fc-prod__price-current, fc-prod__btn, fc-prod__gallery, etc. * ============================================================ */ @media (max-width: 849px) { html body .fc-prod { padding: 16px 0 32px !important; } html body .fc-prod__inner { grid-template-columns: 1fr !important; gap: 18px !important; padding: 0 16px !important; } html body .fc-prod__gallery { position: relative !important; margin: 0 -16px !important; width: calc(100% + 32px) !important; } html body .fc-prod__gallery-main { aspect-ratio: 1/1 !important; width: 100% !important; height: auto !important; border-radius: 0 !important; } html body .fc-prod__gallery-main img { width: 100% !important; height: 100% !important; object-fit: cover !important; } html body .fc-prod__thumbs { display: none !important; } html body .fc-prod__info { padding: 0 !important; } html body .fc-prod__badge { font-size: 10px !important; letter-spacing: .22em !important; margin: 0 0 8px !important; color: #C5975B !important; } html body .fc-prod__title { font-size: clamp(22px, 6vw, 28px) !important; line-height: 1.12 !important; letter-spacing: -.015em !important; margin: 0 0 10px !important; font-weight: 700 !important; } html body .fc-prod__stars { font-size: 13px !important; margin: 0 0 10px !important; display: flex !important; align-items: center !important; gap: 6px !important; } html body .fc-prod__price { display: flex !important; align-items: baseline !important; gap: 10px !important; flex-wrap: wrap !important; margin: 0 0 14px !important; } html body .fc-prod__price-current { font-size: 22px !important; font-weight: 700 !important; color: #1B2A4A !important; line-height: 1.2 !important; } html body .fc-prod__price-compare { font-size: 14px !important; color: rgba(27,42,74,.5) !important; text-decoration: line-through !important; } html body .fc-prod__price-badge { font-size: 10px !important; padding: 3px 8px !important; background: #C5975B !important; color: #fff !important; border-radius: 2px !important; font-weight: 700 !important; letter-spacing: .08em !important; } html body .fc-prod__desc, html body .fc-prod__desc p { font-size: 13.5px !important; line-height: 1.55 !important; color: rgba(27,42,74,.75) !important; margin: 0 0 14px !important; } html body .fc-prod__usps, html body .fc-prod__usp { display: flex !important; flex-direction: column !important; gap: 6px !important; margin: 0 0 14px !important; } html body .fc-prod__usp { font-size: 12.5px !important; padding: 6px 0 !important; align-items: center !important; } html body .fc-prod__form { margin: 0 0 16px !important; } html body .fc-prod__btn { min-height: 50px !important; padding: 14px 20px !important; font-size: 13px !important; letter-spacing: .12em !important; border-radius: 2px !important; width: 100% !important; font-weight: 700 !important; } html body .fc-prod__btn-price { font-size: 14px !important; font-weight: 700 !important; } html body .fc-prod__stock { font-size: 12px !important; margin: 10px 0 !important; } html body .fc-prod__trust { display: grid !important; grid-template-columns: repeat(2, 1fr) !important; gap: 8px !important; padding: 14px 0 !important; margin: 10px 0 0 !important; border-top: 1px solid rgba(27,42,74,.08) !important; } html body .fc-prod__trust-item { font-size: 11px !important; line-height: 1.3 !important; padding: 0 !important; display: flex !important; align-items: center !important; gap: 6px !important; } } /* ============================================================ * 14. BUNDLES SECTION (product page) * ============================================================ */ @media (max-width: 849px) { html body .fc-bundles { padding: 28px 16px !important; } html body .fc-bundles__header { margin-bottom: 16px !important; text-align: center !important; } html body .fc-bundles__eyebrow { font-size: 10px !important; letter-spacing: .22em !important; margin: 0 0 8px !important; } html body .fc-bundles__title { font-size: clamp(20px, 5.5vw, 26px) !important; line-height: 1.15 !important; } html body .fc-bundles__tiers { grid-template-columns: 1fr !important; gap: 10px !important; display: grid !important; } html body .fc-bundles__form { padding: 14px !important; border-radius: 10px !important; } html body .fc-bundles__cta { min-height: 46px !important; padding: 13px 20px !important; font-size: 12px !important; letter-spacing: .12em !important; } html body .fc-bundles__delivery { font-size: 12px !important; margin-top: 10px !important; } } /* ============================================================ * 15. MATCH / QUIZ SECTION * ============================================================ */ @media (max-width: 849px) { html body .fc-match { padding: 28px 16px !important; } html body .fc-match__header { text-align: center !important; margin-bottom: 16px !important; } html body .fc-match__eyebrow { font-size: 10px !important; letter-spacing: .22em !important; } html body .fc-match__title { font-size: clamp(20px, 5.5vw, 26px) !important; line-height: 1.15 !important; } html body .fc-match__box { padding: 18px 16px !important; border-radius: 12px !important; } html body .fc-match__q { font-size: 16px !important; line-height: 1.2 !important; } html body .fc-match__qsub { font-size: 12.5px !important; line-height: 1.5 !important; } html body .fc-match__options { grid-template-columns: 1fr !important; gap: 8px !important; } html body .fc-match__opt { padding: 12px 14px !important; border-radius: 8px !important; } html body .fc-match__opt-label { font-size: 13px !important; } html body .fc-match__opt-desc { font-size: 11.5px !important; line-height: 1.45 !important; } html body .fc-match__product-name { font-size: 14px !important; line-height: 1.25 !important; } html body .fc-match__product-desc { font-size: 12.5px !important; line-height: 1.5 !important; } html body .fc-match__product-price-now { font-size: 16px !important; font-weight: 700 !important; color: #C5975B !important; } html body .fc-match__product-price-old { font-size: 12px !important; text-decoration: line-through !important; opacity: .5 !important; } html body .fc-match__cta { min-height: 44px !important; padding: 12px 18px !important; font-size: 12px !important; letter-spacing: .1em !important; } } /* ============================================================ * 16. STICKY ATC BAR (product page bottom) * ============================================================ */ @media (max-width: 849px) { html body .fc-sticky-atc { position: fixed !important; left: 0 !important; right: 0 !important; bottom: 0 !important; z-index: 500 !important; background: #fff !important; border-top: 1px solid rgba(27,42,74,.08) !important; box-shadow: 0 -4px 14px rgba(0,0,0,.08) !important; padding: 8px 14px env(safe-area-inset-bottom, 8px) !important; } html body .fc-sticky-atc__inner { display: flex !important; align-items: center !important; gap: 10px !important; max-width: 100% !important; } html body .fc-sticky-atc__info { flex: 1 !important; min-width: 0 !important; } html body .fc-sticky-atc__title { font-size: 12px !important; line-height: 1.25 !important; font-weight: 600 !important; color: #1B2A4A !important; display: -webkit-box !important; -webkit-line-clamp: 1 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; margin: 0 !important; } html body .fc-sticky-atc__price { font-size: 13px !important; font-weight: 700 !important; color: #C5975B !important; margin: 2px 0 0 !important; } html body .fc-has-sticky-atc { padding-bottom: 78px !important; } } /* ============================================================ * 17. BUTTONS GLOBAL — tight, premium * ============================================================ */ @media (max-width: 849px) { html body .btn, html body button.btn, html body a.btn { min-height: 44px !important; padding: 12px 20px !important; font-size: 12px !important; letter-spacing: .12em !important; font-weight: 600 !important; border-radius: 2px !important; } } /* ===== fc-polish-v2.css ===== */ /* ============================================================ fc-polish-v2.css — Cucina Modena premium polish layer Loads AFTER fc-mobile-final.css so its rules win where needed. Scope: desktop + tablet refinement + premium micro-interactions. ============================================================ */ /* ---------- 1. Design tokens (CSS custom properties) ---------- */ :root{ /* Brand palette — refined */ --cm-ink: #1B2A4A; /* deep navy — primary text */ --cm-ink-soft: #3a4a6b; /* secondary text */ --cm-muted: #6b7890; /* tertiary / captions */ --cm-line: #e6e9ef; /* hairlines */ --cm-paper: #ffffff; --cm-cream: #faf8f3; /* warm off-white for rhythm */ --cm-gold: #b8953f; --cm-gold-deep: #8f7330; --cm-accent: #c0392b; /* sale / urgency — used sparingly */ /* Typography scale — editorial */ --cm-font-head: "Playfair Display", Georgia, "Times New Roman", serif; --cm-font-body: "Inter", "Helvetica Neue", Helvetica, Arial, sans-serif; --fs-display: clamp(40px, 4.2vw, 64px); --fs-h1: clamp(32px, 3.2vw, 48px); --fs-h2: clamp(26px, 2.4vw, 36px); --fs-h3: clamp(20px, 1.6vw, 24px); --fs-h4: clamp(16px, 1.2vw, 18px); --fs-body: 15px; --fs-small: 13px; --fs-eyebrow: 12px; --lh-tight: 1.15; --lh-snug: 1.3; --lh-body: 1.55; /* Spacing rhythm */ --sp-section-desktop: 96px; --sp-section-tablet: 72px; --sp-section-mobile: 56px; --sp-gutter-desktop: 40px; --sp-gutter-mobile: 16px; /* Motion */ --ease-out: cubic-bezier(.22,.61,.36,1); --ease-in-out: cubic-bezier(.4,0,.2,1); --dur-fast: .18s; --dur-base: .32s; --dur-slow: .55s; /* Elevation */ --sh-xs: 0 1px 2px rgba(15,22,40,.04); --sh-sm: 0 2px 6px rgba(15,22,40,.06); --sh-md: 0 6px 18px rgba(15,22,40,.08); --sh-lg: 0 18px 48px rgba(15,22,40,.14); } /* ---------- 2. Global baseline ---------- */ html{ scroll-behavior:smooth; } html body{ font-family: var(--cm-font-body) !important; color: var(--cm-ink); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; } html body h1, html body h2, html body h3, html body h4{ font-family: var(--cm-font-head) !important; color: var(--cm-ink); letter-spacing: -0.01em; line-height: var(--lh-tight); font-weight: 600; } html body p{ line-height: var(--lh-body); color: var(--cm-ink-soft); } /* Selection */ ::selection{ background: var(--cm-gold); color:#fff; } /* Focus ring */ :where(a,button,input,select,textarea):focus-visible{ outline: 2px solid var(--cm-gold); outline-offset: 3px; border-radius: 4px; } /* ---------- 3. Section rhythm (the biggest fix) ---------- */ /* Apply breathing space to every major section wrapper used in the theme. */ @media (min-width: 850px){ html body .fc-section, html body .shopify-section > .fc-hero, html body .shopify-section > .fc-hero4, html body .shopify-section > .fc-ticker, html body .shopify-section > .fc-usp, html body .shopify-section > .fc-usp2, html body .shopify-section > .fc-bestsellers, html body .shopify-section > .fc-collection-split, html body .shopify-section > .fc-testimonials, html body .shopify-section > .fc-video-showcase, html body .shopify-section > .fc-bundles, html body .shopify-section > .fc-rating-strip, html body .shopify-section > .fc-coll, html body .shopify-section > .fc-prod{ padding-top: var(--sp-section-desktop); padding-bottom: var(--sp-section-desktop); } /* Compact sections */ html body .shopify-section > .fc-ticker, html body .shopify-section > .fc-rating-strip{ padding-top: 28px; padding-bottom: 28px; } /* Hero keeps its own rhythm */ html body .shopify-section > .fc-hero, html body .shopify-section > .fc-hero4{ padding-top: 0; padding-bottom: 0; } } /* Alternating section backgrounds for editorial rhythm (desktop) */ @media (min-width: 850px){ html body .shopify-section:nth-of-type(even) > .fc-usp, html body .shopify-section:nth-of-type(even) > .fc-usp2, html body .shopify-section:nth-of-type(even) > .fc-bestsellers, html body .shopify-section:nth-of-type(even) > .fc-testimonials{ background: var(--cm-cream); } } /* ---------- 4. Typography hierarchy enforcement ---------- */ html body .fc-hero__title, html body .fc-hero4__title{ font-size: var(--fs-display) !important; font-family: var(--cm-font-head) !important; line-height: 1.05 !important; letter-spacing: -0.02em !important; font-weight: 600 !important; } html body .fc-section__title, html body .fc-coll__title, html body .fc-bestsellers__title, html body .fc-testimonials__title, html body .fc-usp2__title, html body .fc-video-showcase__title, html body .fc-bundles__title{ font-size: var(--fs-h2) !important; font-family: var(--cm-font-head) !important; font-weight: 600 !important; line-height: var(--lh-tight) !important; letter-spacing: -0.015em !important; margin-bottom: 16px !important; } html body .fc-section__eyebrow, html body .fc-eyebrow{ font-family: var(--cm-font-body) !important; font-size: var(--fs-eyebrow) !important; font-weight: 600 !important; letter-spacing: 0.18em !important; text-transform: uppercase !important; color: var(--cm-gold) !important; margin-bottom: 12px !important; } /* Card titles */ html body .fc-collection-card-title, html body .fc-coll__card-title, html body .fc-bestsellers__card-title{ font-family: var(--cm-font-body) !important; font-weight: 600; color: var(--cm-ink); letter-spacing: -0.005em; } /* ---------- 5. Buttons — unified premium system ---------- */ html body .fc-btn, html body .fc-btn-primary, html body .fc-btn-secondary, html body .fc-prod__btn, html body .fc-hero__btn, html body .fc-hero4__btn, html body .fc-coll__btn{ font-family: var(--cm-font-body) !important; font-weight: 600 !important; letter-spacing: 0.04em !important; text-transform: uppercase !important; font-size: 13px !important; border-radius: 2px !important; transition: transform var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out), background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out) !important; will-change: transform; } @media (min-width: 850px){ html body .fc-btn, html body .fc-btn-primary, html body .fc-prod__btn, html body .fc-hero__btn, html body .fc-hero4__btn, html body .fc-coll__btn{ min-height: 52px; padding: 16px 30px; } html body .fc-btn:hover, html body .fc-btn-primary:hover, html body .fc-prod__btn:hover, html body .fc-hero__btn:hover, html body .fc-hero4__btn:hover, html body .fc-coll__btn:hover{ transform: translateY(-2px); box-shadow: var(--sh-md); } html body .fc-btn:active, html body .fc-btn-primary:active, html body .fc-prod__btn:active{ transform: translateY(0); transition-duration: .08s; } } /* Primary = ink / gold-on-hover split */ html body .fc-btn-primary, html body .fc-prod__btn--primary{ background: var(--cm-ink) !important; color: #fff !important; border: 1px solid var(--cm-ink) !important; } html body .fc-btn-primary:hover, html body .fc-prod__btn--primary:hover{ background: var(--cm-gold) !important; border-color: var(--cm-gold) !important; } /* Secondary = outline */ html body .fc-btn-secondary, html body .fc-prod__btn--secondary{ background: transparent !important; color: var(--cm-ink) !important; border: 1px solid var(--cm-ink) !important; } html body .fc-btn-secondary:hover, html body .fc-prod__btn--secondary:hover{ background: var(--cm-ink) !important; color: #fff !important; } /* ---------- 6. Card micro-interactions (desktop) ---------- */ @media (min-width: 850px){ html body .fc-collection-card, html body .fc-coll__card, html body .fc-bestsellers__card, html body .fc-bundles__card{ transition: transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out); will-change: transform; } html body .fc-collection-card:hover, html body .fc-coll__card:hover, html body .fc-bestsellers__card:hover, html body .fc-bundles__card:hover{ transform: translateY(-6px); box-shadow: var(--sh-lg); } /* Image zoom on hover */ html body .fc-collection-card-img, html body .fc-coll__card-img, html body .fc-bestsellers__card-img{ overflow: hidden; } html body .fc-collection-card-img img, html body .fc-coll__card-img img, html body .fc-bestsellers__card-img img{ transition: transform var(--dur-slow) var(--ease-out); will-change: transform; } html body .fc-collection-card:hover .fc-collection-card-img img, html body .fc-coll__card:hover .fc-coll__card-img img, html body .fc-bestsellers__card:hover .fc-bestsellers__card-img img{ transform: scale(1.04); } } /* ---------- 7. Navigation & header polish ---------- */ html body .fc-header, html body .site-header{ transition: background-color var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out); } html body .fc-header.is-scrolled, html body .site-header.is-scrolled{ box-shadow: var(--sh-sm); backdrop-filter: saturate(160%) blur(8px); -webkit-backdrop-filter: saturate(160%) blur(8px); } html body .fc-nav a, html body .site-header a{ transition: color var(--dur-fast) var(--ease-out); } html body .fc-nav a:hover, html body .site-header a:hover{ color: var(--cm-gold); } /* ---------- 8. Ticker / announcement bar ---------- */ html body .fc-ticker, html body .fc-ticker__wrap{ letter-spacing: 0.08em; font-size: 12px; text-transform: uppercase; font-weight: 500; } /* ---------- 9. Hero refinement ---------- */ html body .fc-hero, html body .fc-hero4{ position: relative; } html body .fc-hero__content, html body .fc-hero4__content{ animation: fc-fade-up .9s var(--ease-out) both; } @keyframes fc-fade-up{ from{ opacity:0; transform: translateY(24px); } to { opacity:1; transform: translateY(0); } } /* ---------- 10. Scroll-reveal base ---------- */ /* Elements marked with .fc-reveal start hidden; JS adds .fc-reveal--in on intersect */ .fc-reveal{ opacity: 0; transform: translateY(28px); transition: opacity var(--dur-slow) var(--ease-out), transform var(--dur-slow) var(--ease-out); will-change: opacity, transform; } .fc-reveal.fc-reveal--in{ opacity: 1; transform: translateY(0); } .fc-reveal.fc-reveal--delay-1{ transition-delay: .08s; } .fc-reveal.fc-reveal--delay-2{ transition-delay: .16s; } .fc-reveal.fc-reveal--delay-3{ transition-delay: .24s; } .fc-reveal.fc-reveal--delay-4{ transition-delay: .32s; } /* Respect reduced motion */ @media (prefers-reduced-motion: reduce){ .fc-reveal{ opacity: 1 !important; transform: none !important; } html body *{ animation-duration: .001ms !important; transition-duration: .001ms !important; } } /* ---------- 11. Product page refinement ---------- */ @media (min-width: 850px){ html body .fc-prod__gallery-thumb{ transition: opacity var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out); } html body .fc-prod__gallery-thumb:hover{ opacity: .82; } html body .fc-prod__gallery-thumb.is-active{ border: 2px solid var(--cm-ink); } html body .fc-prod__title{ font-size: var(--fs-h1) !important; line-height: 1.1 !important; letter-spacing: -0.015em !important; margin-bottom: 12px; } html body .fc-prod__price{ font-size: 26px !important; font-weight: 700 !important; color: var(--cm-ink); } html body .fc-prod__price-was{ color: var(--cm-muted); text-decoration: line-through; margin-left: 10px; font-size: 16px; font-weight: 400; } html body .fc-prod__badge-row{ gap: 8px; } html body .fc-prod__bullet{ padding: 10px 0; border-bottom: 1px solid var(--cm-line); color: var(--cm-ink-soft); font-size: 15px; line-height: 1.55; } } /* ---------- 12. Collection grid refinement (desktop) ---------- */ @media (min-width: 850px){ html body .fc-collection-product-grid{ display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 32px 28px; } html body .fc-collection-card{ background: #fff; border: 1px solid transparent; border-radius: 4px; overflow: hidden; } html body .fc-collection-card-img{ aspect-ratio: 3/4; background: var(--cm-cream); } html body .fc-collection-card-body{ padding: 18px 4px 4px; } html body .fc-collection-card-title{ font-size: 16px !important; line-height: 1.35 !important; margin: 0 0 8px !important; } html body .fc-collection-card-price-now{ font-size: 17px !important; color: var(--cm-ink) !important; font-weight: 700 !important; } } /* ---------- 13. Testimonials refinement ---------- */ html body .fc-testimonials__quote{ font-family: var(--cm-font-head) !important; font-style: italic; line-height: 1.4; color: var(--cm-ink); } html body .fc-testimonials__stars{ color: var(--cm-gold) !important; } /* ---------- 14. Footer polish ---------- */ html body .fc-footer, html body .site-footer{ background: var(--cm-ink) !important; color: rgba(255,255,255,0.82); } html body .fc-footer a, html body .site-footer a{ color: rgba(255,255,255,0.82); transition: color var(--dur-fast) var(--ease-out); } html body .fc-footer a:hover, html body .site-footer a:hover{ color: var(--cm-gold); } html body .fc-footer h4, html body .site-footer h4{ color: #fff !important; font-family: var(--cm-font-body) !important; font-size: 13px !important; letter-spacing: 0.14em !important; text-transform: uppercase !important; font-weight: 600 !important; } /* ---------- 15. Tablet refinements (850-1199) ---------- */ @media (min-width: 850px) and (max-width: 1199px){ html body .fc-section, html body .shopify-section > .fc-usp, html body .shopify-section > .fc-usp2, html body .shopify-section > .fc-bestsellers, html body .shopify-section > .fc-collection-split, html body .shopify-section > .fc-testimonials, html body .shopify-section > .fc-video-showcase, html body .shopify-section > .fc-bundles, html body .shopify-section > .fc-coll{ padding-top: var(--sp-section-tablet); padding-bottom: var(--sp-section-tablet); } } /* ---------- 16. Mobile tuning (reinforce fc-mobile-final) ---------- */ @media (max-width: 849px){ html body .fc-section, html body .shopify-section > .fc-usp, html body .shopify-section > .fc-usp2, html body .shopify-section > .fc-bestsellers, html body .shopify-section > .fc-collection-split, html body .shopify-section > .fc-testimonials, html body .shopify-section > .fc-video-showcase, html body .shopify-section > .fc-bundles, html body .shopify-section > .fc-coll{ padding-top: var(--sp-section-mobile) !important; padding-bottom: var(--sp-section-mobile) !important; } html body .fc-section__title, html body .fc-coll__title, html body .fc-bestsellers__title, html body .fc-testimonials__title, html body .fc-usp2__title{ font-size: clamp(22px, 6vw, 28px) !important; margin-bottom: 12px !important; } html body .fc-section__eyebrow{ font-size: 11px !important; margin-bottom: 8px !important; } html body .fc-hero__title, html body .fc-hero4__title{ font-size: clamp(28px, 7.5vw, 38px) !important; line-height: 1.1 !important; } /* Scroll reveal — shorter travel on mobile */ .fc-reveal{ transform: translateY(18px); transition-duration: var(--dur-base); } /* Disable hover transforms on touch */ html body .fc-collection-card:hover, html body .fc-coll__card:hover, html body .fc-bestsellers__card:hover{ transform: none; box-shadow: none; } } /* ---------- 17. Utility: hairlines + dividers ---------- */ html body .fc-hairline{ display:block; height: 1px; background: var(--cm-line); margin: 24px 0; } /* ---------- 18. Image rendering ---------- */ html body img{ image-rendering: -webkit-optimize-contrast; } /* ---------- 19. Print cleanup ---------- */ @media print{ html body .fc-sticky-atc, html body .fc-ticker, html body .fc-header, html body .fc-footer{ display:none !important; } } /* ---------- 20. End ---------- */ /* ===== fc-polish-v3.css ===== */ /* ============================================================ fc-polish-v3.css — targets REAL class names used in the theme Loads AFTER fc-polish-v2.css for max specificity. ============================================================ */ /* ---------- Section rhythm (desktop) ---------- */ @media (min-width: 850px){ html body .shopify-section > .fc-materials, html body .shopify-section > .fc-trust-section, html body .shopify-section > .fc-vshow, html body .shopify-section > .fc-shop, html body .shopify-section > .fc-accord, html body .shopify-section > .fc-carousel-section, html body .shopify-section > .fc-usp-bar, html body .shopify-section > .fc-match, html body .shopify-section > .fc-rev, html body .shopify-section > .fc-cta, html body .shopify-section > .fc-faq, html body .shopify-section > .fc-nl, html body .shopify-section > .fc-bundles{ padding-top: 96px !important; padding-bottom: 96px !important; } /* Compact sections */ html body .shopify-section > .fc-ticker, html body .shopify-section > .fc-rating-strip, html body .shopify-section > .fc-usp-bar{ padding-top: 28px !important; padding-bottom: 28px !important; } } /* ---------- Section rhythm (tablet) ---------- */ @media (min-width: 850px) and (max-width: 1199px){ html body .shopify-section > .fc-materials, html body .shopify-section > .fc-trust-section, html body .shopify-section > .fc-vshow, html body .shopify-section > .fc-shop, html body .shopify-section > .fc-accord, html body .shopify-section > .fc-carousel-section, html body .shopify-section > .fc-match, html body .shopify-section > .fc-rev, html body .shopify-section > .fc-cta, html body .shopify-section > .fc-faq, html body .shopify-section > .fc-nl{ padding-top: 72px !important; padding-bottom: 72px !important; } } /* ---------- Section rhythm (mobile) ---------- */ @media (max-width: 849px){ html body .shopify-section > .fc-materials, html body .shopify-section > .fc-trust-section, html body .shopify-section > .fc-vshow, html body .shopify-section > .fc-shop, html body .shopify-section > .fc-accord, html body .shopify-section > .fc-carousel-section, html body .shopify-section > .fc-match, html body .shopify-section > .fc-rev, html body .shopify-section > .fc-cta, html body .shopify-section > .fc-faq, html body .shopify-section > .fc-nl{ padding-top: 56px !important; padding-bottom: 56px !important; } } /* ---------- Alternating backgrounds (desktop) ---------- */ @media (min-width: 850px){ html body .shopify-section:nth-of-type(even) > .fc-materials, html body .shopify-section:nth-of-type(even) > .fc-accord, html body .shopify-section:nth-of-type(even) > .fc-rev, html body .shopify-section:nth-of-type(even) > .fc-trust-section{ background: #faf8f3 !important; } } /* ---------- Title typography hierarchy ---------- */ html body .fc-hero4__title, html body .fc-hero__title{ font-family: var(--cm-font-head, "Playfair Display", Georgia, serif) !important; font-weight: 600 !important; letter-spacing: -0.02em !important; line-height: 1.05 !important; } @media (min-width: 850px){ html body .fc-hero4__title, html body .fc-hero__title{ font-size: clamp(44px, 4.5vw, 68px) !important; } } html body .fc-vshow__heading, html body .fc-shop__title, html body .fc-rev__title, html body .fc-materials__title, html body .fc-accord__title, html body .fc-match__title, html body .fc-cta__title, html body .fc-faq__title, html body .fc-nl__title, html body .fc-coll__heading, html body .fc-coll__title, html body .fc-bundles__title{ font-family: var(--cm-font-head, "Playfair Display", Georgia, serif) !important; font-weight: 600 !important; letter-spacing: -0.015em !important; line-height: 1.15 !important; color: #1B2A4A !important; } @media (min-width: 850px){ html body .fc-vshow__heading, html body .fc-shop__title, html body .fc-rev__title, html body .fc-materials__title, html body .fc-accord__title, html body .fc-match__title, html body .fc-cta__title, html body .fc-faq__title, html body .fc-nl__title, html body .fc-coll__heading, html body .fc-coll__title{ font-size: clamp(28px, 2.6vw, 40px) !important; margin-bottom: 18px !important; } } @media (max-width: 849px){ html body .fc-vshow__heading, html body .fc-shop__title, html body .fc-rev__title, html body .fc-materials__title, html body .fc-accord__title, html body .fc-match__title, html body .fc-cta__title, html body .fc-faq__title, html body .fc-nl__title, html body .fc-coll__heading, html body .fc-coll__title{ font-size: clamp(24px, 6.5vw, 30px) !important; margin-bottom: 14px !important; } } /* ---------- Eyebrows ---------- */ html body .fc-vshow__eyebrow, html body .fc-match__eyebrow, html body .fc-match__result-eyebrow, html body .fc-coll__subtitle, html body .fc-accord__subtitle{ font-family: var(--cm-font-body, "Inter", "Helvetica Neue", sans-serif) !important; font-size: 12px !important; font-weight: 600 !important; letter-spacing: 0.18em !important; text-transform: uppercase !important; color: #b8953f !important; margin-bottom: 14px !important; } /* ---------- Card micro-interactions (desktop) ---------- */ @media (min-width: 850px){ html body .fc-coll__card, html body .fc-rev__card, html body .fc-shop__card{ transition: transform .32s cubic-bezier(.22,.61,.36,1), box-shadow .32s cubic-bezier(.22,.61,.36,1) !important; will-change: transform; } html body .fc-coll__card:hover, html body .fc-rev__card:hover, html body .fc-shop__card:hover{ transform: translateY(-6px) !important; box-shadow: 0 18px 48px rgba(15,22,40,.14) !important; } /* Image zoom on fc-coll__card */ html body .fc-coll__card{ overflow: hidden; } html body .fc-coll__card img{ transition: transform .55s cubic-bezier(.22,.61,.36,1); will-change: transform; } html body .fc-coll__card:hover img{ transform: scale(1.04); } } /* ---------- Material / feature card polish ---------- */ @media (min-width: 850px){ html body .fc-materials__layer-title{ font-family: var(--cm-font-head, "Playfair Display", Georgia, serif) !important; font-weight: 600 !important; } } /* ---------- Header scroll shadow (applies to tricolor header wrapper) ---------- */ html body .fc-header__tricolor{ transition: box-shadow .32s cubic-bezier(.22,.61,.36,1), backdrop-filter .32s cubic-bezier(.22,.61,.36,1); } html body .fc-header__tricolor.is-scrolled{ box-shadow: 0 2px 6px rgba(15,22,40,.06); backdrop-filter: saturate(160%) blur(8px); -webkit-backdrop-filter: saturate(160%) blur(8px); } /* ---------- Desktop: maximum body width for legibility ---------- */ @media (min-width: 1200px){ html body .fc-shop__container, html body .fc-rev__container, html body .fc-materials__container, html body .fc-accord__container, html body .fc-cta__container, html body .fc-faq__container, html body .fc-nl__container, html body .fc-match__container, html body .fc-coll__container, html body .fc-vshow__container{ max-width: 1280px; margin-left: auto; margin-right: auto; padding-left: 32px; padding-right: 32px; } } /* ---------- Touch-device: disable hover transforms ---------- */ html.is-touch body .fc-coll__card:hover, html.is-touch body .fc-rev__card:hover, html.is-touch body .fc-shop__card:hover{ transform: none !important; box-shadow: none !important; } html.is-touch body .fc-coll__card:hover img{ transform: none !important; } /* ---------- Sticky header: slight glass after scroll ---------- */ @media (min-width: 850px){ html body .fc-header__tricolor.is-scrolled{ background: rgba(255,255,255,0.95) !important; } } /* ---------- Reveal staggering for specific grids ---------- */ html body .fc-shop__grid > .fc-reveal:nth-child(1){ transition-delay: 0s; } html body .fc-shop__grid > .fc-reveal:nth-child(2){ transition-delay: .08s; } html body .fc-shop__grid > .fc-reveal:nth-child(3){ transition-delay: .16s; } html body .fc-shop__grid > .fc-reveal:nth-child(4){ transition-delay: .24s; } html body .fc-rev__grid > .fc-reveal:nth-child(1){ transition-delay: 0s; } html body .fc-rev__grid > .fc-reveal:nth-child(2){ transition-delay: .08s; } html body .fc-rev__grid > .fc-reveal:nth-child(3){ transition-delay: .16s; } /* End */ /* ===== fc-mobile-v2.css ===== */ @media (max-width: 849px) { html body .fc-materials, html body .fc-trust-section, html body .fc-vshow, html body .fc-shop, html body .fc-accord, html body .fc-carousel-section, html body .fc-match, html body .fc-rev, html body .fc-cta, html body .fc-faq, html body .fc-nl, html body .fc-bundles, html body .fc-usp-bar, html body .fc-ticker, html body .fc-rating-strip { padding: 56px max(20px, env(safe-area-inset-left)) 56px max(20px, env(safe-area-inset-right)) !important; } /* Hero refinement */ html body .fc-hero, html body .fc-hero4 { padding-top: 32px !important; padding-left: max(20px, env(safe-area-inset-left)) !important; padding-right: max(20px, env(safe-area-inset-right)) !important; padding-bottom: 40px !important; } html body .fc-hero__title, html body .fc-hero4__title { font-size: clamp(32px, 9vw, 42px) !important; line-height: 1.08 !important; color: var(--cm-ink, #1B2A4A) !important; font-family: var(--cm-font-head, 'Playfair Display'), serif !important; letter-spacing: -0.01em !important; } /* Section titles */ html body .fc-vshow__heading, html body .fc-shop__title, html body .fc-rev__title, html body .fc-materials__title, html body .fc-accord__title, html body .fc-match__title, html body .fc-cta__title, html body .fc-faq__title, html body .fc-nl__title, html body .fc-coll__heading, html body .fc-coll__title, html body .fc-bundles__title { font-size: clamp(22px, 6vw, 28px) !important; line-height: 1.2 !important; margin-bottom: 12px !important; color: var(--cm-ink, #1B2A4A) !important; font-family: var(--cm-font-head, 'Playfair Display'), serif !important; letter-spacing: -0.01em !important; } /* Eyebrows & subtitles */ html body .fc-vshow__eyebrow, html body .fc-match__eyebrow, html body .fc-coll__subtitle, html body .fc-accord__subtitle { font-size: 11px !important; letter-spacing: 0.16em !important; color: var(--cm-gold, #b8953f) !important; margin-bottom: 10px !important; text-transform: uppercase !important; font-weight: 500 !important; font-family: var(--cm-font-body, 'Inter'), sans-serif !important; } /* Cards base */ html body .fc-coll__card, html body .fc-rev__card, html body .fc-shop__card, html body .fc-bundles__card { border-radius: 14px !important; overflow: hidden !important; box-shadow: 0 2px 8px rgba(15, 22, 40, 0.06) !important; background: var(--cm-cream, #faf8f3) !important; } /* Card images */ html body .fc-coll__card img, html body .fc-rev__card img, html body .fc-shop__card img, html body .fc-bundles__card img { border-radius: 10px 10px 0 0 !important; object-fit: cover !important; aspect-ratio: 4 / 5 !important; width: 100% !important; display: block !important; } /* Grids */ html body .fc-shop__grid, html body .fc-coll__grid { display: grid !important; grid-template-columns: repeat(2, 1fr) !important; gap: 12px !important; } html body .fc-rev__grid { display: grid !important; grid-template-columns: 1fr !important; gap: 12px !important; } /* USP bar & ticker */ html body .fc-usp-bar, html body .fc-ticker { padding: 22px max(20px, env(safe-area-inset-left)) !important; font-size: 12px !important; line-height: 1.4 !important; } html body .fc-rating-strip { padding: 12px max(20px, env(safe-area-inset-left)) !important; font-size: 12px !important; } /* CTA buttons */ html body .fc-prod__btn--primary, html body button[data-action="add-to-cart"], html body a.fc-btn, html body .fc-cta a { min-height: 50px !important; padding: 14px 22px !important; font-size: 15px !important; font-weight: 600 !important; letter-spacing: 0.02em !important; border-radius: 8px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; cursor: pointer !important; transition: background-color 0.2s ease !important; } /* Touch targets */ html body .fc-materials a, html body .fc-trust-section a, html body .fc-vshow a, html body .fc-shop a, html body .fc-match a, html body .fc-rev a, html body .fc-cta a, html body .fc-faq a, html body .fc-nl a, html body .fc-bundles a { min-height: 44px !important; display: flex !important; align-items: center !important; } /* Product page */ html body .fc-prod { padding-bottom: 80px !important; } html body .fc-prod__title { font-size: clamp(24px, 6.5vw, 30px) !important; line-height: 1.1 !important; color: var(--cm-ink, #1B2A4A) !important; font-family: var(--cm-font-head, 'Playfair Display'), serif !important; margin-bottom: 8px !important; } html body .fc-prod__price { font-size: 22px !important; font-weight: 700 !important; color: var(--cm-ink, #1B2A4A) !important; margin-bottom: 20px !important; } /* Sticky ATC */ html body .fc-sticky-atc { display: none; } html body .fc-sticky-atc.is-visible { display: flex !important; position: fixed !important; bottom: 0 !important; left: 0 !important; right: 0 !important; background: white !important; border-top: 1px solid rgba(15, 22, 40, 0.08) !important; box-shadow: 0 -4px 16px rgba(15, 22, 40, 0.06) !important; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)) !important; gap: 12px !important; z-index: 100 !important; } /* Header */ html body .fc-header { position: sticky !important; top: 0 !important; z-index: 50 !important; height: 56px !important; display: flex !important; align-items: center !important; background: white !important; backdrop-filter: blur(8px) !important; -webkit-backdrop-filter: blur(8px) !important; } html body .fc-header__tricolor { height: 56px !important; display: flex !important; align-items: center !important; padding: 0 max(16px, env(safe-area-inset-left)) !important; } /* Accordion */ html body .fc-accord__item { border-bottom: 1px solid rgba(27, 42, 74, 0.08) !important; padding: 16px 0 !important; } html body .fc-accord__item button { font-size: 16px !important; font-weight: 500 !important; color: var(--cm-ink, #1B2A4A) !important; width: 100% !important; padding: 0 !important; text-align: left !important; min-height: 44px !important; display: flex !important; align-items: center !important; justify-content: space-between !important; } html body .fc-accord__item [data-icon="chevron"] { transition: transform 0.2s ease !important; } html body .fc-accord__item.is-open [data-icon="chevron"] { transform: rotateZ(180deg) !important; } /* FAQ section */ html body .fc-faq__item { border-bottom: 1px solid rgba(27, 42, 74, 0.08) !important; padding: 16px 0 !important; } html body .fc-faq__question { font-size: 15px !important; font-weight: 600 !important; color: var(--cm-ink, #1B2A4A) !important; line-height: 1.4 !important; } html body .fc-faq__answer { font-size: 15px !important; line-height: 1.55 !important; color: #3a4558 !important; margin-top: 8px !important; } /* Newsletter form */ html body .fc-nl__form { display: flex !important; flex-direction: column !important; gap: 10px !important; } html body .fc-nl__input { width: 100% !important; padding: 14px 14px !important; font-size: 15px !important; border: 1px solid rgba(27, 42, 74, 0.12) !important; border-radius: 8px !important; font-family: var(--cm-font-body, 'Inter'), sans-serif !important; color: var(--cm-ink, #1B2A4A) !important; background: var(--cm-cream, #faf8f3) !important; } html body .fc-nl__input::placeholder { color: rgba(27, 42, 74, 0.5) !important; } html body .fc-nl__button { width: 100% !important; min-height: 50px !important; padding: 14px 22px !important; font-size: 15px !important; font-weight: 600 !important; letter-spacing: 0.02em !important; } /* Container refinement */ html body .fc-shop__container, html body .fc-rev__container, html body .fc-materials__container, html body .fc-accord__container, html body .fc-cta__container, html body .fc-faq__container, html body .fc-nl__container, html body .fc-match__container, html body .fc-coll__container, html body .fc-vshow__container { width: 100% !important; padding-left: max(20px, env(safe-area-inset-left)) !important; padding-right: max(20px, env(safe-area-inset-right)) !important; } /* Typography base */ html body { line-height: 1.6 !important; font-family: var(--cm-font-body, 'Inter'), sans-serif !important; color: #3a4558 !important; } html body h2, html body h3 { line-height: 1.2 !important; } /* Horizontal scroll shelves */ html body [data-carousel], html body .fc-carousel { display: flex !important; overflow-x: auto !important; scroll-snap-type: x mandatory !important; padding: 0 max(16px, env(safe-area-inset-left)) !important; gap: 12px !important; -webkit-overflow-scrolling: touch !important; scrollbar-width: none !important; } html body [data-carousel]::-webkit-scrollbar, html body .fc-carousel::-webkit-scrollbar { display: none !important; } html body [data-carousel] > *, html body .fc-carousel > * { scroll-snap-align: start !important; flex-shrink: 0 !important; } } /* End */ /* ===== fc-mobile-v3.css ===== */ /* ============================================================ fc-mobile-v3.css — Cucina Modena FINAL mobile excellence layer Loads AFTER fc-mobile-v2.css; max specificity via html body. Goal: app-level premium feel matching Zalando / Apple / Uniqlo. Mobile only: @media (max-width: 849px) ============================================================ */ @media (max-width: 849px){ /* ---------- Global foundation ---------- */ html body{ -webkit-font-smoothing: antialiased !important; -moz-osx-font-smoothing: grayscale !important; text-rendering: optimizeLegibility !important; } html body *{ -webkit-tap-highlight-color: transparent !important; } /* ---------- Safe-area aware root ---------- */ html body.template-product, html body[class*="template-product"]{ padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important; } /* ---------- Header: refined glass ---------- */ html body .fc-header, html body #fc-site-header{ height: 58px !important; padding: 0 16px !important; background: rgba(255,255,255,0.92) !important; backdrop-filter: saturate(180%) blur(16px) !important; -webkit-backdrop-filter: saturate(180%) blur(16px) !important; border-bottom: 1px solid rgba(15,22,40,0.06) !important; } html body .fc-header__tricolor{ height: 3px !important; } html body .fc-header__tricolor.is-scrolled{ box-shadow: 0 1px 12px rgba(15,22,40,.07) !important; } /* ---------- Ticker: compact, premium ---------- */ html body .fc-ticker{ padding: 10px 0 !important; font-size: 11px !important; letter-spacing: 0.12em !important; } /* ---------- Hero4: app-level focus ---------- */ html body .fc-hero4{ min-height: 0 !important; padding: 20px 16px 32px !important; } html body .fc-hero4__container, html body .fc-hero4__inner{ padding: 0 !important; max-width: 100% !important; } html body .fc-hero4__title{ font-family: var(--cm-font-head, "Playfair Display", Georgia, serif) !important; font-size: clamp(32px, 8.5vw, 40px) !important; line-height: 1.06 !important; font-weight: 600 !important; letter-spacing: -0.02em !important; margin: 12px 0 14px !important; } html body .fc-hero4__subtitle, html body .fc-hero4__desc{ font-size: 15px !important; line-height: 1.55 !important; color: #3a4765 !important; margin-bottom: 20px !important; } html body .fc-hero4__tag, html body .fc-hero4__eyebrow{ font-size: 11px !important; letter-spacing: 0.16em !important; text-transform: uppercase !important; color: #b8953f !important; font-weight: 600 !important; margin-bottom: 10px !important; } html body .fc-hero4__cta, html body .fc-hero4__btn{ width: 100% !important; min-height: 52px !important; padding: 14px 22px !important; font-size: 15px !important; font-weight: 600 !important; letter-spacing: 0.02em !important; border-radius: 12px !important; box-shadow: 0 8px 20px rgba(184,149,63,.22) !important; } html body .fc-hero4__image, html body .fc-hero4__media{ border-radius: 14px !important; overflow: hidden !important; margin-bottom: 16px !important; } html body .fc-hero4-timer{ padding: 14px 16px !important; font-size: 13px !important; background: linear-gradient(135deg, #1B2A4A, #2c3d66) !important; color: #fff !important; } /* ---------- Rating strip ---------- */ html body .fc-rating-strip{ padding: 16px 16px !important; gap: 8px !important; } html body .fc-rating-strip__item{ font-size: 11px !important; letter-spacing: 0.04em !important; line-height: 1.3 !important; } /* ---------- USP bar: polished icons ---------- */ html body .fc-usp-bar{ padding: 20px 16px !important; background: #faf8f3 !important; } html body .fc-usp-bar__grid, html body .fc-usp__grid{ gap: 12px !important; } html body .fc-usp__item{ font-size: 12px !important; line-height: 1.35 !important; letter-spacing: 0 !important; } /* ---------- Collection cards (Oro/Argento) ---------- */ html body .fc-coll{ padding: 40px 16px !important; } html body .fc-coll__heading, html body .fc-coll__title{ font-size: clamp(24px, 6.5vw, 30px) !important; line-height: 1.15 !important; margin-bottom: 10px !important; } html body .fc-coll__subtitle{ font-size: 11px !important; margin-bottom: 12px !important; } html body .fc-coll__divider{ margin: 14px auto 24px !important; } html body .fc-coll__grid{ display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 10px !important; } html body .fc-coll__card{ border-radius: 14px !important; overflow: hidden !important; box-shadow: 0 4px 14px rgba(15,22,40,.07) !important; transition: transform .18s ease, box-shadow .18s ease !important; } html body .fc-coll__card:active{ transform: scale(.98) !important; box-shadow: 0 2px 8px rgba(15,22,40,.06) !important; } html body .fc-coll__card-content{ padding: 12px 10px 14px !important; } html body .fc-coll__card-label{ font-size: 9.5px !important; letter-spacing: 0.14em !important; margin-bottom: 4px !important; } html body .fc-coll__card-name{ font-size: 15px !important; line-height: 1.2 !important; font-weight: 600 !important; margin-bottom: 4px !important; } html body .fc-coll__card-desc{ font-size: 11px !important; line-height: 1.35 !important; margin-bottom: 8px !important; -webkit-line-clamp: 2 !important; display: -webkit-box !important; -webkit-box-orient: vertical !important; overflow: hidden !important; } html body .fc-coll__card-btn{ font-size: 11px !important; padding: 7px 10px !important; letter-spacing: 0.04em !important; } /* ---------- Section titles: unified rhythm ---------- */ html body .fc-shop__title, html body .fc-rev__title, html body .fc-materials__title, html body .fc-accord__title, html body .fc-match__title, html body .fc-cta__title, html body .fc-faq__title, html body .fc-nl__title, html body .fc-vshow__heading, html body .fc-bundles__title{ font-size: clamp(22px, 6vw, 28px) !important; line-height: 1.18 !important; margin: 0 0 14px !important; letter-spacing: -0.015em !important; } /* ---------- Section containers: tight mobile gutters ---------- */ html body .fc-shop__container, html body .fc-rev__container, html body .fc-materials__container, html body .fc-accord__container, html body .fc-cta__container, html body .fc-faq__container, html body .fc-nl__container, html body .fc-match__container, html body .fc-coll__container, html body .fc-vshow__container{ padding-left: 16px !important; padding-right: 16px !important; } /* ---------- Shop grid: 2-col tight ---------- */ html body .fc-shop__grid{ display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 12px !important; } html body .fc-shop__card{ border-radius: 12px !important; overflow: hidden !important; background: #fff !important; box-shadow: 0 3px 10px rgba(15,22,40,.06) !important; } html body .fc-shop__card:active{ transform: scale(.98) !important; } /* ---------- Accordion: app-level chevron + spacing ---------- */ html body .fc-accord{ padding: 40px 0 !important; } html body .fc-accord__item{ border-bottom: 1px solid rgba(15,22,40,0.08) !important; } html body .fc-accord__trigger{ padding: 18px 0 !important; font-size: 15px !important; font-weight: 500 !important; letter-spacing: -0.005em !important; } html body .fc-accord__icon{ transition: transform .28s cubic-bezier(.22,.61,.36,1) !important; } html body .fc-accord__item[open] .fc-accord__icon, html body .fc-accord__item.is-open .fc-accord__icon{ transform: rotate(180deg) !important; } html body .fc-accord__content{ padding: 0 0 20px !important; font-size: 14px !important; line-height: 1.6 !important; color: #3a4765 !important; } html body .fc-accord__number{ font-size: 12px !important; color: #b8953f !important; margin-right: 14px !important; } /* ---------- FAQ ---------- */ html body .fc-faq__item, html body .fc-faq details{ padding: 14px 0 !important; border-bottom: 1px solid rgba(15,22,40,0.08) !important; } html body .fc-faq__question, html body .fc-faq summary{ font-size: 15px !important; font-weight: 500 !important; padding: 6px 0 !important; } html body .fc-faq__answer{ font-size: 14px !important; line-height: 1.6 !important; color: #3a4765 !important; padding: 10px 0 0 !important; } /* ---------- Reviews: premium card shadows ---------- */ html body .fc-rev__grid{ display: grid !important; grid-template-columns: 1fr !important; gap: 14px !important; } html body .fc-rev__card{ border-radius: 14px !important; padding: 20px 18px !important; background: #fff !important; box-shadow: 0 4px 16px rgba(15,22,40,.06) !important; } html body .fc-rev__stars{ color: #b8953f !important; font-size: 13px !important; margin-bottom: 10px !important; } html body .fc-rev__quote{ font-size: 14.5px !important; line-height: 1.55 !important; color: #1B2A4A !important; } html body .fc-rev__author{ font-size: 12px !important; color: #6b7280 !important; margin-top: 10px !important; } /* ---------- Match quiz CTA ---------- */ html body .fc-match{ padding: 48px 16px !important; background: linear-gradient(135deg, #faf8f3, #f1ebe0) !important; } html body .fc-match__eyebrow{ font-size: 11px !important; letter-spacing: 0.16em !important; margin-bottom: 10px !important; } html body .fc-match__cta{ width: 100% !important; min-height: 52px !important; border-radius: 12px !important; font-size: 15px !important; font-weight: 600 !important; } /* ---------- CTA section ---------- */ html body .fc-cta{ padding: 48px 16px !important; } html body .fc-cta__inner{ border-radius: 16px !important; padding: 32px 24px !important; } html body .fc-cta__tag{ font-size: 11px !important; letter-spacing: 0.16em !important; margin-bottom: 10px !important; } html body .fc-cta__btn{ width: 100% !important; min-height: 52px !important; border-radius: 12px !important; font-size: 15px !important; } /* ---------- Newsletter: vertical, friendly ---------- */ html body .fc-nl{ padding: 44px 16px !important; } html body .fc-nl__form{ display: flex !important; flex-direction: column !important; gap: 10px !important; width: 100% !important; } html body .fc-nl__input{ width: 100% !important; height: 52px !important; padding: 0 16px !important; font-size: 15px !important; border-radius: 12px !important; border: 1px solid rgba(15,22,40,0.12) !important; background: #faf8f3 !important; } html body .fc-nl__input:focus{ border-color: #b8953f !important; background: #fff !important; outline: none !important; } html body .fc-nl__btn{ width: 100% !important; height: 52px !important; border-radius: 12px !important; font-size: 15px !important; font-weight: 600 !important; } /* ---------- Video showcase ---------- */ html body .fc-vshow{ padding: 40px 16px !important; } html body .fc-vshow__media, html body .fc-vshow__video{ border-radius: 14px !important; overflow: hidden !important; aspect-ratio: 16/10 !important; } html body .fc-vshow__eyebrow{ font-size: 11px !important; letter-spacing: 0.16em !important; margin-bottom: 10px !important; } /* ---------- Materials section ---------- */ html body .fc-materials{ padding: 40px 16px !important; } html body .fc-materials__layer-title{ font-size: 17px !important; line-height: 1.25 !important; margin-bottom: 6px !important; } /* ---------- Product page: gallery ---------- */ html body .template-product .fc-prod__gallery, html body .template-product .product__media-wrapper{ margin: 0 -16px 14px !important; border-radius: 0 !important; } html body .template-product .fc-prod__media img, html body .template-product .product__media img{ border-radius: 0 !important; } /* ---------- Product title + price ---------- */ html body .template-product .fc-prod__title, html body .template-product .product__title h1{ font-family: var(--cm-font-head, "Playfair Display", Georgia, serif) !important; font-size: clamp(24px, 6.5vw, 30px) !important; line-height: 1.15 !important; font-weight: 600 !important; margin: 0 0 8px !important; letter-spacing: -0.015em !important; } html body .template-product .fc-prod__price, html body .template-product .price__container{ font-size: 22px !important; font-weight: 700 !important; color: #1B2A4A !important; margin-bottom: 14px !important; } html body .template-product .price--on-sale .price-item--regular{ font-size: 14px !important; text-decoration: line-through !important; color: #94a3b8 !important; margin-right: 8px !important; } /* ---------- Product variant picker ---------- */ html body .template-product .fc-prod__options, html body .template-product .product-form__input{ margin-bottom: 16px !important; } html body .template-product .fc-prod__option-btn, html body .template-product .product-form__input input[type="radio"] + label{ min-height: 46px !important; padding: 10px 16px !important; border-radius: 10px !important; font-size: 14px !important; font-weight: 500 !important; border: 1.5px solid rgba(15,22,40,0.12) !important; background: #fff !important; } html body .template-product .fc-prod__option-btn.is-selected, html body .template-product .fc-prod__option-btn[aria-pressed="true"]{ border-color: #1B2A4A !important; background: #1B2A4A !important; color: #fff !important; } /* ---------- Product main ATC button ---------- */ html body .template-product .fc-prod__btn, html body .template-product .fc-prod__btn--primary, html body .template-product .product-form__submit, html body .template-product button[name="add"]{ width: 100% !important; min-height: 54px !important; padding: 15px 24px !important; font-size: 15px !important; font-weight: 600 !important; letter-spacing: 0.02em !important; border-radius: 12px !important; background: #1B2A4A !important; color: #fff !important; box-shadow: 0 8px 22px rgba(27,42,74,.22) !important; transition: transform .18s ease, box-shadow .18s ease !important; } html body .template-product .fc-prod__btn:active, html body .template-product button[name="add"]:active{ transform: scale(.98) !important; box-shadow: 0 4px 12px rgba(27,42,74,.18) !important; } /* ---------- Sticky ATC: premium glass ---------- */ html body .fc-sticky-atc{ position: fixed !important; left: 0 !important; right: 0 !important; bottom: 0 !important; z-index: 100 !important; padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px)) !important; background: rgba(255,255,255,0.96) !important; backdrop-filter: saturate(180%) blur(18px) !important; -webkit-backdrop-filter: saturate(180%) blur(18px) !important; border-top: 1px solid rgba(15,22,40,0.08) !important; box-shadow: 0 -6px 20px rgba(15,22,40,.06) !important; transform: translateY(110%) !important; transition: transform .28s cubic-bezier(.22,.61,.36,1), opacity .28s cubic-bezier(.22,.61,.36,1) !important; opacity: 0 !important; display: flex !important; align-items: center !important; gap: 12px !important; } html body .fc-sticky-atc.is-visible{ transform: translateY(0) !important; opacity: 1 !important; } html body .fc-sticky-atc__info{ flex: 1 1 auto !important; min-width: 0 !important; } html body .fc-sticky-atc__title{ font-size: 12.5px !important; line-height: 1.2 !important; color: #1B2A4A !important; font-weight: 600 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; } html body .fc-sticky-atc__price{ font-size: 14px !important; font-weight: 700 !important; color: #1B2A4A !important; margin-top: 2px !important; } html body .fc-sticky-atc__btn{ flex: 0 0 auto !important; min-height: 46px !important; padding: 10px 20px !important; font-size: 14px !important; font-weight: 600 !important; border-radius: 10px !important; background: #1B2A4A !important; color: #fff !important; white-space: nowrap !important; } /* ---------- Collection/product grid pages ---------- */ html body .template-collection .grid, html body .template-collection .product-grid, html body .collection .product-grid{ display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 12px !important; } html body .template-collection .card-wrapper, html body .template-collection .grid__item{ width: 100% !important; } html body .template-collection .card__heading, html body .template-collection .card__information h3{ font-size: 14px !important; line-height: 1.25 !important; font-weight: 500 !important; } html body .template-collection .price{ font-size: 14px !important; font-weight: 600 !important; } /* ---------- Touch press feedback on any link/button ---------- */ html body a.fc-cta__btn:active, html body a.fc-coll__card-btn:active, html body a.fc-hero4__cta:active, html body a.fc-hero4__btn:active, html body button.fc-nl__btn:active{ transform: scale(.97) !important; transition: transform .08s ease !important; } /* ---------- Scroll-reveal softer on mobile ---------- */ html body .fc-reveal{ transform: translateY(12px) !important; opacity: 0 !important; transition: transform .48s cubic-bezier(.22,.61,.36,1), opacity .48s cubic-bezier(.22,.61,.36,1) !important; } html body .fc-reveal.fc-reveal--in{ transform: translateY(0) !important; opacity: 1 !important; } /* ---------- Typography color tokens ---------- */ html body p, html body .fc-section__body{ color: #3a4765 !important; } /* ---------- Tap targets: minimum 44px ---------- */ html body a, html body button{ min-height: 44px; } html body nav a, html body nav button, html body .fc-drawer__link, html body .fc-header__nav-link{ min-height: 48px !important; } /* ---------- Drawer: smooth premium slide ---------- */ html body .fc-drawer__panel{ transition: transform .32s cubic-bezier(.22,.61,.36,1) !important; } html body .fc-drawer__link{ font-size: 15px !important; padding: 14px 20px !important; border-bottom: 1px solid rgba(15,22,40,0.06) !important; } /* ---------- Kill horizontal overflow anywhere ---------- */ html, body{ overflow-x: hidden !important; } html body img, html body video, html body iframe{ max-width: 100% !important; height: auto; } /* ---------- Focus-visible rings (accessibility) ---------- */ html body *:focus-visible{ outline: 2px solid #b8953f !important; outline-offset: 2px !important; border-radius: 4px !important; } } /* ---------- Tablet 600-849 refinements ---------- */ @media (min-width: 600px) and (max-width: 849px){ html body .fc-shop__grid, html body .fc-coll__grid{ gap: 16px !important; } html body .fc-rev__grid{ grid-template-columns: 1fr 1fr !important; } html body .fc-hero4__title{ font-size: 42px !important; } } /* End fc-mobile-v3.css */ /* ===== fc-mobile-v4.css ===== */ /* ============================================================ fc-mobile-v4.css — Collection grid 2-column Zalando-style Loads AFTER fc-mobile-v3.css for max specificity. Targets collection template (/collections/*) so homepage Oro/Argento hero cards stay untouched. ============================================================ */ @media (max-width: 849px){ /* ---------- Force symmetric 2-column grid on collection template ---------- */ html body.template-collection .fc-coll__grid, html body .template-collection .fc-coll__grid, html body .template-collection .fc-coll__inner > .fc-coll__grid, html body .template-collection .collection .product-grid, html body .template-collection ul.product-grid, html body .template-collection .collection-grid, html body .template-collection .grid.product-grid{ display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 10px 10px !important; padding: 12px 12px 40px !important; width: 100% !important; max-width: 100% !important; min-height: 0 !important; flex-direction: unset !important; } /* ---------- Reset each card to compact product tile ---------- */ html body.template-collection .fc-coll__grid > .fc-coll__card, html body .template-collection .fc-coll__grid > .fc-coll__card, html body .template-collection .fc-coll__card:not(.fc-coll__card--oro):not(.fc-coll__card--argento){ display: flex !important; flex-direction: column !important; justify-content: flex-start !important; min-height: 0 !important; height: auto !important; aspect-ratio: auto !important; padding: 0 !important; background: #fff !important; border-radius: 12px !important; border: 1px solid rgba(15,22,40,0.06) !important; overflow: hidden !important; box-shadow: 0 2px 8px rgba(15,22,40,0.04) !important; transition: transform .18s ease, box-shadow .18s ease !important; flex: 0 0 auto !important; width: 100% !important; max-width: 100% !important; color: #1B2A4A !important; text-decoration: none !important; } html body .template-collection .fc-coll__card:not(.fc-coll__card--oro):not(.fc-coll__card--argento):active{ transform: scale(.985) !important; box-shadow: 0 1px 4px rgba(15,22,40,0.06) !important; } /* ---------- Kill any dark overlay/gradient inside plain product cards ---------- */ html body .template-collection .fc-coll__card:not(.fc-coll__card--oro):not(.fc-coll__card--argento) .fc-coll__card-overlay{ display: none !important; } /* ---------- Image: top of card, clean 1:1 ---------- */ html body .template-collection .fc-coll__card .fc-coll__card-img, html body .template-collection .fc-coll__card .fc-coll__card-image, html body .template-collection .fc-coll__card a.fc-coll__card-img{ position: relative !important; display: block !important; width: 100% !important; height: auto !important; aspect-ratio: 1 / 1 !important; background: #faf8f3 !important; overflow: hidden !important; border-radius: 0 !important; margin: 0 !important; } html body .template-collection .fc-coll__card .fc-coll__card-img img, html body .template-collection .fc-coll__card .fc-coll__card-image img, html body .template-collection .fc-coll__card picture img{ width: 100% !important; height: 100% !important; object-fit: contain !important; object-position: center !important; padding: 10px !important; transition: transform .35s ease !important; } /* If card has no dedicated img container, push direct img to top */ html body .template-collection .fc-coll__card > img, html body .template-collection .fc-coll__card > picture > img{ width: 100% !important; aspect-ratio: 1 / 1 !important; object-fit: contain !important; object-position: center !important; background: #faf8f3 !important; padding: 10px !important; display: block !important; } /* ---------- Card body: title + price under image ---------- */ html body .template-collection .fc-coll__card .fc-coll__card-content, html body .template-collection .fc-coll__card .fc-coll__card-info, html body .template-collection .fc-coll__card .fc-coll__card-body{ position: static !important; z-index: 1 !important; display: flex !important; flex-direction: column !important; gap: 4px !important; padding: 10px 12px 14px !important; background: #fff !important; color: #1B2A4A !important; text-align: left !important; } /* Title (product name) — clamp 2 lines */ html body .template-collection .fc-coll__card .fc-coll__card-title, html body .template-collection .fc-coll__card .fc-coll__card-name, html body .template-collection .fc-coll__card h2, html body .template-collection .fc-coll__card h3{ font-family: var(--cm-font-body, "Inter", sans-serif) !important; font-size: 13px !important; font-weight: 500 !important; line-height: 1.3 !important; letter-spacing: -0.005em !important; color: #1B2A4A !important; margin: 0 0 4px !important; padding: 0 !important; text-align: left !important; text-transform: none !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; min-height: 2.6em !important; text-shadow: none !important; } /* Eyebrow/tag: hide if not helpful on tiny cards */ html body .template-collection .fc-coll__card .fc-coll__card-label, html body .template-collection .fc-coll__card .fc-coll__card-tag, html body .template-collection .fc-coll__card .fc-coll__card-desc{ display: none !important; } /* Price row */ html body .template-collection .fc-coll__card .fc-coll__card-price-row, html body .template-collection .fc-coll__card .fc-coll__card-prices, html body .template-collection .fc-coll__card .price{ display: flex !important; flex-wrap: wrap !important; align-items: baseline !important; gap: 6px !important; margin: 2px 0 0 !important; padding: 0 !important; } html body .template-collection .fc-coll__card .fc-coll__card-price, html body .template-collection .fc-coll__card .fc-collection-card-price-now, html body .template-collection .fc-coll__card .price-item--sale, html body .template-collection .fc-coll__card .price-item--regular{ font-family: var(--cm-font-body, "Inter", sans-serif) !important; font-size: 14px !important; font-weight: 700 !important; color: #1B2A4A !important; line-height: 1.2 !important; letter-spacing: -0.005em !important; font-variant-numeric: tabular-nums !important; } html body .template-collection .fc-coll__card .fc-coll__card-compare, html body .template-collection .fc-coll__card .fc-collection-card-price-old, html body .template-collection .fc-coll__card .price__compare .price-item, html body .template-collection .fc-coll__card s, html body .template-collection .fc-coll__card del{ font-size: 12px !important; font-weight: 400 !important; color: #94a3b8 !important; text-decoration: line-through !important; line-height: 1.2 !important; } /* Hide CTA buttons inside tiny cards — whole card is clickable */ html body .template-collection .fc-coll__card .fc-coll__card-btn, html body .template-collection .fc-coll__card .fc-coll__card-cta{ display: none !important; } /* ---------- Collection page: tighten page header ---------- */ html body .template-collection .collection-hero, html body .template-collection .main-collection__header, html body .template-collection .collection__title-wrapper, html body .template-collection .page-heading, html body .template-collection main > section > header, html body .template-collection .fc-coll__heading{ padding: 28px 16px 14px !important; text-align: center !important; } html body .template-collection h1{ font-family: var(--cm-font-head, "Playfair Display", Georgia, serif) !important; font-size: clamp(28px, 7vw, 36px) !important; font-weight: 600 !important; line-height: 1.1 !important; letter-spacing: -0.015em !important; color: #1B2A4A !important; margin: 0 0 8px !important; text-transform: none !important; } /* ---------- Homepage fc-shop grid: ALSO ensure 2-col ---------- */ html body .fc-shop__grid, html body section .fc-shop__grid, html body .shopify-section .fc-shop__grid{ display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 10px !important; padding: 8px 0 !important; } html body .fc-shop__card{ display: flex !important; flex-direction: column !important; width: 100% !important; min-height: 0 !important; background: #fff !important; border-radius: 12px !important; overflow: hidden !important; border: 1px solid rgba(15,22,40,0.06) !important; box-shadow: 0 2px 8px rgba(15,22,40,0.04) !important; } html body .fc-shop__card:active{ transform: scale(.985) !important; } html body .fc-shop__card .fc-shop__img, html body .fc-shop__card .fc-shop__img-link{ display: block !important; aspect-ratio: 1 / 1 !important; width: 100% !important; background: #faf8f3 !important; overflow: hidden !important; } html body .fc-shop__card .fc-shop__img img, html body .fc-shop__card .fc-shop__img-link img{ width: 100% !important; height: 100% !important; object-fit: contain !important; padding: 10px !important; } html body .fc-shop__card .fc-shop__info{ padding: 10px 12px 14px !important; display: flex !important; flex-direction: column !important; gap: 4px !important; } html body .fc-shop__card .fc-shop__name{ font-family: var(--cm-font-body, "Inter", sans-serif) !important; font-size: 13px !important; font-weight: 500 !important; line-height: 1.3 !important; color: #1B2A4A !important; margin: 0 !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; min-height: 2.6em !important; text-transform: none !important; letter-spacing: -0.005em !important; } html body .fc-shop__card .fc-shop__desc{ display: none !important; } html body .fc-shop__card .fc-shop__price{ display: flex !important; flex-wrap: wrap !important; align-items: baseline !important; gap: 6px !important; margin: 2px 0 0 !important; } html body .fc-shop__card .fc-shop__amount{ font-size: 14px !important; font-weight: 700 !important; color: #1B2A4A !important; font-variant-numeric: tabular-nums !important; } html body .fc-shop__card .fc-shop__compare{ font-size: 12px !important; color: #94a3b8 !important; text-decoration: line-through !important; } html body .fc-shop__card .fc-shop__atc, html body .fc-shop__card .fc-shop__badge{ display: none !important; } /* ---------- Small phones: tighter gaps ---------- */ @media (max-width: 380px){ html body .template-collection .fc-coll__grid, html body .fc-shop__grid{ gap: 8px !important; padding: 10px 10px 32px !important; } html body .template-collection .fc-coll__card .fc-coll__card-title, html body .template-collection .fc-coll__card .fc-coll__card-name, html body .fc-shop__card .fc-shop__name{ font-size: 12.5px !important; } } } /* ---------- Tablet 600–849: 2 columns, more generous ---------- */ @media (min-width: 600px) and (max-width: 849px){ html body .template-collection .fc-coll__grid, html body .fc-shop__grid{ grid-template-columns: 1fr 1fr !important; gap: 14px !important; padding: 20px 16px 48px !important; } } /* End fc-mobile-v4.css */ /* ===== fc-mobile-v5.css ===== */ /* ============================================================ fc-mobile-v5.css — Override layer for user feedback: 1) Collection grid truly 2-col symmetric (beats fc-mobile-tighten) 2) Visible hamburger menu top-left on mobile 3) Punchier Oro/Argento hero cards Loads AFTER fc-mobile-v4.css with ultra-high specificity. ============================================================ */ @media (max-width: 849px){ /* ---------- 1) COLLECTION GRID — ULTRA SPECIFICITY ---------- */ html body.template-collection.gradient .fc-coll[class] .fc-coll__grid[class][class][class], html body.template-collection.gradient main .fc-coll__grid[class][class][class], html body.template-collection.gradient .fc-coll__grid[class][class][class], html body.template-collection .fc-coll__grid[class][class][class][class]{ display: grid !important; grid-template-columns: 1fr 1fr !important; grid-auto-rows: auto !important; gap: 10px 10px !important; padding: 12px 12px 40px !important; width: 100% !important; max-width: 100% !important; min-height: 0 !important; flex-direction: unset !important; } /* ---------- CARD — compact, proportional ---------- */ html body.template-collection .fc-coll__grid[class] > .fc-coll__card:not(.fc-coll__card--oro):not(.fc-coll__card--argento), html body.template-collection .fc-coll__card[class]:not(.fc-coll__card--oro):not(.fc-coll__card--argento){ aspect-ratio: auto !important; height: auto !important; min-height: 0 !important; max-height: none !important; display: flex !important; flex-direction: column !important; justify-content: flex-start !important; padding: 0 !important; background: #fff !important; border: 1px solid rgba(15,22,40,0.06) !important; border-radius: 12px !important; overflow: hidden !important; box-shadow: 0 2px 8px rgba(15,22,40,0.04) !important; color: #1B2A4A !important; text-decoration: none !important; width: 100% !important; max-width: 100% !important; } html body.template-collection .fc-coll__card:not(.fc-coll__card--oro):not(.fc-coll__card--argento):active{ transform: scale(.985) !important; box-shadow: 0 1px 4px rgba(15,22,40,0.06) !important; } /* Kill any dark overlay inside product cards */ html body.template-collection .fc-coll__card:not(.fc-coll__card--oro):not(.fc-coll__card--argento) .fc-coll__card-overlay, html body.template-collection .fc-coll__card:not(.fc-coll__card--oro):not(.fc-coll__card--argento)::before, html body.template-collection .fc-coll__card:not(.fc-coll__card--oro):not(.fc-coll__card--argento)::after{ display: none !important; background: none !important; } /* ---------- IMAGE: top, 1:1 square ---------- */ html body.template-collection .fc-coll__card[class] .fc-coll__card-img[class]{ position: relative !important; display: block !important; width: 100% !important; aspect-ratio: 1 / 1 !important; height: auto !important; background: #faf8f3 !important; overflow: hidden !important; margin: 0 !important; padding: 0 !important; border-radius: 0 !important; } html body.template-collection .fc-coll__card[class] .fc-coll__card-img[class] img, html body.template-collection .fc-coll__card[class] .fc-coll__card-img[class] picture img{ width: 100% !important; height: 100% !important; object-fit: contain !important; object-position: center !important; padding: 8px !important; background: #faf8f3 !important; } /* ---------- INFO area ---------- */ html body.template-collection .fc-coll__card[class] .fc-coll__card-info[class]{ padding: 8px 10px 12px !important; display: flex !important; flex-direction: column !important; gap: 3px !important; background: #fff !important; color: #1B2A4A !important; position: static !important; width: 100% !important; text-align: left !important; min-height: 0 !important; } /* Name — 2-line clamp */ html body.template-collection .fc-coll__card[class] .fc-coll__card-name[class], html body.template-collection .fc-coll__card[class] .fc-coll__card-title[class], html body.template-collection .fc-coll__card h2, html body.template-collection .fc-coll__card h3{ font-family: "Inter", "Helvetica Neue", sans-serif !important; font-size: 12.5px !important; font-weight: 500 !important; line-height: 1.3 !important; color: #1B2A4A !important; margin: 0 0 2px !important; padding: 0 !important; text-align: left !important; text-transform: none !important; letter-spacing: -0.005em !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; min-height: 2.6em !important; text-shadow: none !important; } /* Hide description/label on tiny cards */ html body.template-collection .fc-coll__card[class] .fc-coll__card-label, html body.template-collection .fc-coll__card[class] .fc-coll__card-tag, html body.template-collection .fc-coll__card[class] .fc-coll__card-desc{ display: none !important; } /* Price — navy, prominent */ html body.template-collection .fc-coll__card[class] .fc-coll__card-price[class]{ font-family: "Inter", sans-serif !important; font-size: 14px !important; font-weight: 700 !important; color: #1B2A4A !important; line-height: 1.2 !important; margin: 2px 0 0 !important; padding: 0 !important; display: inline !important; font-variant-numeric: tabular-nums !important; letter-spacing: -0.005em !important; text-shadow: none !important; } html body.template-collection .fc-coll__card[class] .fc-coll__card-compare[class]{ font-family: "Inter", sans-serif !important; font-size: 11.5px !important; font-weight: 400 !important; color: #94a3b8 !important; text-decoration: line-through !important; margin-left: 6px !important; display: inline !important; line-height: 1.2 !important; } /* HIDE per-card CTA button — whole card is clickable */ html body.template-collection .fc-coll__card[class]:not(.fc-coll__card--oro):not(.fc-coll__card--argento) .fc-coll__card-btn, html body.template-collection .fc-coll__card[class]:not(.fc-coll__card--oro):not(.fc-coll__card--argento) .fc-coll__card-cta, html body.template-collection .fc-coll__card[class]:not(.fc-coll__card--oro):not(.fc-coll__card--argento) a.button, html body.template-collection .fc-coll__card[class]:not(.fc-coll__card--oro):not(.fc-coll__card--argento) button{ display: none !important; } /* Very small phones */ @media (max-width: 380px){ html body.template-collection .fc-coll__grid[class][class]{ gap: 8px !important; padding: 10px 10px 32px !important; } html body.template-collection .fc-coll__card .fc-coll__card-name{ font-size: 12px !important; } html body.template-collection .fc-coll__card .fc-coll__card-price{ font-size: 13px !important; } } /* ---------- 2) HAMBURGER — force visible on mobile ---------- */ html body .fc-header__burger, html body #fc-burger{ display: inline-flex !important; flex-direction: column !important; justify-content: center !important; align-items: center !important; gap: 5px !important; width: 44px !important; height: 44px !important; padding: 0 !important; margin: 0 !important; background: transparent !important; border: none !important; border-radius: 8px !important; cursor: pointer !important; z-index: 200 !important; position: relative !important; flex: 0 0 auto !important; opacity: 1 !important; visibility: visible !important; } html body .fc-header__burger:hover, html body .fc-header__burger:active{ background: rgba(15,22,40,0.04) !important; } html body .fc-header__burger-bar{ display: block !important; width: 22px !important; height: 2px !important; background: #1B2A4A !important; border-radius: 2px !important; transition: transform .22s cubic-bezier(.22,.61,.36,1), opacity .22s ease !important; pointer-events: none !important; } /* Burger open state -> X */ html body .fc-header__burger[aria-expanded="true"] .fc-header__burger-bar:nth-child(1){ transform: translateY(7px) rotate(45deg) !important; } html body .fc-header__burger[aria-expanded="true"] .fc-header__burger-bar:nth-child(2){ opacity: 0 !important; } html body .fc-header__burger[aria-expanded="true"] .fc-header__burger-bar:nth-child(3){ transform: translateY(-7px) rotate(-45deg) !important; } /* Header container: burger left | logo center | cart right */ html body .fc-header, html body header.fc-header{ position: sticky !important; top: 0 !important; z-index: 50 !important; background: #fff !important; border-bottom: 1px solid rgba(15,22,40,0.06) !important; } html body .fc-header__container{ display: grid !important; grid-template-columns: 44px 1fr 44px !important; align-items: center !important; gap: 8px !important; padding: 10px 12px !important; max-width: 100% !important; margin: 0 !important; } html body .fc-header__brand{ text-align: center !important; justify-self: center !important; margin: 0 !important; } html body .fc-header__logo-text{ font-family: "Playfair Display", Georgia, serif !important; font-weight: 600 !important; font-size: 18px !important; color: #1B2A4A !important; letter-spacing: -0.01em !important; } html body .fc-header__nav{ display: none !important; /* hidden; accessed via drawer */ } html body .fc-header__actions, html body .fc-header__cart, html body .fc-header__cart-link{ justify-self: end !important; } /* ---------- 3) ORO / ARGENTO HERO CARDS — punchy gradients ---------- */ html body .fc-coll__card--oro{ background: linear-gradient(135deg, #fff2c6 0%, #eccf78 22%, #c99a3a 52%, #8a6a1e 100%) !important; color: #fff !important; border: none !important; border-radius: 14px !important; box-shadow: 0 14px 32px rgba(184,149,63,0.25), inset 0 1px 0 rgba(255,255,255,0.35) !important; position: relative !important; overflow: hidden !important; } html body .fc-coll__card--oro::before{ content: "" !important; position: absolute !important; inset: 0 !important; background: radial-gradient(ellipse at 30% 20%, rgba(255,255,255,0.35) 0%, rgba(255,255,255,0) 55%) !important; pointer-events: none !important; z-index: 1 !important; display: block !important; } html body .fc-coll__card--argento{ background: linear-gradient(135deg, #f8fafc 0%, #d3d8df 22%, #9aa2ad 52%, #5a6271 100%) !important; color: #fff !important; border: none !important; border-radius: 14px !important; box-shadow: 0 14px 32px rgba(107,114,128,0.28), inset 0 1px 0 rgba(255,255,255,0.45) !important; position: relative !important; overflow: hidden !important; } html body .fc-coll__card--argento::before{ content: "" !important; position: absolute !important; inset: 0 !important; background: radial-gradient(ellipse at 30% 20%, rgba(255,255,255,0.45) 0%, rgba(255,255,255,0) 55%) !important; pointer-events: none !important; z-index: 1 !important; display: block !important; } /* Oro/Argento content above gradient */ html body .fc-coll__card--oro > *, html body .fc-coll__card--argento > *{ position: relative !important; z-index: 2 !important; } /* Labels + titles */ html body .fc-coll__card--oro .fc-coll__card-label, html body .fc-coll__card--argento .fc-coll__card-label{ color: rgba(255,255,255,0.88) !important; font-family: "Inter", sans-serif !important; font-size: 11px !important; font-weight: 600 !important; letter-spacing: 0.2em !important; text-transform: uppercase !important; text-shadow: 0 1px 2px rgba(15,22,40,0.25) !important; display: block !important; margin-bottom: 6px !important; } html body .fc-coll__card--oro .fc-coll__card-title, html body .fc-coll__card--oro .fc-coll__card-name, html body .fc-coll__card--argento .fc-coll__card-title, html body .fc-coll__card--argento .fc-coll__card-name{ font-family: "Playfair Display", Georgia, serif !important; font-size: 28px !important; font-weight: 600 !important; line-height: 1.1 !important; color: #fff !important; text-shadow: 0 2px 4px rgba(15,22,40,0.35) !important; margin: 0 0 10px !important; letter-spacing: -0.01em !important; text-transform: none !important; } html body .fc-coll__card--oro .fc-coll__card-desc, html body .fc-coll__card--argento .fc-coll__card-desc{ font-family: "Inter", sans-serif !important; font-size: 13px !important; font-weight: 400 !important; line-height: 1.5 !important; color: rgba(255,255,255,0.95) !important; text-shadow: 0 1px 2px rgba(15,22,40,0.3) !important; margin: 0 0 16px !important; display: block !important; } /* Oro button: deep navy on gold */ html body .fc-coll__card--oro .fc-coll__card-btn{ display: inline-flex !important; align-items: center !important; justify-content: center !important; background: #1B2A4A !important; color: #fff !important; border: none !important; border-radius: 10px !important; padding: 12px 22px !important; font-family: "Inter", sans-serif !important; font-size: 13px !important; font-weight: 600 !important; letter-spacing: 0.06em !important; text-transform: uppercase !important; text-decoration: none !important; box-shadow: 0 4px 12px rgba(15,22,40,0.25) !important; transition: transform .18s ease, box-shadow .18s ease !important; } /* Argento button: cream on silver */ html body .fc-coll__card--argento .fc-coll__card-btn{ display: inline-flex !important; align-items: center !important; justify-content: center !important; background: #fff !important; color: #1B2A4A !important; border: none !important; border-radius: 10px !important; padding: 12px 22px !important; font-family: "Inter", sans-serif !important; font-size: 13px !important; font-weight: 600 !important; letter-spacing: 0.06em !important; text-transform: uppercase !important; text-decoration: none !important; box-shadow: 0 4px 12px rgba(15,22,40,0.15) !important; transition: transform .18s ease, box-shadow .18s ease !important; } html body .fc-coll__card--oro .fc-coll__card-btn:active, html body .fc-coll__card--argento .fc-coll__card-btn:active{ transform: scale(.97) !important; } /* Oro/Argento card padding + min-height */ html body .fc-coll__card--oro, html body .fc-coll__card--argento{ padding: 28px 24px !important; min-height: 340px !important; display: flex !important; flex-direction: column !important; justify-content: flex-end !important; } /* Small accent circle top-left — keep but recolor */ html body .fc-coll__card--oro .fc-coll__card-accent, html body .fc-coll__card--oro > svg:first-child, html body .fc-coll__card--oro > span:first-child{ border-color: rgba(255,255,255,0.7) !important; background: rgba(255,255,255,0.15) !important; } html body .fc-coll__card--argento .fc-coll__card-accent, html body .fc-coll__card--argento > svg:first-child, html body .fc-coll__card--argento > span:first-child{ border-color: rgba(255,255,255,0.7) !important; background: rgba(255,255,255,0.15) !important; } } /* ---------- Tablet 600–849: 2 cols, generous ---------- */ @media (min-width: 600px) and (max-width: 849px){ html body.template-collection .fc-coll__grid[class][class][class], html body .fc-shop__grid[class][class]{ grid-template-columns: 1fr 1fr !important; gap: 14px !important; padding: 20px 16px 48px !important; } } /* End fc-mobile-v5.css */ /* ===== fc-mobile-premium-v5.css ===== */ /* ============================================================== CUCINA MODENA — MOBILE PREMIUM v5 Competitor-grade polish (Zalando / Apple / Nike / Asos / Mejuri) Deployed 2026-04-21 ============================================================== */ /* ---------- Design tokens ---------- */ :root{ --cm-gold:#C9A23A; --cm-gold-2:#B8901F; --cm-gold-soft:#E8D69A; --cm-gold-pale:#FAF3DA; --cm-navy:#0F1628; --cm-navy-2:#1B2A4A; --cm-cream:#FAF7F1; --cm-cream-2:#F4EFE6; --cm-ink:#1A1A1A; --cm-muted:#6B6B6B; --cm-line:rgba(15,22,40,0.08); --cm-line-2:rgba(15,22,40,0.14); --cm-shadow-xs:0 1px 2px rgba(15,22,40,0.05); --cm-shadow-sm:0 2px 6px rgba(15,22,40,0.06); --cm-shadow:0 8px 22px rgba(15,22,40,0.08); --cm-shadow-lg:0 20px 44px rgba(15,22,40,0.14); --cm-radius-sm:10px; --cm-radius:14px; --cm-radius-lg:20px; --cm-radius-xl:28px; --cm-ease:cubic-bezier(0.4,0,0.2,1); --cm-ease-out:cubic-bezier(0.16,1,0.3,1); --cm-sa-bottom:env(safe-area-inset-bottom,0px); --cm-sa-top:env(safe-area-inset-top,0px); } /* ============================================================== 0. UNIVERSAL BASELINE — applies on every viewport ============================================================== */ *{-webkit-tap-highlight-color:rgba(201,162,58,0.12);} html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;} body{font-feature-settings:"kern","liga";text-rendering:optimizeLegibility;overflow-x:hidden;} img,video,svg{max-width:100%;height:auto;} button,input,select,textarea{font:inherit;color:inherit;} input,select,textarea{font-size:16px;} /* smooth momentum scroll on iOS */ .fc-scroll-x, [data-fc-scroll], .fc-pcarousel-track, .fc-upsell, .fc-prodcat-grid{ -webkit-overflow-scrolling:touch; overscroll-behavior-x:contain; } /* ============================================================== 1. MOBILE GLOBAL (≤860px) ============================================================== */ @media (max-width:860px){ body{font-size:15px;line-height:1.55;} .page-width,.container,.fc-section,.shopify-section > *{ padding-left:16px;padding-right:16px;box-sizing:border-box; } h1,.h1{font-size:clamp(26px,6.6vw,34px);line-height:1.12;letter-spacing:-0.015em;} h2,.h2{font-size:clamp(22px,5.4vw,28px);line-height:1.18;letter-spacing:-0.01em;} h3,.h3{font-size:18px;line-height:1.25;letter-spacing:-0.005em;} .fc-kicker,[class*="kicker"]{ font-size:11px;letter-spacing:0.16em;text-transform:uppercase; color:var(--cm-gold);font-weight:600; } /* hide ghost borders from inherited theme */ .shopify-section + .shopify-section{margin-top:0;} /* smoother scroll snapping for any carousel-type list */ .fc-pcarousel-track, [data-fc-snap]{ scroll-snap-type:x mandatory; scroll-padding-left:16px; } .fc-pcarousel-track > *, [data-fc-snap] > *{ scroll-snap-align:start; } } /* ============================================================== 2. HEADER v2 — sticky glassy mobile nav ============================================================== */ @media (max-width:860px){ .fc-header-v2, .shopify-section-header, header.fc-header{ position:sticky;top:0;z-index:95; background:rgba(250,247,241,0.92); -webkit-backdrop-filter:saturate(180%) blur(14px); backdrop-filter:saturate(180%) blur(14px); border-bottom:1px solid var(--cm-line); padding-top:var(--cm-sa-top); transition:box-shadow 0.3s var(--cm-ease); } .fc-header-v2.is-scrolled, .shopify-section-header.is-scrolled{ box-shadow:var(--cm-shadow-sm); } .fc-header-v2-inner, .fc-header-inner{ display:grid; grid-template-columns:40px 1fr 40px; align-items:center;gap:10px; min-height:56px;padding:8px 14px; } .fc-header-v2-logo, .site-header__logo, .fc-header-logo{ grid-column:2;justify-self:center; font-size:15px;font-weight:600;letter-spacing:0.22em; color:var(--cm-navy);white-space:nowrap; text-transform:uppercase; } .fc-hamburger, .fc-header-v2-hamburger{ grid-column:1; display:flex !important;align-items:center;justify-content:center; width:40px;height:40px;border-radius:12px; background:transparent;border:none; color:var(--cm-navy);cursor:pointer; } .fc-hamburger svg, .fc-header-v2-hamburger svg{width:22px;height:22px;} .fc-cart-btn, .fc-header-v2-cart{ grid-column:3; width:40px;height:40px;border-radius:12px; background:var(--cm-navy);color:#fff !important; display:flex;align-items:center;justify-content:center; position:relative;text-decoration:none; transition:transform 0.2s var(--cm-ease); } .fc-cart-btn:active, .fc-header-v2-cart:active{transform:scale(0.94);} .fc-cart-btn svg, .fc-header-v2-cart svg{width:20px;height:20px;} .fc-cart-count, .fc-header-v2-count{ position:absolute;top:-4px;right:-6px; min-width:18px;height:18px;padding:0 5px; background:var(--cm-gold);color:var(--cm-navy); border-radius:9px;font-size:11px;font-weight:700; display:flex;align-items:center;justify-content:center; border:2px solid var(--cm-cream);line-height:1; } /* hide desktop nav */ .fc-header-v2-nav-desktop, .fc-header-nav-desktop, .site-header__nav-desktop{display:none !important;} } /* ---------- Drawer menu ---------- */ @media (max-width:860px){ .fc-drawer, .fc-header-v2-drawer{ position:fixed;inset:0;z-index:110; pointer-events:none;visibility:hidden; } .fc-drawer.is-open, .fc-header-v2-drawer.is-open{ pointer-events:auto;visibility:visible; } .fc-drawer-backdrop, .fc-header-v2-drawer-back{ position:absolute;inset:0; background:rgba(15,22,40,0.5); opacity:0;transition:opacity 0.3s var(--cm-ease); -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px); } .fc-drawer.is-open .fc-drawer-backdrop, .fc-header-v2-drawer.is-open .fc-header-v2-drawer-back{opacity:1;} .fc-drawer-panel, .fc-header-v2-drawer-panel{ position:absolute;top:0;left:0;bottom:0; width:min(86vw,360px); background:var(--cm-cream); transform:translateX(-105%); transition:transform 0.38s var(--cm-ease-out); display:flex;flex-direction:column; padding-top:var(--cm-sa-top); box-shadow:10px 0 40px rgba(0,0,0,0.15); } .fc-drawer.is-open .fc-drawer-panel, .fc-header-v2-drawer.is-open .fc-header-v2-drawer-panel{transform:translateX(0);} .fc-drawer-head, .fc-header-v2-drawer-head{ display:flex;align-items:center;justify-content:space-between; padding:16px 20px;border-bottom:1px solid var(--cm-line); } .fc-drawer-brand{ font-size:15px;font-weight:600;letter-spacing:0.22em; color:var(--cm-navy);text-transform:uppercase; } .fc-drawer-close{ width:36px;height:36px;border-radius:50%; border:1px solid var(--cm-line-2);background:transparent; display:flex;align-items:center;justify-content:center; color:var(--cm-navy); } .fc-drawer-links, .fc-header-v2-drawer-links{ padding:12px 12px 20px;flex:1;overflow-y:auto; } .fc-drawer-links a, .fc-header-v2-drawer-links a{ display:flex;align-items:center;justify-content:space-between; padding:14px 16px;margin:2px 0; font-size:16px;font-weight:500;color:var(--cm-navy); text-decoration:none;border-radius:12px; transition:background 0.2s var(--cm-ease); } .fc-drawer-links a:active{background:rgba(201,162,58,0.1);} .fc-drawer-links a::after, .fc-header-v2-drawer-links a::after{ content:"";width:7px;height:7px; border-right:2px solid var(--cm-muted); border-top:2px solid var(--cm-muted); transform:rotate(45deg);opacity:0.6; } .fc-drawer-foot, .fc-header-v2-drawer-foot{ padding:16px 20px calc(20px + var(--cm-sa-bottom)); border-top:1px solid var(--cm-line); display:flex;gap:10px;flex-wrap:wrap; } .fc-drawer-foot .fc-drawer-chip{ flex:1;min-width:0;padding:10px 12px; background:var(--cm-cream-2);border-radius:999px; font-size:12px;letter-spacing:0.08em;text-transform:uppercase; color:var(--cm-navy);text-align:center;font-weight:600; text-decoration:none; } } /* ============================================================== 3. ANNOUNCEMENT / TICKER ============================================================== */ @media (max-width:860px){ .fc-announcement, .fc-ticker{ font-size:12px;letter-spacing:0.06em; } .fc-ticker-track{animation-duration:36s !important;} .fc-ticker-item{padding:0 20px;} } /* ============================================================== 4. COUNTDOWN v2 ============================================================== */ @media (max-width:860px){ .fc-countdown-v2{padding:28px 16px !important;} .fc-countdown-v2-title{ font-size:clamp(20px,5.2vw,26px); line-height:1.18;margin:0 0 18px; } .fc-countdown-v2-grid{ display:grid;grid-template-columns:repeat(4,1fr);gap:8px; max-width:100%;margin:0 auto; } .fc-countdown-v2-cell{ padding:14px 6px;border-radius:14px; background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.14); backdrop-filter:blur(6px); } .fc-countdown-v2-num{ font-size:clamp(22px,6vw,30px); font-weight:700;font-variant-numeric:tabular-nums; } .fc-countdown-v2-lbl{ font-size:10px;letter-spacing:0.14em; opacity:0.75;margin-top:4px; } } /* ============================================================== 5. HERO — premium scale, safe proportions ============================================================== */ @media (max-width:860px){ .fc-hero, .fc-hero4, .hero-section{ min-height:auto !important; padding:clamp(28px,8vw,44px) 16px !important; } .fc-hero-img-wrap, .fc-hero-img, .fc-hero4-img{ aspect-ratio:4/5;border-radius:var(--cm-radius-lg); overflow:hidden; } .fc-hero-img-wrap img, .fc-hero-img img, .fc-hero4-img img{ width:100%;height:100%;object-fit:cover; } .fc-hero-title, .fc-hero4-title, .hero-title{ font-size:clamp(30px,7.8vw,40px) !important; line-height:1.08 !important; letter-spacing:-0.02em !important; margin:14px 0 10px !important; } .fc-hero-sub, .fc-hero4-sub{ font-size:15px;line-height:1.5; color:var(--cm-muted);margin-bottom:18px; } .fc-hero-cta-row{ display:flex;flex-direction:column;gap:10px; } .fc-hero-cta-row > a, .fc-hero-cta-row > button{width:100%;} } /* ============================================================== 6. BUTTONS — universal touch-target polish ============================================================== */ @media (max-width:860px){ .btn, button.btn, .fc-btn, .fc-cta-esp-btn, .fc-pcarousel-cta, .fc-vs-cta, .fc-paystrip-cta, .fc-upsell-btn, .fc-sticky-atc button, .fc-quiz-btn, [data-fc-btn]{ min-height:48px;padding:14px 20px; border-radius:999px; font-size:15px;font-weight:600;letter-spacing:0.02em; display:inline-flex;align-items:center;justify-content:center;gap:8px; transition:transform 0.15s var(--cm-ease),box-shadow 0.2s var(--cm-ease); cursor:pointer; } .fc-btn:active, .fc-cta-esp-btn:active, [data-fc-btn]:active{transform:scale(0.97);} .fc-btn--primary, .btn--primary, .fc-cta-esp-btn{ background:var(--cm-gold);color:var(--cm-navy);border:none; box-shadow:0 8px 20px rgba(201,162,58,0.28); } .fc-btn--primary:active, .fc-cta-esp-btn:active{ box-shadow:0 4px 10px rgba(201,162,58,0.2); } .fc-btn--secondary, .btn--secondary{ background:var(--cm-navy);color:#fff;border:none; } .fc-btn--ghost, .btn--ghost{ background:transparent;color:var(--cm-navy); border:1.5px solid var(--cm-navy); } } /* ============================================================== 7. PRODUCT GRID — Zalando-compact 2-col ============================================================== */ @media (max-width:860px){ .fc-pgrid, .product-grid, .grid.collection-grid, .fc-collection-products, .product-list{ display:grid !important; grid-template-columns:1fr 1fr !important; gap:8px 8px !important; padding:0 12px; } .fc-pcard, .product-card, .grid__item, .card-wrapper, .fc-pgrid-item{ background:#fff;border-radius:var(--cm-radius); overflow:hidden; box-shadow:var(--cm-shadow-xs); transition:transform 0.28s var(--cm-ease-out),box-shadow 0.28s var(--cm-ease-out); } .fc-pcard:active, .product-card:active{transform:scale(0.985);} .fc-pcard-img, .card__media, .product-card__image-wrapper{ aspect-ratio:1/1;overflow:hidden;background:var(--cm-cream-2); } .fc-pcard-img img, .card__media img, .product-card__image-wrapper img{ width:100%;height:100%;object-fit:cover; transition:transform 0.5s var(--cm-ease-out); } .fc-pcard-body, .card__content, .product-card__info{ padding:10px 10px 12px; } .fc-pcard-name, .card__heading, .product-card__title{ font-size:13.5px;line-height:1.3;font-weight:500; color:var(--cm-navy);margin:0 0 4px; display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden; min-height:2.6em; } .fc-pcard-price, .card__price, .price{ font-size:14px;font-weight:700;color:var(--cm-navy); display:flex;align-items:baseline;gap:6px;flex-wrap:wrap; } .fc-pcard-price-old, .price--compare, .price__compare{ font-size:12px;color:var(--cm-muted); text-decoration:line-through;font-weight:400; } .fc-pcard-badge, .card__badge, .product-card__badge{ position:absolute;top:8px;left:8px; background:var(--cm-navy);color:#fff; font-size:10px;font-weight:700;letter-spacing:0.08em; padding:4px 8px;border-radius:6px;text-transform:uppercase; z-index:2; } .fc-pcard-badge--sale{background:#D93A3A;} .fc-pcard-badge--new{background:var(--cm-gold);color:var(--cm-navy);} } /* ============================================================== 8. PRODUCT CAROUSEL — horizontal scroll ============================================================== */ @media (max-width:860px){ .fc-pcarousel{ padding:28px 0 32px; } .fc-pcarousel-head{padding:0 16px 14px;} .fc-pcarousel-title{ font-size:22px;line-height:1.2;margin:0 0 4px; letter-spacing:-0.01em; } .fc-pcarousel-sub{ font-size:13px;color:var(--cm-muted);margin:0; } .fc-pcarousel-track{ display:flex;gap:10px; overflow-x:auto;scroll-snap-type:x mandatory; padding:4px 16px 10px; scrollbar-width:none;-ms-overflow-style:none; } .fc-pcarousel-track::-webkit-scrollbar{display:none;} .fc-pcarousel-item{ flex:0 0 62%; scroll-snap-align:start; background:#fff;border-radius:var(--cm-radius); overflow:hidden;box-shadow:var(--cm-shadow-xs); } .fc-pcarousel-item-img{aspect-ratio:1/1;overflow:hidden;} .fc-pcarousel-item-img img{width:100%;height:100%;object-fit:cover;} .fc-pcarousel-item-body{padding:10px 12px 12px;} .fc-pcarousel-item-name{ font-size:14px;line-height:1.3;font-weight:500; margin:0 0 4px;color:var(--cm-navy); display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden; } .fc-pcarousel-item-price{ font-size:14px;font-weight:700;color:var(--cm-navy); } } /* ============================================================== 9. VS COMPARISON — scrollable on mobile ============================================================== */ @media (max-width:860px){ .fc-vs{padding:36px 0 !important;} .fc-vs-head{padding:0 16px 20px;text-align:center;} .fc-vs-title{ font-size:clamp(22px,5.6vw,28px) !important; line-height:1.18;margin:0 0 8px; } .fc-vs-sub{font-size:13.5px;color:var(--cm-muted);margin:0;} .fc-vs-table-wrap{ overflow-x:auto;-webkit-overflow-scrolling:touch; scrollbar-width:none;padding:0 16px; } .fc-vs-table-wrap::-webkit-scrollbar{display:none;} .fc-vs-table{ min-width:560px; background:#fff;border-radius:var(--cm-radius); overflow:hidden;box-shadow:var(--cm-shadow-sm); } .fc-vs-row{ display:grid; grid-template-columns:140px repeat(4,1fr); align-items:center; } .fc-vs-row > *{padding:12px 8px;font-size:12.5px;} .fc-vs-row--head{ background:var(--cm-cream-2); position:sticky;top:0;z-index:2; font-size:11px;letter-spacing:0.08em;text-transform:uppercase; } .fc-vs-col--us{ background:rgba(201,162,58,0.08);font-weight:600; } .fc-vs-check{color:#22A447;} .fc-vs-cross{color:#BE4141;opacity:0.85;} } /* ============================================================== 10. CTA ESPERIENZA — dark gradient readable ============================================================== */ @media (max-width:860px){ .fc-cta-esp{ padding:44px 20px !important; margin:32px 12px;border-radius:var(--cm-radius-lg); background:linear-gradient(135deg,#0F1628 0%,#1B2A4A 60%,#2B3A5A 100%) !important; color:#fff;text-align:center; box-shadow:var(--cm-shadow-lg); position:relative;overflow:hidden; } .fc-cta-esp::before{ content:"";position:absolute;inset:-50% -50% auto auto; width:280px;height:280px;border-radius:50%; background:radial-gradient(circle,rgba(201,162,58,0.22),transparent 70%); pointer-events:none; } .fc-cta-esp-inner{position:relative;z-index:1;} .fc-cta-esp-kicker{ display:inline-block;font-size:11px;letter-spacing:0.18em; text-transform:uppercase;color:var(--cm-gold-soft); margin-bottom:14px;font-weight:600; } .fc-cta-esp-title{ font-size:clamp(26px,6.8vw,34px) !important; line-height:1.1;margin:0 0 14px; letter-spacing:-0.015em;font-weight:600;color:#fff; } .fc-cta-esp-title em{ font-style:italic; background:linear-gradient(120deg,#F0D98A 0%,#C9A23A 60%,#F0D98A 100%); -webkit-background-clip:text;-webkit-text-fill-color:transparent; background-clip:text; } .fc-cta-esp-sub{ font-size:14.5px;line-height:1.55; color:rgba(255,255,255,0.85);margin:0 0 24px; } .fc-cta-esp-btn{ background:var(--cm-gold) !important;color:var(--cm-navy) !important; box-shadow:0 8px 24px rgba(201,162,58,0.36); } .fc-cta-esp-btn svg{width:18px;height:18px;} } /* ============================================================== 11. USP / RATING STRIP / TRUST BARS ============================================================== */ @media (max-width:860px){ .fc-rating-strip, .fc-trust{ padding:20px 16px;text-align:center; } .fc-rating-strip-stars{font-size:18px;color:var(--cm-gold);} .fc-rating-strip-text{ font-size:13px;color:var(--cm-navy);margin-top:4px; } .fc-usp-bar, .fc-usp{ padding:22px 12px; } .fc-usp-grid, .fc-usp-row{ display:grid;grid-template-columns:1fr 1fr;gap:10px; } .fc-usp-card, .fc-usp-item{ background:#fff;border-radius:var(--cm-radius); padding:16px 12px;text-align:center; box-shadow:var(--cm-shadow-xs); display:flex;flex-direction:column;align-items:center;gap:8px; } .fc-usp-card svg, .fc-usp-item svg{width:22px;height:22px;color:var(--cm-gold);} .fc-usp-card-title, .fc-usp-item-title{ font-size:13px;font-weight:600;color:var(--cm-navy);margin:0; } .fc-usp-card-text, .fc-usp-item-text{ font-size:11.5px;color:var(--cm-muted);line-height:1.4;margin:0; } } /* ============================================================== 12. COLLECTION CARDS (Oro/Argento) ============================================================== */ @media (max-width:860px){ .fc-collections{padding:28px 0 !important;} .fc-collections-grid{ display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0 12px; } .fc-collections-card{ position:relative;border-radius:var(--cm-radius-lg); overflow:hidden;aspect-ratio:3/4; box-shadow:var(--cm-shadow); display:flex;flex-direction:column;justify-content:flex-end; padding:14px;color:#fff;text-decoration:none; } .fc-collections-card::after{ content:"";position:absolute;inset:0; background:linear-gradient(to top,rgba(0,0,0,0.65) 0%,rgba(0,0,0,0.1) 55%,transparent 100%); z-index:0; } .fc-collections-card img{ position:absolute;inset:0; width:100%;height:100%;object-fit:cover; transition:transform 0.6s var(--cm-ease-out); z-index:-1; } .fc-collections-card > *{position:relative;z-index:1;} .fc-collections-card-kicker{ font-size:10px;letter-spacing:0.14em; opacity:0.85;text-transform:uppercase;margin-bottom:4px; } .fc-collections-card-title{ font-size:18px;font-weight:600;letter-spacing:-0.005em; margin:0 0 8px;line-height:1.15; } .fc-collections-card-cta{ display:inline-flex;align-items:center;gap:6px; font-size:12px;font-weight:600;letter-spacing:0.06em; text-transform:uppercase;color:var(--cm-gold-soft); } } /* ============================================================== 13. UPSELL (cutting board) on mobile ============================================================== */ @media (max-width:860px){ .fc-upsell{ display:grid !important; grid-template-columns:100px 1fr !important; gap:12px !important; background:#fff;border-radius:var(--cm-radius); padding:12px !important; box-shadow:var(--cm-shadow-sm); margin:16px; align-items:stretch; } .fc-upsell-img{ aspect-ratio:1;border-radius:10px;overflow:hidden; background:var(--cm-cream-2); } .fc-upsell-img img{width:100%;height:100%;object-fit:cover;} .fc-upsell-body{display:flex;flex-direction:column;gap:4px;min-width:0;} .fc-upsell-tag{ font-size:10.5px;letter-spacing:0.1em;text-transform:uppercase; color:var(--cm-gold);font-weight:700;margin:0; } .fc-upsell-name{ font-size:14.5px;font-weight:600;color:var(--cm-navy); margin:2px 0 4px;line-height:1.25; } .fc-upsell-desc{ font-size:12px;line-height:1.4;color:var(--cm-muted);margin:0 0 8px; display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden; } .fc-upsell-row{ display:flex;align-items:center;justify-content:space-between;gap:10px; margin-top:auto; } .fc-upsell-price{ display:flex;flex-direction:column;gap:1px; } .fc-upsell-old{ font-size:11px;color:var(--cm-muted); text-decoration:line-through; } .fc-upsell-now{ font-size:15px;font-weight:700;color:var(--cm-navy); } .fc-upsell-btn{ padding:10px 16px;font-size:13px; background:var(--cm-navy);color:#fff;border:none; border-radius:999px;white-space:nowrap;font-weight:600; } } /* ============================================================== 14. PAYMENT STRIP — Italian methods ============================================================== */ @media (max-width:860px){ .fc-paystrip{ padding:22px 16px;background:var(--cm-cream-2); text-align:center; } .fc-paystrip-title{ font-size:11px;letter-spacing:0.16em;text-transform:uppercase; color:var(--cm-muted);margin:0 0 12px;font-weight:600; } .fc-paystrip-icons{ display:flex;gap:8px;flex-wrap:wrap;justify-content:center; align-items:center; } .fc-paystrip-icon{ background:#fff;border-radius:8px; padding:6px 10px;box-shadow:var(--cm-shadow-xs); height:26px;display:flex;align-items:center;justify-content:center; font-size:11px;font-weight:700;color:var(--cm-navy); letter-spacing:0.04em; } .fc-paystrip-icon img, .fc-paystrip-icon svg{height:14px;width:auto;} } /* ============================================================== 15. PDP — Product Detail Page mobile masterwork ============================================================== */ @media (max-width:860px){ .product{padding:0 !important;} .product__media-wrapper, .product-gallery, .fc-pdp-gallery{ margin:0 0 16px !important;padding:0 !important; background:var(--cm-cream-2); } .product__media-list, .product-gallery__list{ display:flex !important;flex-direction:row !important; overflow-x:auto !important;scroll-snap-type:x mandatory; gap:0 !important;scrollbar-width:none; } .product__media-list::-webkit-scrollbar{display:none;} .product__media-item, .product-gallery__item{ flex:0 0 100% !important;scroll-snap-align:start; aspect-ratio:1/1; } .product__media-item img, .product-gallery__item img{width:100%;height:100%;object-fit:cover;} /* Info block */ .product__info-wrapper, .product__info-container, .fc-pdp-info{ padding:4px 18px 100px !important; } .product__title, .product__info-wrapper h1, .fc-pdp-title{ font-size:clamp(22px,5.8vw,28px) !important; line-height:1.18 !important;margin:6px 0 6px !important; letter-spacing:-0.01em; } .product__price, .price, .fc-pdp-price{ font-size:20px !important;font-weight:700 !important; color:var(--cm-navy) !important;margin-bottom:10px !important; } .product__description, .fc-pdp-description{ font-size:14.5px;line-height:1.55;color:var(--cm-ink); margin:12px 0 16px; } /* Variant pills */ .product-form__input, .variant-radios, .fc-pdp-variants{ margin:14px 0 !important; } .product-form__input legend, .variant-radios__label, .fc-pdp-variants-label{ font-size:12px;letter-spacing:0.1em;text-transform:uppercase; color:var(--cm-navy);font-weight:600;margin-bottom:8px; } .product-form__input input[type="radio"] + label, .variant-radios__pill, .fc-pdp-variants-pill{ padding:10px 16px !important;min-height:40px; border-radius:999px !important;border:1.5px solid var(--cm-line-2) !important; font-size:13.5px !important;font-weight:500 !important; margin:0 6px 8px 0 !important; } .product-form__input input[type="radio"]:checked + label, .variant-radios__pill--active{ background:var(--cm-navy) !important;color:#fff !important; border-color:var(--cm-navy) !important; } /* Quantity selector */ .quantity, .fc-pdp-qty{ display:flex;align-items:center; border:1.5px solid var(--cm-line-2);border-radius:999px; overflow:hidden;width:fit-content;margin:10px 0; } .quantity__input, .fc-pdp-qty-input{ border:none !important;width:44px;text-align:center; font-size:15px;font-weight:600;padding:10px 0 !important; background:transparent; } .quantity__button, .fc-pdp-qty-btn{ width:40px;height:40px;background:transparent;border:none; font-size:18px;color:var(--cm-navy); } } /* ============================================================== 16. STICKY BOTTOM ATC — safe-area aware ============================================================== */ @media (max-width:860px){ .fc-sticky-atc{ position:fixed;left:0;right:0;bottom:0;z-index:80; padding:10px 14px calc(10px + var(--cm-sa-bottom)); background:rgba(250,247,241,0.96); -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px); border-top:1px solid var(--cm-line); box-shadow:0 -10px 30px rgba(15,22,40,0.08); display:flex;align-items:center;gap:10px; } .fc-sticky-atc-info{ flex:0 0 auto;min-width:0;display:flex;flex-direction:column; } .fc-sticky-atc-name{ font-size:12px;color:var(--cm-muted); overflow:hidden;text-overflow:ellipsis;white-space:nowrap; max-width:120px; } .fc-sticky-atc-price{ font-size:15px;font-weight:700;color:var(--cm-navy);line-height:1.1; } .fc-sticky-atc-btn, .fc-sticky-atc button[type="submit"]{ flex:1;min-height:48px;padding:14px 20px; background:var(--cm-gold);color:var(--cm-navy);border:none; border-radius:999px;font-size:14px;font-weight:700; letter-spacing:0.04em;text-transform:uppercase; box-shadow:0 6px 16px rgba(201,162,58,0.3); } /* add body padding so sticky doesn't cover content */ body.template-product, body[class*="template-product"]{padding-bottom:90px;} } /* ============================================================== 17. CART — clean mobile ============================================================== */ @media (max-width:860px){ .cart-items{padding:0 !important;border:none !important;} .cart-item{ display:grid !important;grid-template-columns:80px 1fr auto !important; gap:12px;padding:14px 16px !important; border-bottom:1px solid var(--cm-line); } .cart-item__media{aspect-ratio:1;border-radius:10px;overflow:hidden;} .cart-item__media img{width:100%;height:100%;object-fit:cover;} .cart-item__details{min-width:0;} .cart-item__name{ font-size:14.5px;font-weight:600;margin:0 0 4px; display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden; } .cart-item__price{font-size:13px;color:var(--cm-navy);font-weight:600;} .cart-item__quantity{margin-top:8px;} /* Totals block */ .totals, .cart__totals{ padding:16px;background:var(--cm-cream-2); border-radius:var(--cm-radius);margin:16px; } .totals__subtotal{ display:flex;justify-content:space-between; font-size:16px;font-weight:600;color:var(--cm-navy); } .cart__checkout-button, button[name="checkout"]{ width:100% !important;min-height:52px !important; background:var(--cm-gold) !important;color:var(--cm-navy) !important; border-radius:999px !important; font-size:15px !important;font-weight:700 !important; letter-spacing:0.05em !important;text-transform:uppercase; box-shadow:0 10px 24px rgba(201,162,58,0.3); } } /* ============================================================== 18. PRODOTTI CATEGORIZED PAGE ============================================================== */ @media (max-width:860px){ .fc-prodcat{padding:24px 0 !important;} .fc-prodcat-head{padding:0 16px 20px;text-align:center;} .fc-prodcat-title{font-size:26px;margin:4px 0 6px;} .fc-prodcat-sub{font-size:13.5px;color:var(--cm-muted);margin:0;} .fc-prodcat-block{padding:0 0 20px;margin-bottom:16px;} .fc-prodcat-block-head{padding:0 16px 12px;} .fc-prodcat-block-kicker{ font-size:10.5px;letter-spacing:0.14em;color:var(--cm-gold); font-weight:700;text-transform:uppercase;margin:0 0 4px; } .fc-prodcat-block-title{ font-size:20px;line-height:1.2;margin:0 0 4px; letter-spacing:-0.01em; } .fc-prodcat-block-sub{ font-size:13px;color:var(--cm-muted);margin:0; } .fc-prodcat-grid{ display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:0 12px; } .fc-prodcat-viewall{ display:inline-flex;align-items:center;gap:6px; margin:16px 16px 0;font-size:13px;font-weight:600; color:var(--cm-navy);text-decoration:none; border-bottom:1.5px solid var(--cm-gold);padding-bottom:2px; } } /* ============================================================== 19. STORIA — Italian heritage section ============================================================== */ @media (max-width:860px){ .fc-storia{padding:36px 16px !important;} .fc-storia-kicker{ font-size:10.5px;letter-spacing:0.18em;color:var(--cm-gold); text-transform:uppercase;font-weight:700;margin-bottom:8px; } .fc-storia-title{ font-size:clamp(24px,6vw,30px) !important; line-height:1.15;margin:0 0 16px;letter-spacing:-0.01em; } .fc-storia-body p{ font-size:15px;line-height:1.65;color:var(--cm-ink);margin:0 0 12px; } .fc-storia-img{ aspect-ratio:4/3;margin:18px -16px 0; border-radius:0;overflow:hidden; } .fc-storia-img img{width:100%;height:100%;object-fit:cover;} } /* ============================================================== 20. REVIEWS / TESTIMONIALS ============================================================== */ @media (max-width:860px){ .fc-reviews, .fc-testimonials{ padding:32px 0 !important; } .fc-reviews-head, .fc-testimonials-head{padding:0 16px 16px;text-align:center;} .fc-reviews-track, .fc-testimonials-track{ display:flex;gap:12px;overflow-x:auto; padding:0 16px 6px;scroll-snap-type:x mandatory; scrollbar-width:none; } .fc-reviews-track::-webkit-scrollbar{display:none;} .fc-reviews-card, .fc-testimonials-card{ flex:0 0 82%;scroll-snap-align:center; background:#fff;padding:18px 16px; border-radius:var(--cm-radius);box-shadow:var(--cm-shadow-sm); } .fc-reviews-stars{ color:var(--cm-gold);font-size:14px;margin-bottom:8px; letter-spacing:2px; } .fc-reviews-text{ font-size:14px;line-height:1.55;color:var(--cm-ink);margin:0 0 10px; } .fc-reviews-author{ font-size:12px;color:var(--cm-muted);font-weight:600; } } /* ============================================================== 21. FAQ — Accordion style ============================================================== */ @media (max-width:860px){ .fc-faq{padding:30px 16px !important;} .fc-faq-title{ font-size:24px;margin:0 0 16px;text-align:center; letter-spacing:-0.01em; } .fc-faq-item, .faq-item, details.fc-faq-item{ background:#fff;border-radius:var(--cm-radius); margin-bottom:10px;box-shadow:var(--cm-shadow-xs); border:1px solid var(--cm-line); } .fc-faq-q, details.fc-faq-item summary{ padding:14px 16px;font-size:14.5px;font-weight:600; color:var(--cm-navy);cursor:pointer; display:flex;align-items:center;justify-content:space-between; gap:12px;list-style:none; } details.fc-faq-item summary::-webkit-details-marker{display:none;} details.fc-faq-item summary::after{ content:"+";font-size:22px;font-weight:300; color:var(--cm-gold);transition:transform 0.2s var(--cm-ease); flex-shrink:0; } details.fc-faq-item[open] summary::after{content:"−";} .fc-faq-a, details.fc-faq-item[open] > div, details.fc-faq-item > p{ padding:0 16px 16px;font-size:14px;line-height:1.6; color:var(--cm-muted);margin:0; } } /* ============================================================== 22. NEWSLETTER ============================================================== */ @media (max-width:860px){ .fc-newsletter{ padding:36px 20px !important;text-align:center; background:var(--cm-navy);color:#fff; border-radius:var(--cm-radius-lg);margin:24px 12px; position:relative;overflow:hidden; } .fc-newsletter::before{ content:"";position:absolute;inset:auto -30% -30% auto; width:220px;height:220px;border-radius:50%; background:radial-gradient(circle,rgba(201,162,58,0.18),transparent 70%); pointer-events:none; } .fc-newsletter-title{ font-size:22px;line-height:1.2;margin:0 0 8px; letter-spacing:-0.01em;color:#fff; } .fc-newsletter-sub{ font-size:14px;color:rgba(255,255,255,0.78);margin:0 0 18px; } .fc-newsletter-form{ display:flex;flex-direction:column;gap:10px; } .fc-newsletter-input{ width:100%;padding:14px 16px;border-radius:999px; border:1px solid rgba(255,255,255,0.2); background:rgba(255,255,255,0.08);color:#fff; font-size:15px; } .fc-newsletter-input::placeholder{color:rgba(255,255,255,0.55);} .fc-newsletter-btn{ width:100%;padding:14px 20px;border-radius:999px; background:var(--cm-gold);color:var(--cm-navy);border:none; font-size:14px;font-weight:700;letter-spacing:0.04em; text-transform:uppercase; } } /* ============================================================== 23. FOOTER — collapsible accordion columns ============================================================== */ @media (max-width:860px){ .fc-footer, footer.site-footer{ padding:32px 16px 24px !important; background:var(--cm-navy);color:rgba(255,255,255,0.85); } .fc-footer-cols{ display:flex;flex-direction:column;gap:0; } .fc-footer-col{ border-bottom:1px solid rgba(255,255,255,0.12); } .fc-footer-col-title, .fc-footer-col h4{ padding:16px 0;font-size:13px;letter-spacing:0.12em; text-transform:uppercase;color:#fff;font-weight:600; display:flex;align-items:center;justify-content:space-between; cursor:pointer; } .fc-footer-col ul{ padding:0 0 16px;margin:0;list-style:none; display:flex;flex-direction:column;gap:10px; } .fc-footer-col ul a{ color:rgba(255,255,255,0.7);font-size:14px;text-decoration:none; } .fc-footer-bottom{ padding:18px 0 0;margin-top:6px;text-align:center; font-size:11px;color:rgba(255,255,255,0.5); letter-spacing:0.06em; } } /* ============================================================== 24. QUIZ polish on mobile ============================================================== */ @media (max-width:860px){ .fc-quiz, .quiz-page{ padding:20px 16px !important; } .fc-quiz-title{ font-size:24px;line-height:1.2;margin:0 0 6px; letter-spacing:-0.01em; } .fc-quiz-sub{ font-size:14px;color:var(--cm-muted);margin:0 0 20px; } .fc-quiz-progress{ height:4px;border-radius:2px;background:var(--cm-line); margin:0 0 18px;overflow:hidden; } .fc-quiz-progress-bar{ height:100%;background:var(--cm-gold); transition:width 0.4s var(--cm-ease-out); } .fc-quiz-question{ font-size:18px;font-weight:600;line-height:1.3;margin:8px 0 14px; } .fc-quiz-options{ display:grid;grid-template-columns:1fr 1fr;gap:10px; } .fc-quiz-option{ background:#fff;border-radius:var(--cm-radius); border:1.5px solid var(--cm-line);padding:14px 12px; text-align:center;font-size:13.5px;font-weight:500; color:var(--cm-navy);display:flex;flex-direction:column; align-items:center;gap:8px;cursor:pointer; transition:all 0.2s var(--cm-ease); } .fc-quiz-option.is-selected{ background:var(--cm-gold-pale); border-color:var(--cm-gold); color:var(--cm-navy); } .fc-quiz-actions{ display:flex;gap:10px;margin-top:20px; } .fc-quiz-actions button{flex:1;} .fc-quiz-result-grid{ display:grid;grid-template-columns:1fr 1fr;gap:10px; } } /* ============================================================== 25. POPUP / BOTTOM SHEET modals ============================================================== */ @media (max-width:860px){ .fc-popup, .popup-modal, .modal{ padding:0 !important; } .fc-popup-inner, .popup-modal__content{ position:fixed !important;left:0;right:0;bottom:0; top:auto !important;transform:none !important; max-width:100% !important;width:100% !important; border-radius:24px 24px 0 0 !important; padding:20px 20px calc(20px + var(--cm-sa-bottom)) !important; max-height:88vh;overflow-y:auto; animation:fcSheetSlide 0.35s var(--cm-ease-out); box-shadow:0 -20px 60px rgba(0,0,0,0.24); } .fc-popup-inner::before, .popup-modal__content::before{ content:"";display:block; width:44px;height:4px;margin:-4px auto 14px; background:var(--cm-line-2);border-radius:2px; } @keyframes fcSheetSlide{ from{transform:translateY(100%);opacity:0.5;} to{transform:translateY(0);opacity:1;} } } /* ============================================================== 26. SCROLL REVEAL animations ============================================================== */ @media (max-width:860px) and (prefers-reduced-motion:no-preference){ [data-fc-reveal], .fc-reveal, .fc-pcard, .fc-collections-card, .fc-usp-card, .fc-reviews-card, .fc-pcarousel-item{ opacity:0;transform:translateY(14px); transition:opacity 0.7s var(--cm-ease-out),transform 0.7s var(--cm-ease-out); } [data-fc-reveal].is-in-view, .fc-reveal.is-in-view, .fc-pcard.is-in-view, .fc-collections-card.is-in-view, .fc-usp-card.is-in-view, .fc-reviews-card.is-in-view, .fc-pcarousel-item.is-in-view{ opacity:1;transform:translateY(0); } } /* ============================================================== 27. EMPTY STATES / LOADING ============================================================== */ @media (max-width:860px){ .fc-skeleton{ background:linear-gradient(90deg,#eee 0%,#f5f5f5 50%,#eee 100%); background-size:200% 100%; animation:fcShimmer 1.4s ease-in-out infinite; border-radius:var(--cm-radius-sm); } @keyframes fcShimmer{ 0%{background-position:200% 0;} 100%{background-position:-200% 0;} } } /* ============================================================== 28. DESKTOP REFINEMENTS — consistency on laptops ============================================================== */ @media (min-width:861px){ .fc-header-v2-inner, .fc-header-inner{ max-width:1400px;margin:0 auto;padding:14px 40px; display:flex;align-items:center;gap:32px; } .fc-header-v2-logo{font-size:18px;letter-spacing:0.26em;} .fc-hamburger, .fc-header-v2-hamburger{display:none !important;} .fc-pgrid, .product-grid{ display:grid;grid-template-columns:repeat(4,1fr); gap:20px 20px; } .fc-pcard-img{aspect-ratio:1/1;} .fc-pcard-img img{ transition:transform 0.6s var(--cm-ease-out); } .fc-pcard:hover .fc-pcard-img img{transform:scale(1.04);} .fc-pcard-body{padding:14px 12px 18px;} .fc-pcard-name{font-size:14.5px;} .fc-pcard-price{font-size:15px;} .fc-cta-esp{ padding:80px 60px !important;margin:60px auto;max-width:1200px; border-radius:24px; } .fc-cta-esp-title{font-size:42px !important;} .fc-cta-esp-sub{font-size:17px;max-width:640px;margin:0 auto 28px;} .fc-vs-table{min-width:0;max-width:1100px;margin:0 auto;} .fc-vs-row{grid-template-columns:220px repeat(4,1fr);} .fc-vs-row > *{padding:18px 14px;font-size:14px;} .fc-collections-grid{grid-template-columns:repeat(2,1fr);gap:20px;max-width:1100px;margin:0 auto;} .fc-prodcat-grid{grid-template-columns:repeat(4,1fr);gap:20px;} .fc-upsell{ grid-template-columns:200px 1fr auto !important; max-width:1000px;margin:24px auto; padding:20px !important; } .fc-upsell-img{max-width:200px;} .fc-newsletter{max-width:800px;margin:48px auto;padding:56px 40px !important;} .fc-newsletter-form{flex-direction:row;max-width:540px;margin:0 auto;} .fc-newsletter-input{flex:1;} .fc-newsletter-btn{flex:0 0 auto;min-width:160px;} .fc-sticky-atc{display:none !important;} } /* ============================================================== 29. SAFETY — kill any accidental horizontal overflow ============================================================== */ html,body{overflow-x:hidden;} .fc-section,section{overflow-x:clip;} /* ============================================================== END v5 — Buon appetito ============================================================== */ /* ===== fc-mobile-bem-aliases-v1.css ===== */ /* ========================================================================= FC MOBILE BEM ALIASES v1 — deployed 2026-04-21 Targets the REAL BEM class names used in the theme so the v5 polish actually reaches every section. Mobile-first, desktop refinements at end. ========================================================================= */ /* ============== 1. FOOTER (.fc-ft) — accordion-style mobile ============ */ @media (max-width:860px){ .fc-ft{padding:32px 16px 18px !important;background:var(--cm-navy,#0F1628);color:rgba(255,255,255,0.85);} .fc-ft__inner{max-width:100%;padding:0;} .fc-ft__grid{display:flex;flex-direction:column;gap:0;} .fc-ft__col-title{ padding:16px 0 !important;font-size:13px;letter-spacing:0.12em; text-transform:uppercase;color:#fff;font-weight:600; border-top:1px solid rgba(255,255,255,0.12); display:flex;align-items:center;justify-content:space-between; } .fc-ft__links{padding:0 0 14px;margin:0;display:flex;flex-direction:column;gap:10px;} .fc-ft__links a{color:rgba(255,255,255,0.72);font-size:14px;text-decoration:none;} .fc-ft__brand-name{font-size:20px;color:#fff;letter-spacing:-0.01em;margin:0 0 8px;} .fc-ft__brand-text{font-size:13.5px;line-height:1.6;color:rgba(255,255,255,0.7);margin:0 0 14px;} .fc-ft__pay{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 4px;} .fc-ft__pay-item{background:#fff;border-radius:4px;padding:4px 6px;height:22px;display:inline-flex;align-items:center;} .fc-ft__bottom{ padding:18px 0 0;margin-top:8px;border-top:1px solid rgba(255,255,255,0.12); font-size:11px;color:rgba(255,255,255,0.48);text-align:center;letter-spacing:0.06em; } .fc-ft__copy{margin:0;} } /* ============== 2. NEWSLETTER (.fc-nl) ============== */ @media (max-width:860px){ .fc-nl{ padding:36px 20px !important;text-align:center;margin:24px 12px; background:var(--cm-navy,#0F1628);color:#fff; border-radius:var(--cm-radius-lg,20px);position:relative;overflow:hidden; } .fc-nl::before{ content:"";position:absolute;inset:auto -30% -30% auto; width:220px;height:220px;border-radius:50%; background:radial-gradient(circle,rgba(201,162,58,0.18),transparent 70%); pointer-events:none; } .fc-nl__inner{position:relative;z-index:1;} .fc-nl__tag{ font-size:10.5px;letter-spacing:0.18em;color:var(--cm-gold,#C9A23A); text-transform:uppercase;font-weight:700;margin-bottom:8px; } .fc-nl__title{font-size:22px;line-height:1.2;margin:0 0 8px;letter-spacing:-0.01em;color:#fff;} .fc-nl__text{font-size:14px;color:rgba(255,255,255,0.78);margin:0 0 18px;} .fc-nl__form{display:flex;flex-direction:column;gap:10px;} .fc-nl__input{ width:100%;padding:14px 16px;border-radius:999px; border:1px solid rgba(255,255,255,0.2);background:rgba(255,255,255,0.08); color:#fff;font-size:15px; } .fc-nl__input::placeholder{color:rgba(255,255,255,0.55);} .fc-nl__btn{ width:100%;padding:14px 20px;border-radius:999px; background:var(--cm-gold,#C9A23A);color:var(--cm-navy,#0F1628);border:none; font-size:14px;font-weight:700;letter-spacing:0.04em;text-transform:uppercase; } .fc-nl__note{font-size:11.5px;color:rgba(255,255,255,0.5);margin-top:10px;} } /* ============== 3. FAQ (.fc-faq__*) — accordion ============== */ @media (max-width:860px){ .fc-faq{padding:30px 16px !important;} .fc-faq__head{text-align:center;margin-bottom:18px;} .fc-faq__tag{ font-size:10.5px;letter-spacing:0.16em;color:var(--cm-gold,#C9A23A); font-weight:700;text-transform:uppercase;margin-bottom:6px; } .fc-faq__title{font-size:24px;margin:0;letter-spacing:-0.01em;color:var(--cm-navy,#0F1628);} .fc-faq__items{display:flex;flex-direction:column;gap:10px;} .fc-faq__item{ background:#fff;border-radius:var(--cm-radius,14px); border:1px solid var(--cm-line,rgba(15,22,40,0.08)); box-shadow:var(--cm-shadow-xs,0 1px 3px rgba(15,22,40,0.04));overflow:hidden; } .fc-faq__q,.fc-faq__item summary{ padding:14px 16px;font-size:14.5px;font-weight:600; color:var(--cm-navy,#0F1628);cursor:pointer; display:flex;align-items:center;justify-content:space-between;gap:12px;list-style:none; } .fc-faq__item summary::-webkit-details-marker{display:none;} .fc-faq__item summary::after{ content:"+";font-size:22px;font-weight:300;color:var(--cm-gold,#C9A23A); transition:transform 0.2s ease;flex-shrink:0; } .fc-faq__item[open] summary::after{content:"−";} .fc-faq__a{padding:0 16px 16px;font-size:14px;line-height:1.6;color:var(--cm-muted,#5A6478);margin:0;} } /* ============== 4. REVIEWS (.fc-rev__*) — scroll-snap cards ============== */ @media (max-width:860px){ .fc-rev{padding:32px 0 !important;} .fc-rev__head{padding:0 16px 16px;text-align:center;} .fc-rev__tag{ font-size:10.5px;letter-spacing:0.16em;color:var(--cm-gold,#C9A23A); font-weight:700;text-transform:uppercase;margin-bottom:6px; } .fc-rev__title{font-size:24px;margin:0 0 10px;letter-spacing:-0.01em;} .fc-rev__stars-top{color:var(--cm-gold,#C9A23A);letter-spacing:2px;font-size:14px;} .fc-rev__grid,.fc-rev__inner{ display:flex !important;grid-template-columns:none !important;gap:12px; overflow-x:auto;padding:0 16px 6px;scroll-snap-type:x mandatory; scrollbar-width:none; } .fc-rev__grid::-webkit-scrollbar,.fc-rev__inner::-webkit-scrollbar{display:none;} .fc-rev__card{ flex:0 0 82% !important;scroll-snap-align:center; background:#fff;padding:18px 16px; border-radius:var(--cm-radius,14px);box-shadow:var(--cm-shadow-sm,0 2px 8px rgba(15,22,40,0.06)); } .fc-rev__card-stars{color:var(--cm-gold,#C9A23A);font-size:14px;margin-bottom:8px;letter-spacing:2px;} .fc-rev__card-text{font-size:14px;line-height:1.55;color:var(--cm-ink,#1A2238);margin:0 0 10px;} .fc-rev__card-author,.fc-rev__card-name{ font-size:12.5px;color:var(--cm-muted,#5A6478);font-weight:600;margin:0; } .fc-rev__card-loc,.fc-rev__card-verified{font-size:11px;color:var(--cm-muted,#5A6478);margin-top:2px;} .fc-rev__card-avatar{width:36px;height:36px;border-radius:50%;object-fit:cover;margin-bottom:8px;} } /* ============== 5. QUIZ (.fc-match__*) — mobile perfection ============== */ @media (max-width:860px){ .fc-match{padding:20px 16px !important;} .fc-match__header,.fc-match__progress{margin-bottom:16px;} .fc-match__eyebrow{ font-size:10.5px;letter-spacing:0.16em;color:var(--cm-gold,#C9A23A); font-weight:700;text-transform:uppercase;margin-bottom:6px; } .fc-match__title,.fc-match__result-title{font-size:24px;line-height:1.2;margin:0 0 6px;letter-spacing:-0.01em;} .fc-match__qsub,.fc-match__result-sub{font-size:14px;color:var(--cm-muted,#5A6478);margin:0 0 18px;} .fc-match__step,.fc-match__step-num{font-size:12px;color:var(--cm-muted,#5A6478);letter-spacing:0.08em;} .fc-match__q{font-size:18px;font-weight:600;line-height:1.3;margin:8px 0 14px;} .fc-match__options{display:grid !important;grid-template-columns:1fr 1fr !important;gap:10px !important;} .fc-match__opt{ background:#fff;border:1.5px solid var(--cm-line,rgba(15,22,40,0.08)); border-radius:var(--cm-radius,14px);padding:14px 12px; text-align:center;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:8px; transition:all 0.2s ease; } .fc-match__opt.is-selected,.fc-match__opt[aria-selected="true"]{ background:var(--cm-gold-pale,#FAF3DA);border-color:var(--cm-gold,#C9A23A); } .fc-match__opt-icon{font-size:22px;line-height:1;} .fc-match__opt-label{font-size:13.5px;font-weight:600;color:var(--cm-navy,#0F1628);line-height:1.2;} .fc-match__opt-desc,.fc-match__opt-text{font-size:11.5px;color:var(--cm-muted,#5A6478);line-height:1.35;} .fc-match__nav,.fc-match__cta-group{display:flex;gap:10px;margin-top:18px;} .fc-match__nav > button,.fc-match__cta,.fc-match__back,.fc-match__next{flex:1;min-height:46px;} .fc-match__cta{ background:var(--cm-gold,#C9A23A);color:var(--cm-navy,#0F1628);border:none; border-radius:999px;font-size:14px;font-weight:700;letter-spacing:0.04em;text-transform:uppercase; } .fc-match__cta--ghost,.fc-match__back{ background:transparent;border:1.5px solid var(--cm-line-2,rgba(15,22,40,0.16)); color:var(--cm-navy,#0F1628);border-radius:999px;font-size:13px;font-weight:600; } /* Result / product card */ .fc-match__product,.fc-match__result{ display:grid;grid-template-columns:100px 1fr;gap:12px; background:#fff;padding:14px;border-radius:var(--cm-radius,14px); box-shadow:var(--cm-shadow-sm,0 2px 8px rgba(15,22,40,0.06));margin-bottom:12px; } .fc-match__product-img{width:100%;aspect-ratio:1;border-radius:10px;overflow:hidden;} .fc-match__product-img img{width:100%;height:100%;object-fit:cover;} .fc-match__product-info{min-width:0;display:flex;flex-direction:column;gap:4px;} .fc-match__product-tag{font-size:10px;letter-spacing:0.12em;color:var(--cm-gold,#C9A23A);text-transform:uppercase;font-weight:700;} .fc-match__product-name{font-size:14.5px;font-weight:600;margin:0;line-height:1.25;} .fc-match__product-desc{font-size:12.5px;color:var(--cm-muted,#5A6478);line-height:1.45;margin:0;} .fc-match__product-price{display:flex;align-items:baseline;gap:8px;margin-top:2px;} .fc-match__product-price-old{font-size:12px;color:var(--cm-muted,#5A6478);text-decoration:line-through;} .fc-match__product-price-now{font-size:15px;font-weight:700;color:var(--cm-navy,#0F1628);} /* Discount code card */ .fc-match__code-box{ background:var(--cm-gold-pale,#FAF3DA);border:1.5px dashed var(--cm-gold,#C9A23A); border-radius:var(--cm-radius,14px);padding:16px;text-align:center;margin:14px 0; } .fc-match__code-label{font-size:11px;letter-spacing:0.14em;color:var(--cm-muted,#5A6478);text-transform:uppercase;} .fc-match__code-value{font-size:22px;font-weight:700;letter-spacing:0.12em;color:var(--cm-navy,#0F1628);margin:6px 0 4px;} .fc-match__code-sub{font-size:12px;color:var(--cm-muted,#5A6478);} .fc-match__code-copy{ margin-top:10px;background:var(--cm-gold,#C9A23A);color:var(--cm-navy,#0F1628);border:none; border-radius:999px;padding:10px 20px;font-size:13px;font-weight:700;letter-spacing:0.04em;text-transform:uppercase; } .fc-match__dot{width:6px;height:6px;border-radius:50%;background:var(--cm-line-2,rgba(15,22,40,0.16));transition:background 0.2s ease;} .fc-match__dot.is-active{background:var(--cm-gold,#C9A23A);} } /* ============== 6. STORIA (.fc-storia__*) ============== */ @media (max-width:860px){ .fc-storia,.fc-storia-section{padding:36px 16px !important;background:var(--cm-cream-2,#F4EFE6);} .fc-storia__container{max-width:100%;padding:0;} .fc-storia__eyebrow{display:flex;align-items:center;gap:10px;margin-bottom:10px;} .fc-storia__eyebrow-line{flex:0 0 20px;height:1px;background:var(--cm-gold,#C9A23A);} .fc-storia__eyebrow-text{ font-size:10.5px;letter-spacing:0.18em;color:var(--cm-gold,#C9A23A); text-transform:uppercase;font-weight:700; } .fc-storia__title{ font-size:clamp(24px,6vw,30px) !important;line-height:1.15; margin:0 0 16px;letter-spacing:-0.01em;color:var(--cm-navy,#0F1628); } .fc-storia__lede{font-size:15px;line-height:1.65;color:var(--cm-ink,#1A2238);margin:0 0 14px;font-weight:500;} .fc-storia__body{font-size:14.5px;line-height:1.7;color:var(--cm-ink,#1A2238);} .fc-storia__p{margin:0 0 12px;} .fc-storia__quote-wrap{ margin:18px 0;padding:18px 20px;background:#fff;border-left:3px solid var(--cm-gold,#C9A23A); border-radius:0 var(--cm-radius,14px) var(--cm-radius,14px) 0;position:relative; } .fc-storia__quote-mark{ position:absolute;top:-8px;left:14px;font-size:44px;color:var(--cm-gold,#C9A23A); line-height:1;font-family:Georgia,serif; } .fc-storia__quote{font-size:15px;line-height:1.55;font-style:italic;color:var(--cm-navy,#0F1628);margin:0;} .fc-storia__signature{display:flex;align-items:center;gap:10px;margin-top:16px;} .fc-storia__sig-line{flex:0 0 32px;height:1px;background:var(--cm-gold,#C9A23A);} .fc-storia__sig-text{font-size:13px;font-style:italic;color:var(--cm-muted,#5A6478);} .fc-storia__heart{color:var(--cm-gold,#C9A23A);} } /* ============== 7. HERO4 (.fc-hero4__*) ============== */ @media (max-width:860px){ .fc-hero4{min-height:clamp(420px,82vw,540px) !important;padding:0 !important;} .fc-hero4__bg img{object-position:center;} .fc-hero4__overlay{ background:linear-gradient(180deg,rgba(15,22,40,0.2) 0%,rgba(15,22,40,0.6) 60%,rgba(15,22,40,0.85) 100%) !important; } .fc-hero4__content{padding:0 20px 32px !important;text-align:center;} .fc-hero4__tag{ font-size:10.5px;letter-spacing:0.18em;color:var(--cm-gold,#C9A23A); text-transform:uppercase;font-weight:700;margin-bottom:10px; background:rgba(15,22,40,0.45);padding:6px 12px;border-radius:999px; display:inline-block;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px); } .fc-hero4__headline{ font-size:clamp(28px,8vw,36px) !important;line-height:1.08; margin:10px 0 14px;letter-spacing:-0.02em;color:#fff; } .fc-hero4__cta{ display:inline-flex;align-items:center;justify-content:center;gap:8px; padding:14px 28px;background:var(--cm-gold,#C9A23A);color:var(--cm-navy,#0F1628); border-radius:999px;font-size:14px;font-weight:700;letter-spacing:0.04em; text-transform:uppercase;text-decoration:none; box-shadow:0 8px 24px rgba(201,162,58,0.35); } .fc-hero4-timer{margin-top:16px;} .fc-hero4-timer__inner{display:flex;justify-content:center;gap:6px;} .fc-hero4-timer__block{ background:rgba(255,255,255,0.12);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px); border:1px solid rgba(255,255,255,0.18);border-radius:10px;padding:8px 10px;min-width:52px; } .fc-hero4-timer__number{font-size:18px;font-weight:700;color:#fff;line-height:1;} .fc-hero4-timer__label,.fc-hero4-timer__unit{font-size:9.5px;color:rgba(255,255,255,0.7);letter-spacing:0.1em;text-transform:uppercase;margin-top:2px;} .fc-hero4-timer__sep{color:rgba(255,255,255,0.4);align-self:center;font-size:18px;} } /* ============== 8. COLLECTIONS (.fc-coll__*) — Oro/Argento ============== */ @media (max-width:860px){ .fc-coll,.fc-collections-section{padding:28px 0 !important;background:var(--cm-cream-2,#F4EFE6);} .fc-coll__heading{padding:0 16px 18px;text-align:center;} .fc-coll__title{font-size:26px;margin:0 0 6px;letter-spacing:-0.01em;} .fc-coll__subtitle{font-size:13.5px;color:var(--cm-muted,#5A6478);margin:0;} .fc-coll__divider{height:1px;background:var(--cm-line,rgba(15,22,40,0.08));margin:6px 0;} .fc-coll__grid{ display:grid !important;grid-template-columns:1fr !important;gap:16px;padding:0 12px; } .fc-coll__card{ position:relative;aspect-ratio:3/4;overflow:hidden;border-radius:var(--cm-radius-lg,20px); display:flex;flex-direction:column;justify-content:flex-end;padding:0; box-shadow:var(--cm-shadow,0 10px 30px rgba(15,22,40,0.12)); } .fc-coll__card-overlay{ position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,22,40,0) 30%,rgba(15,22,40,0.78) 100%); z-index:1;pointer-events:none; } .fc-coll__card-content{position:relative;z-index:2;padding:20px 18px;color:#fff;} .fc-coll__card-icon{font-size:28px;margin-bottom:8px;opacity:0.85;} .fc-coll__card-label{ font-size:10.5px;letter-spacing:0.18em;text-transform:uppercase; color:var(--cm-gold-soft,#E8D69A);font-weight:700;margin-bottom:6px; } .fc-coll__card-name{font-size:22px;margin:0 0 6px;line-height:1.15;letter-spacing:-0.01em;color:#fff;} .fc-coll__card-desc{font-size:13px;color:rgba(255,255,255,0.82);margin:0 0 14px;line-height:1.5;} .fc-coll__card-btn{ display:inline-flex;align-items:center;gap:6px;padding:11px 22px; background:var(--cm-gold,#C9A23A);color:var(--cm-navy,#0F1628); border-radius:999px;font-size:12.5px;font-weight:700;letter-spacing:0.05em; text-transform:uppercase;text-decoration:none;align-self:flex-start; } .fc-coll__card--oro .fc-coll__card-btn{background:var(--cm-gold,#C9A23A);} .fc-coll__card--argento .fc-coll__card-btn{background:#D6D9DD;color:var(--cm-navy,#0F1628);} } /* ============== 9. PCARD — media alias (already fc-pcard-*) ============== */ @media (max-width:860px){ .fc-pcard-media{ aspect-ratio:1/1;overflow:hidden;border-radius:10px 10px 0 0;background:var(--cm-cream-2,#F4EFE6); } .fc-pcard-media img{width:100%;height:100%;object-fit:cover;transition:transform 0.5s ease;} .fc-pcard:active .fc-pcard-media img{transform:scale(1.02);} .fc-pcard-badge{ position:absolute;top:10px;left:10px;z-index:2; background:var(--cm-navy,#0F1628);color:#fff;padding:4px 8px;border-radius:4px; font-size:9.5px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase; } .fc-pcard-usp{font-size:11px;color:var(--cm-muted,#5A6478);margin:2px 0 6px;line-height:1.3;} .fc-pcard-price-old{font-size:11.5px;color:var(--cm-muted,#5A6478);text-decoration:line-through;margin-right:6px;} .fc-pcard-price-now{font-size:14.5px;font-weight:700;color:var(--cm-navy,#0F1628);} .fc-pcard-cta{ margin-top:8px;width:100%;min-height:36px;background:var(--cm-navy,#0F1628); color:#fff;border:none;border-radius:999px;font-size:12px;font-weight:600; letter-spacing:0.05em;text-transform:uppercase; } } /* ============== 10. SHOP (.fc-shop__*) — PDP / grid ============== */ @media (max-width:860px){ .fc-shop{padding:16px 0 !important;} .fc-shop__head{padding:0 16px 14px;text-align:center;} .fc-shop__tag{font-size:10.5px;letter-spacing:0.16em;color:var(--cm-gold,#C9A23A);font-weight:700;text-transform:uppercase;} .fc-shop__title{font-size:24px;margin:4px 0 8px;letter-spacing:-0.01em;} .fc-shop__grid{ display:grid !important;grid-template-columns:1fr 1fr !important;gap:8px !important;padding:0 8px; } .fc-shop__card{ background:#fff;border-radius:12px;overflow:hidden; box-shadow:0 1px 3px rgba(15,22,40,0.05);position:relative; } .fc-shop__img,.fc-shop__img-link{display:block;aspect-ratio:1/1;overflow:hidden;background:var(--cm-cream-2,#F4EFE6);} .fc-shop__img img,.fc-shop__img-link img{width:100%;height:100%;object-fit:cover;} .fc-shop__badge{ position:absolute;top:8px;left:8px;z-index:2;background:var(--cm-navy,#0F1628);color:#fff; padding:3px 7px;border-radius:4px;font-size:9.5px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase; } .fc-shop__info{padding:10px 10px 14px;} .fc-shop__name{font-size:13.5px;font-weight:600;line-height:1.3;margin:0 0 4px;color:var(--cm-navy,#0F1628);} .fc-shop__desc{font-size:11.5px;color:var(--cm-muted,#5A6478);margin:0 0 6px;line-height:1.4; display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;} .fc-shop__price{display:flex;align-items:baseline;gap:6px;} .fc-shop__amount{font-size:14px;font-weight:700;color:var(--cm-navy,#0F1628);} .fc-shop__compare{font-size:11px;color:var(--cm-muted,#5A6478);text-decoration:line-through;} .fc-shop__atc{ margin-top:8px;width:100%;min-height:34px;background:var(--cm-navy,#0F1628);color:#fff; border:none;border-radius:999px;font-size:11.5px;font-weight:600;letter-spacing:0.05em;text-transform:uppercase; } } /* ============== 11. VIDEO SHOWCASE (.fc-vshow__*) ============== */ @media (max-width:860px){ .fc-vshow{padding:0 !important;position:relative;} .fc-vshow__inner{display:flex;flex-direction:column;} .fc-vshow__media{aspect-ratio:9/16;max-height:70vh;overflow:hidden;position:relative;} .fc-vshow__video{width:100%;height:100%;object-fit:cover;} .fc-vshow__gradient{ position:absolute;inset:auto 0 0 0;height:45%; background:linear-gradient(180deg,transparent 0%,rgba(15,22,40,0.55) 55%,rgba(15,22,40,0.88) 100%); pointer-events:none; } .fc-vshow__content{ position:absolute;inset:auto 0 0 0;padding:20px 20px 24px;color:#fff;z-index:2; } .fc-vshow__eyebrow{ font-size:10.5px;letter-spacing:0.18em;color:var(--cm-gold,#C9A23A); text-transform:uppercase;font-weight:700;margin-bottom:8px; } .fc-vshow__heading{font-size:clamp(22px,6vw,28px);line-height:1.15;margin:0 0 12px;letter-spacing:-0.01em;color:#fff;} .fc-vshow__body{font-size:14px;color:rgba(255,255,255,0.85);margin:0 0 14px;line-height:1.5;} .fc-vshow__cta{ display:inline-flex;align-items:center;gap:8px;padding:11px 22px; background:var(--cm-gold,#C9A23A);color:var(--cm-navy,#0F1628); border-radius:999px;font-size:13px;font-weight:700;letter-spacing:0.04em;text-transform:uppercase;text-decoration:none; } } /* ============== 12. TICKER / ANNOUNCE ============== */ @media (max-width:860px){ .fc-ticker,.fc-announce{font-size:11.5px !important;letter-spacing:0.06em !important;padding:7px 0 !important;} .fc-ticker__item,.fc-announce__item{padding:0 18px;} .fc-ticker__dot{opacity:0.5;margin:0 14px;} .fc-announce__icon{margin-right:6px;font-size:12px;} } /* ============== 13. COUNTDOWN banner ============== */ @media (max-width:860px){ .fc-countdown,.fc-section--countdown{padding:14px 16px !important;text-align:center;} .fc-countdown-inner{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;} .fc-countdown-label{font-size:12px;letter-spacing:0.08em;font-weight:600;} .fc-countdown-num{ display:inline-flex;align-items:center;justify-content:center; min-width:28px;padding:4px 6px;background:var(--cm-navy,#0F1628);color:#fff; border-radius:6px;font-size:13px;font-weight:700; } .fc-countdown-unit,.fc-countdown-cap{font-size:10px;letter-spacing:0.1em;opacity:0.7;} .fc-countdown-dash{color:var(--cm-muted,#5A6478);} } /* ============== 14. PAYSTRIP ============== */ @media (max-width:860px){ .fc-paystrip,.fc-section--pay{padding:18px 16px !important;background:var(--cm-cream-2,#F4EFE6);text-align:center;} .fc-paystrip-inner{display:flex;flex-direction:column;align-items:center;gap:10px;} .fc-paystrip-label{font-size:11px;letter-spacing:0.14em;color:var(--cm-muted,#5A6478);text-transform:uppercase;font-weight:600;} .fc-paystrip-icons{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;} .fc-pay-badge{background:#fff;border-radius:6px;padding:4px 8px;height:26px;display:inline-flex;align-items:center;font-size:11px;font-weight:600;} } /* ============== 15. ACCORDION (.fc-accord__*) ============== */ @media (max-width:860px){ .fc-accord{padding:28px 16px !important;} .fc-accord__title{font-size:24px;margin:0 0 14px;letter-spacing:-0.01em;text-align:center;} .fc-accord__subtitle{font-size:13.5px;color:var(--cm-muted,#5A6478);text-align:center;margin:0 0 18px;} .fc-accord__list{display:flex;flex-direction:column;gap:10px;} .fc-accord__item{ background:#fff;border-radius:var(--cm-radius,14px);border:1px solid var(--cm-line,rgba(15,22,40,0.08)); overflow:hidden; } .fc-accord__trigger,.fc-accord__question{ padding:14px 16px;display:flex;align-items:center;gap:12px;cursor:pointer; font-size:14.5px;font-weight:600;color:var(--cm-navy,#0F1628); } .fc-accord__number{ flex:0 0 28px;height:28px;border-radius:50%;background:var(--cm-gold-pale,#FAF3DA); color:var(--cm-gold-2,#B8901F);font-size:12px;font-weight:700; display:inline-flex;align-items:center;justify-content:center; } .fc-accord__icon{margin-left:auto;color:var(--cm-gold,#C9A23A);font-size:20px;flex-shrink:0;} .fc-accord__content{padding:0 16px 16px;} .fc-accord__content-inner{font-size:14px;line-height:1.6;color:var(--cm-muted,#5A6478);} .fc-accord__image,.fc-accord__product-img{margin:10px 0;border-radius:10px;overflow:hidden;} .fc-accord__image img,.fc-accord__product-img img{width:100%;height:auto;display:block;} } /* ============== 16. MATERIALS ============== */ @media (max-width:860px){ .fc-materials{padding:32px 16px !important;background:var(--cm-navy,#0F1628);color:#fff;} .fc-materials__container{max-width:100%;padding:0;} .fc-materials__intro{margin-bottom:20px;text-align:center;} .fc-materials__title{font-size:24px;margin:0 0 10px;letter-spacing:-0.01em;color:#fff;} .fc-materials__image{margin:16px 0;aspect-ratio:4/3;border-radius:var(--cm-radius,14px);overflow:hidden;} .fc-materials__image img,.fc-materials__product-img img{width:100%;height:100%;object-fit:cover;} .fc-materials__layers{display:flex;flex-direction:column;gap:12px;} .fc-materials__layer{ background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.1); border-radius:var(--cm-radius,14px);padding:14px 16px; } .fc-materials__layer-number{ font-size:10.5px;letter-spacing:0.16em;color:var(--cm-gold,#C9A23A);font-weight:700;text-transform:uppercase; } .fc-materials__layer-title{font-size:15px;font-weight:600;margin:4px 0 4px;color:#fff;} .fc-materials__layer-desc{font-size:13px;color:rgba(255,255,255,0.72);line-height:1.5;margin:0;} } /* ============== 17. DESKTOP REFINEMENTS (≥861px) ============== */ @media (min-width:861px){ .fc-ft__grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:40px;} .fc-ft__col-title{padding:0 0 14px !important;border:none !important;} .fc-coll__grid{grid-template-columns:1fr 1fr;gap:24px;max-width:1200px;margin:0 auto;padding:0 40px;} .fc-shop__grid{grid-template-columns:repeat(4,1fr);gap:22px;padding:0 40px;max-width:1400px;margin:0 auto;} .fc-rev__grid,.fc-rev__inner{display:grid !important;grid-template-columns:repeat(3,1fr);gap:22px;overflow:visible;padding:0 40px;max-width:1300px;margin:0 auto;} .fc-rev__card{flex:1 1 auto !important;} .fc-nl{max-width:820px;margin:56px auto;padding:56px 48px !important;} .fc-nl__form{flex-direction:row;max-width:540px;margin:0 auto;} .fc-nl__input{flex:1;} .fc-nl__btn{flex:0 0 auto;min-width:170px;} .fc-faq__items{max-width:860px;margin:0 auto;} .fc-storia__container{max-width:900px;margin:0 auto;display:grid;grid-template-columns:1fr;gap:8px;} .fc-hero4__headline{font-size:clamp(40px,5vw,64px) !important;} .fc-match__options{grid-template-columns:repeat(4,1fr) !important;max-width:860px;margin:0 auto;} .fc-materials__layers{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;} } /* ===== fc-header-polish-v1.css ===== */ /* ============================================================ FC HEADER POLISH v1 — desktop + mobile premium header Fixes: sloppy spacing, balance, logo prominence ============================================================ */ /* ============== DESKTOP (≥861px) ============== */ @media (min-width:861px){ .fc-header, .fc-header-inner{ max-width: 1400px !important; margin: 0 auto !important; padding: 14px 32px !important; display: grid !important; grid-template-columns: 1fr auto 1fr !important; align-items: center !important; gap: 24px !important; } .fc-header-logo, .fc-header-logo a, .fc-logo{ font-family: 'Playfair Display', Georgia, 'Times New Roman', serif !important; font-size: 26px !important; font-weight: 600 !important; letter-spacing: 0.02em !important; color: var(--cm-navy, #0F1628) !important; text-decoration: none !important; white-space: nowrap !important; justify-self: start !important; } .fc-header-logo a{ color: inherit !important; } .fc-header-nav{ justify-self: center !important; display: flex !important; align-items: center !important; gap: 36px !important; } .fc-header-nav a, .fc-header-nav .nav-link{ font-size: 14px !important; font-weight: 500 !important; letter-spacing: 0.02em !important; color: var(--cm-ink, #1A2238) !important; text-decoration: none !important; padding: 6px 0 !important; position: relative !important; transition: color 0.2s ease !important; } .fc-header-nav a:hover{ color: var(--cm-gold-2, #B8901F) !important; } .fc-header-nav a.is-active, .fc-header-nav a[aria-current="page"]{ color: var(--cm-gold-2, #B8901F) !important; } .fc-header-nav a.is-active::after, .fc-header-nav a[aria-current="page"]::after{ content: "" !important; position: absolute !important; bottom: -2px !important; left: 0 !important; right: 0 !important; height: 2px !important; background: var(--cm-gold, #C9A23A) !important; border-radius: 2px !important; } .fc-cart-btn, .fc-cart{ justify-self: end !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; padding: 8px 12px !important; border-radius: 999px !important; transition: background 0.2s ease !important; } .fc-cart-btn:hover, .fc-cart:hover{ background: var(--cm-cream-2, #F4EFE6) !important; } .fc-cart-count{ font-size: 13px !important; font-weight: 600 !important; color: var(--cm-navy, #0F1628) !important; } .fc-ticker, .fc-announce{ padding: 10px 24px !important; font-size: 12px !important; letter-spacing: 0.08em !important; } .fc-ticker__inner, .fc-announce__inner{ max-width: 1400px !important; margin: 0 auto !important; display: flex !important; align-items: center !important; justify-content: center !important; gap: 48px !important; } .fc-ticker__item, .fc-announce__item{ display: inline-flex !important; align-items: center !important; gap: 8px !important; padding: 0 !important; white-space: nowrap !important; } } /* ============== MOBILE (≤860px) ============== */ @media (max-width:860px){ .fc-ticker, .fc-announce{ padding: 8px 0 !important; font-size: 11px !important; letter-spacing: 0.08em !important; overflow: hidden !important; } .fc-ticker__inner, .fc-announce__inner{ display: flex !important; gap: 28px !important; animation: fc-ticker-scroll 24s linear infinite !important; width: max-content !important; } @keyframes fc-ticker-scroll{ from{ transform: translateX(0); } to{ transform: translateX(-50%); } } .fc-header, .fc-header-inner{ padding: 10px 14px !important; display: grid !important; grid-template-columns: 40px 1fr 40px !important; align-items: center !important; gap: 8px !important; } .fc-header-logo, .fc-header-logo a, .fc-logo{ font-family: 'Playfair Display', Georgia, serif !important; font-size: 20px !important; font-weight: 600 !important; letter-spacing: 0.02em !important; color: var(--cm-navy, #0F1628) !important; text-decoration: none !important; text-align: center !important; justify-self: center !important; white-space: nowrap !important; } .fc-header-nav{ display: none !important; } .fc-hamburger{ justify-self: start !important; width: 40px !important; height: 40px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; background: transparent !important; border: none !important; padding: 0 !important; cursor: pointer !important; } .fc-cart-btn, .fc-cart{ justify-self: end !important; width: 40px !important; height: 40px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; position: relative !important; padding: 0 !important; } .fc-cart-count{ position: absolute !important; top: 2px !important; right: 2px !important; min-width: 16px !important; height: 16px !important; padding: 0 4px !important; background: var(--cm-gold, #C9A23A) !important; color: var(--cm-navy, #0F1628) !important; border-radius: 999px !important; font-size: 10px !important; font-weight: 700 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; } } .fc-header{ border-bottom: 1px solid rgba(15,22,40,0.06) !important; background: #ffffff !important; } /* ===== fc-polish-master-v2.css ===== */ /* FC POLISH MASTER v2 */ @media (min-width:861px){ .fc-section{padding-top:64px!important;padding-bottom:64px!important} .fc-section__inner,.fc-section>.container,.fc-section>.page-width{max-width:1280px!important;margin-left:auto!important;margin-right:auto!important;padding-left:32px!important;padding-right:32px!important} .fc-section__title,.fc-section-title,.fc-materials__title,.fc-reviews__title,.fc-vs__title,.fc-shop__title{font-family:'Playfair Display',Georgia,serif!important;font-size:36px!important;font-weight:600!important;letter-spacing:.01em!important;text-align:center!important;margin-bottom:12px!important;color:#0F1628!important} .fc-section__subtitle,.fc-section-subtitle,.fc-materials__subtitle,.fc-reviews__subtitle,.fc-vs__subtitle,.fc-shop__subtitle{font-size:15px!important;color:#6B6256!important;text-align:center!important;margin-bottom:40px!important;max-width:640px!important;margin-left:auto!important;margin-right:auto!important} .fc-materials .fc-materials__grid,.fc-materials__cards,.fc-materials__items,.fc-materials .cards,.fc-materials-grid{display:grid!important;grid-template-columns:repeat(5,1fr)!important;gap:20px!important;max-width:1100px!important;margin:0 auto!important} .fc-materials .fc-materials__card,.fc-materials .card,.fc-materials__item{min-width:0!important;padding:20px 18px!important;background:#fff!important;border:1px solid rgba(15,22,40,.06)!important;border-radius:10px!important;min-height:220px!important} .fc-materials .fc-materials__card h3,.fc-materials .card h3,.fc-materials__item-title{font-size:14px!important;line-height:1.35!important;letter-spacing:.04em!important;font-weight:700!important;text-transform:uppercase!important;word-break:normal!important;hyphens:none!important;margin:0 0 10px!important;color:#0F1628!important} .fc-materials .fc-materials__card p,.fc-materials .card p,.fc-materials__item-text{font-size:13px!important;line-height:1.55!important;color:#6B6256!important;margin:0!important} .fc-materials__image,.fc-materials__visual{display:none!important} .fc-reviews .fc-reviews__layout,.fc-reviews__wrap,.fc-reviews-grid,.fc-reviews .grid{display:grid!important;grid-template-columns:260px minmax(0,1fr)!important;gap:48px!important;align-items:start!important;max-width:1200px!important;margin:0 auto!important} .fc-reviews__head,.fc-reviews__header,.fc-reviews__left{position:sticky!important;top:24px!important} .fc-reviews__title{text-align:left!important;font-size:32px!important;line-height:1.15!important;margin-bottom:20px!important} .fc-reviews__items,.fc-reviews__cards,.fc-reviews__list{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:20px!important} .fc-reviews__card,.fc-reviews__item,.fc-reviews .card{min-width:0!important;background:#fff!important;border:1px solid rgba(15,22,40,.06)!important;border-radius:10px!important;padding:22px!important} .fc-reviews__card p,.fc-reviews__text{font-size:14px!important;line-height:1.6!important;color:#1A2238!important} .fc-coll .fc-coll__grid,.fc-coll__items,.collection-grid,.product-grid,.fc-pcard-grid{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:20px!important;align-items:stretch!important} .fc-coll__card,.fc-pcard,.fc-product-card,.product-card{display:flex!important;flex-direction:column!important;height:100%!important;min-width:0!important;background:#fff!important;border:1px solid rgba(15,22,40,.06)!important;border-radius:10px!important;overflow:hidden!important} .fc-coll__card__img,.fc-pcard__img,.fc-product-card__img,.fc-coll__card .image,.fc-pcard .image{aspect-ratio:1/1!important;width:100%!important;background:#F4EFE6!important;display:flex!important;align-items:center!important;justify-content:center!important;overflow:hidden!important} .fc-coll__card__img img,.fc-pcard__img img,.fc-product-card__img img{width:100%!important;height:100%!important;object-fit:contain!important;padding:18px!important} .fc-coll__card__body,.fc-pcard__body,.fc-product-card__body{padding:14px 16px 18px!important;display:flex!important;flex-direction:column!important;gap:6px!important;flex:1!important} .fc-coll__card__title,.fc-pcard__title,.fc-product-card__title{font-size:14px!important;line-height:1.3!important;font-weight:700!important;letter-spacing:.04em!important;text-transform:uppercase!important;color:#0F1628!important;margin:0!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important;min-height:2.6em!important} .fc-coll__card__sub,.fc-pcard__sub,.fc-product-card__sub{font-size:12px!important;color:#6B6256!important;margin:0!important;min-height:1.5em!important;display:-webkit-box!important;-webkit-line-clamp:1!important;-webkit-box-orient:vertical!important;overflow:hidden!important} .fc-coll__card__price,.fc-pcard__price,.fc-product-card__price{font-size:14px!important;font-weight:700!important;color:#0F1628!important;margin:4px 0 8px!important} .fc-coll__card__btn,.fc-pcard__btn,.fc-product-card__btn{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:100%!important;padding:10px 14px!important;background:#0F1628!important;color:#F4EFE6!important;font-size:11px!important;font-weight:700!important;letter-spacing:.12em!important;text-transform:uppercase!important;text-decoration:none!important;border-radius:6px!important;margin-top:auto!important} .fc-shop .fc-shop__grid,.fc-pcarousel .fc-pcarousel__grid,.fc-shop__rail,.fc-pcarousel__rail{display:grid!important;grid-auto-flow:column!important;grid-auto-columns:minmax(220px,22%)!important;gap:16px!important;overflow-x:auto!important;scroll-snap-type:x mandatory!important;padding:6px 32px 20px!important;scroll-padding-left:32px!important;max-width:1280px!important;margin:0 auto!important} .fc-shop .fc-shop__grid::-webkit-scrollbar,.fc-pcarousel .fc-pcarousel__grid::-webkit-scrollbar{height:6px!important} .fc-shop .fc-shop__grid::-webkit-scrollbar-thumb,.fc-pcarousel .fc-pcarousel__grid::-webkit-scrollbar-thumb{background:rgba(15,22,40,.15)!important;border-radius:3px!important} .fc-shop__card,.fc-pcarousel__card{scroll-snap-align:start!important} .fc-vs .fc-vs__table,.fc-vs-table{max-width:1000px!important;margin:0 auto!important;border-collapse:separate!important;border-spacing:0!important;width:100%!important} .fc-vs .fc-vs__head th,.fc-vs__col-head{padding:20px 16px!important;font-size:12px!important;letter-spacing:.12em!important} .fc-vs .fc-vs__row td,.fc-vs__cell{padding:14px 16px!important;font-size:14px!important} .fc-usp .fc-usp__grid,.fc-usp__items,.fc-usp2-grid{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:24px!important;max-width:1200px!important;margin:0 auto!important} .fc-usp__item,.fc-usp__card{text-align:center!important;padding:20px 18px!important} .fc-faq .fc-faq__inner,.fc-accord .fc-accord__inner{max-width:860px!important;margin:0 auto!important;padding-left:32px!important;padding-right:32px!important} .fc-faq__item,.fc-accord__item{border-bottom:1px solid rgba(15,22,40,.08)!important;padding:18px 0!important} .fc-faq__q,.fc-accord__q{font-size:16px!important;font-weight:600!important} .fc-faq__a,.fc-accord__a{font-size:14px!important;line-height:1.65!important;color:#6B6256!important;padding-top:8px!important} .fc-storia .fc-storia__grid,.fc-storia__wrap{display:grid!important;grid-template-columns:1fr 1fr!important;gap:48px!important;align-items:center!important;max-width:1200px!important;margin:0 auto!important} .fc-storia__copy p{font-size:15px!important;line-height:1.7!important;color:#3A3A3A!important} .fc-vshow .fc-vshow__inner{max-width:1100px!important;margin:0 auto!important} .fc-vshow video{border-radius:14px!important} .fc-newsletter .fc-newsletter__inner{max-width:720px!important;margin:0 auto!important;text-align:center!important} .fc-newsletter__form{max-width:480px!important;margin:16px auto 0!important} .fc-paystrip .fc-paystrip__inner{max-width:1200px!important;margin:0 auto!important;display:flex!important;align-items:center!important;justify-content:center!important;flex-wrap:wrap!important;gap:16px!important;padding:20px 32px!important} .fc-hero4 .fc-hero4__inner,.fc-hero4__grid{max-width:1280px!important;margin:0 auto!important;padding:64px 32px!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:48px!important;align-items:center!important} .fc-hero4__title{font-size:48px!important;line-height:1.1!important} .fc-hero4__sub{font-size:16px!important;line-height:1.6!important;color:#6B6256!important;margin:16px 0 24px!important} } @media (max-width:860px){ html,body{overflow-x:hidden!important} img{max-width:100%!important;height:auto!important} .fc-materials .fc-materials__grid,.fc-materials__cards,.fc-materials__items,.fc-materials .cards,.fc-materials-grid{display:grid!important;grid-template-columns:repeat(2,1fr)!important;gap:10px!important;padding:0 14px!important} .fc-materials .fc-materials__card,.fc-materials .card,.fc-materials__item{padding:14px 12px!important;background:#fff!important;border:1px solid rgba(15,22,40,.06)!important;border-radius:8px!important;min-height:160px!important} .fc-materials .fc-materials__card h3,.fc-materials .card h3{font-size:12px!important;line-height:1.3!important;word-break:normal!important} .fc-materials .fc-materials__card p,.fc-materials .card p{font-size:12px!important;line-height:1.5!important} .fc-materials__image,.fc-materials__visual{display:none!important} .fc-reviews .fc-reviews__layout,.fc-reviews__wrap,.fc-reviews-grid,.fc-reviews .grid{display:block!important} .fc-reviews__items,.fc-reviews__cards,.fc-reviews__list{display:grid!important;grid-auto-flow:column!important;grid-auto-columns:78%!important;gap:12px!important;overflow-x:auto!important;scroll-snap-type:x mandatory!important;padding:0 14px 8px!important;-webkit-overflow-scrolling:touch!important} .fc-reviews__card,.fc-reviews__item{scroll-snap-align:start!important} .fc-coll .fc-coll__grid,.fc-coll__items,.collection-grid,.product-grid,.fc-pcard-grid{display:grid!important;grid-template-columns:repeat(2,1fr)!important;gap:8px!important;align-items:stretch!important;padding:0 8px!important} .fc-coll__card,.fc-pcard,.fc-product-card{display:flex!important;flex-direction:column!important;height:100%!important} .fc-coll__card__img img,.fc-pcard__img img,.fc-product-card__img img{object-fit:contain!important;padding:10px!important} .fc-coll__card__title,.fc-pcard__title,.fc-product-card__title{display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important;min-height:2.6em!important} .fc-shop .fc-shop__grid,.fc-pcarousel .fc-pcarousel__grid,.fc-shop__rail,.fc-pcarousel__rail{display:grid!important;grid-auto-flow:column!important;grid-auto-columns:70%!important;gap:10px!important;overflow-x:auto!important;scroll-snap-type:x mandatory!important;padding:0 14px 8px!important} .fc-shop__card,.fc-pcarousel__card{scroll-snap-align:start!important} .fc-usp .fc-usp__grid,.fc-usp__items,.fc-usp2-grid{display:grid!important;grid-template-columns:repeat(2,1fr)!important;gap:10px!important;padding:0 14px!important} } /* ===== fc-polish-fix-v3.css ===== */ /* FC POLISH FIX v3 - target real BEM classes */ @media (min-width:861px){ .fc-coll__grid, .fc-coll .fc-coll__grid{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:20px!important;align-items:stretch!important} .fc-coll__card{display:flex!important;flex-direction:column!important;height:100%!important;min-width:0!important;background:#fff!important;border:1px solid rgba(15,22,40,.06)!important;border-radius:10px!important;overflow:hidden!important} .fc-coll__card-img{aspect-ratio:1/1!important;width:100%!important;background:#F4EFE6!important;display:flex!important;align-items:center!important;justify-content:center!important;overflow:hidden!important} .fc-coll__card-img img{width:100%!important;height:100%!important;object-fit:contain!important;padding:18px!important;box-sizing:border-box!important} .fc-coll__card-info{padding:14px 16px 18px!important;display:flex!important;flex-direction:column!important;gap:6px!important;flex:1!important} .fc-coll__card-name{font-family:'Playfair Display',Georgia,serif!important;font-size:16px!important;line-height:1.3!important;font-weight:600!important;letter-spacing:.01em!important;color:#0F1628!important;margin:0!important;text-transform:none!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important;min-height:2.6em!important;text-align:left!important} .fc-coll__card-price{font-size:15px!important;font-weight:700!important;color:#0F1628!important;margin:4px 0 0!important} .fc-coll__card-compare{font-size:13px!important;color:#8A7D6E!important;text-decoration:line-through!important;margin-left:6px!important} .fc-coll__card-btn{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:100%!important;padding:10px 14px!important;background:#0F1628!important;color:#F4EFE6!important;font-size:11px!important;font-weight:700!important;letter-spacing:.12em!important;text-transform:uppercase!important;text-decoration:none!important;border-radius:6px!important;margin-top:auto!important} } @media (max-width:860px){ .fc-coll__grid, .fc-coll .fc-coll__grid{display:grid!important;grid-template-columns:repeat(2,1fr)!important;gap:8px!important;padding:0 8px!important;align-items:stretch!important} .fc-coll__card{height:100%!important;display:flex!important;flex-direction:column!important} .fc-coll__card-img img{object-fit:contain!important;padding:8px!important} .fc-coll__card-info{padding:10px 10px 12px!important;gap:4px!important} .fc-coll__card-name{font-size:13px!important;font-family:'Playfair Display',Georgia,serif!important;font-weight:600!important;line-height:1.3!important;color:#0F1628!important;text-transform:none!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important;min-height:2.6em!important} .fc-coll__card-price{font-size:13px!important;font-weight:700!important;color:#0F1628!important} .fc-coll__card-compare{font-size:11px!important} .fc-coll__card-btn{padding:8px 10px!important;font-size:10px!important;letter-spacing:.1em!important} } /* Also fix any .fc-shop__card and .fc-pcard variants that use same pattern */ @media (min-width:861px){ .fc-shop__card-name,.fc-pcard-name,.fc-pcard__name{font-family:'Playfair Display',Georgia,serif!important;font-size:16px!important;font-weight:600!important;line-height:1.3!important;text-transform:none!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important;min-height:2.6em!important} } @media (max-width:860px){ .fc-shop__card-name,.fc-pcard-name,.fc-pcard__name{font-size:13px!important} } /* ===== fc-mobile-polish-v6.css ===== */ /* fc-mobile-polish-v6.css — Cucina Modena final mobile premium polish Goal: competitor-grade mobile feel (Aesop/Glossier/SSENSE/Zalando parity). Loaded AFTER all other fc-mobile CSS, so wins specificity ties. */ /* ============================================ GLOBAL (all viewports) — subtle premium base ============================================ */ html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; -webkit-tap-highlight-color:rgba(191,138,53,.08); } body{ -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; text-rendering:optimizeLegibility; } *,::before,::after{box-sizing:border-box} img,video{max-width:100%;height:auto;display:block} button,a{-webkit-tap-highlight-color:transparent} /* Selection styling */ ::selection{background:rgba(191,138,53,.22);color:#111} /* Smooth momentum scroll on iOS */ .fc-carousel,.fc-prod-cat__grid,[class*="scroll-x"],[class*="horizontal"]{ -webkit-overflow-scrolling:touch; scroll-behavior:smooth; scrollbar-width:none; } .fc-carousel::-webkit-scrollbar, .fc-prod-cat__grid::-webkit-scrollbar, [class*="scroll-x"]::-webkit-scrollbar{display:none} /* ============================================ MOBILE (<=640px) — the premium polish layer ============================================ */ @media (max-width:640px){ /* --- Typography rhythm --- */ :root{ --fc-type-xs:11px; --fc-type-sm:13px; --fc-type-base:15px; --fc-type-lg:17px; --fc-type-xl:22px; --fc-type-2xl:28px; --fc-type-3xl:34px; --fc-sp-1:8px; --fc-sp-2:12px; --fc-sp-3:16px; --fc-sp-4:24px; --fc-sp-5:32px; --fc-sp-6:48px; --fc-radius:12px; --fc-radius-sm:8px; --fc-ease:cubic-bezier(.22,.61,.36,1); } body{font-size:var(--fc-type-base);line-height:1.55} h1,.h1{font-size:var(--fc-type-3xl)!important;line-height:1.12!important;letter-spacing:-.02em!important} h2,.h2{font-size:var(--fc-type-2xl)!important;line-height:1.18!important;letter-spacing:-.015em!important} h3,.h3{font-size:var(--fc-type-xl)!important;line-height:1.25!important;letter-spacing:-.01em!important} h4,.h4{font-size:var(--fc-type-lg)!important;line-height:1.35!important} p{font-size:var(--fc-type-base);line-height:1.6} small,.caption,[class*="caption"]{font-size:var(--fc-type-xs);letter-spacing:.04em;text-transform:uppercase} /* Pretty hyphenation prevents awkward word breaks */ h1,h2,h3,p{ -webkit-hyphens:auto; hyphens:auto; overflow-wrap:break-word; word-wrap:break-word; } /* --- Section rhythm — consistent vertical cadence --- */ section, .shopify-section > section, .shopify-section > div{ padding-left:16px; padding-right:16px; } .shopify-section + .shopify-section{ margin-top:0; } section[class*="fc-"]:not(.fc-ticker):not(.fc-announ):not(.fc-header):not(.fc-footer){ padding-top:var(--fc-sp-6); padding-bottom:var(--fc-sp-6); } /* --- Touch targets — WCAG 2.5.5 minimum 44×44 --- */ button, a.button, .btn, [class*="button"]:not(.buttons-container):not([class*="group"]), input[type=submit], input[type=button], [role="button"]{ min-height:48px; min-width:48px; padding:14px 20px; font-size:15px; font-weight:600; letter-spacing:.01em; border-radius:var(--fc-radius); transition:transform .18s var(--fc-ease),box-shadow .18s var(--fc-ease),background .18s var(--fc-ease); touch-action:manipulation; } button:active, a.button:active, .btn:active, [role="button"]:active{ transform:scale(.97); } /* Primary CTA — premium gold gradient */ .btn-primary, .fc-cta-primary, button[type="submit"], form[action^="/cart/add"] button[name="add"]{ background:linear-gradient(180deg,#c89550 0%,#a97a38 100%)!important; color:#fff!important; box-shadow:0 2px 8px rgba(169,122,56,.25),0 0 0 0 rgba(191,138,53,.4)!important; border:none!important; letter-spacing:.02em!important; text-transform:none!important; } .btn-primary:active, form[action^="/cart/add"] button[name="add"]:active{ box-shadow:0 1px 4px rgba(169,122,56,.3),0 0 0 4px rgba(191,138,53,.15)!important; } /* --- Header polish — compact, sticky, glassy --- */ header.fc-header, .fc-header, .fc-head-v2, [class*="header-v2"]{ position:sticky!important; top:0; z-index:90; backdrop-filter:saturate(180%) blur(14px); -webkit-backdrop-filter:saturate(180%) blur(14px); background:rgba(255,253,249,.92)!important; border-bottom:1px solid rgba(0,0,0,.06); min-height:54px; transition:transform .3s var(--fc-ease); } /* --- Hero — room to breathe, no cropped text --- */ .fc-hero,.fc-hero4,.fc-hero2{ padding:var(--fc-sp-5) 16px var(--fc-sp-6)!important; min-height:auto!important; } .fc-hero h1,.fc-hero4 h1,.fc-hero2 h1{ max-width:100%; margin:0 auto var(--fc-sp-3); } .fc-hero p,.fc-hero4 p,.fc-hero2 p{ max-width:44ch; margin-left:auto; margin-right:auto; } /* --- Product cards — Zalando/SSENSE tight 2-col --- */ .fc-shop__grid, .fc-prod-cat__grid, .collection-grid, .grid[class*="product"], [class*="products"] .grid, .fc-collection__grid{ display:grid!important; grid-template-columns:repeat(2,1fr)!important; gap:12px!important; padding:0 12px!important; } .fc-shop__card, .fc-prod-cat__card, .fc-product-card, .grid__item[class*="product"], .product-card-wrapper{ border-radius:var(--fc-radius-sm); overflow:hidden; background:#fff; transition:transform .2s var(--fc-ease); } .fc-shop__card:active, .fc-prod-cat__card:active, .product-card-wrapper:active{ transform:scale(.98); } .fc-shop__card img, .fc-prod-cat__card img, .product-card-wrapper img{ aspect-ratio:1/1; object-fit:cover; border-radius:var(--fc-radius-sm) var(--fc-radius-sm) 0 0; } .fc-shop__card h3,.fc-shop__card .title, .fc-prod-cat__card h3,.fc-prod-cat__card .title, .product-card-wrapper .card__heading{ font-size:14px!important; font-weight:500!important; line-height:1.3!important; margin:8px 10px 4px!important; letter-spacing:0!important; text-transform:none!important; } .fc-shop__price, .fc-prod-cat__price, .price__container, [class*="price"]{ font-size:14px!important; font-weight:600!important; color:#111!important; padding:0 10px 10px!important; } /* --- Carousel nav — larger, thumbable --- */ .fc-carousel{padding:0 16px} .fc-carousel__track{gap:12px;scroll-snap-type:x mandatory;padding-bottom:4px} .fc-carousel__track > *{scroll-snap-align:start;flex:0 0 78%;max-width:280px} /* --- Forms — iOS-native feel, no zoom on focus --- */ input,select,textarea{ font-size:16px!important; /* prevents iOS zoom */ min-height:48px; padding:12px 14px; border-radius:var(--fc-radius-sm); border:1px solid rgba(0,0,0,.12); background:#fff; transition:border-color .15s var(--fc-ease),box-shadow .15s var(--fc-ease); } input:focus,select:focus,textarea:focus{ outline:none; border-color:#bf8a35; box-shadow:0 0 0 3px rgba(191,138,53,.15); } /* --- FAQ accordion — smooth + larger tap --- */ .fc-faq details, .fc-faq2 details, details{ border-bottom:1px solid rgba(0,0,0,.08); transition:background .15s var(--fc-ease); } details summary{ min-height:56px; padding:16px 40px 16px 4px; font-size:15px; font-weight:500; line-height:1.4; cursor:pointer; position:relative; list-style:none; } details summary::-webkit-details-marker{display:none} details summary::after{ content:"+"; position:absolute; right:4px; top:50%; transform:translateY(-50%); font-size:22px; font-weight:300; color:#bf8a35; transition:transform .2s var(--fc-ease); } details[open] summary::after{ content:"−"; transform:translateY(-50%) rotate(0); } details[open]{background:rgba(191,138,53,.03)} details > *:not(summary){ padding:0 4px 16px; font-size:14px; line-height:1.6; color:#444; } /* --- Safe area (iPhone notch / home bar) --- */ .fc-sticky-atc, .fc-sticky-atc__inner, footer.fc-footer, .fc-footer{ padding-bottom:calc(env(safe-area-inset-bottom,0) + 8px)!important; } body.template-product{ padding-bottom:calc(74px + env(safe-area-inset-bottom,0))!important; } /* --- Cart drawer mobile pass --- */ #fc-dr, .fc-cart-drawer, .fc-dr{ width:100%!important; max-width:100%!important; border-radius:16px 16px 0 0; } .fc-dr__header, [class*="cart-drawer__header"]{ padding-top:calc(20px + env(safe-area-inset-top,0))!important; } /* --- Scroll reveal (progressive, no jank) --- */ [data-reveal]{opacity:0;transform:translateY(12px);transition:opacity .5s var(--fc-ease),transform .5s var(--fc-ease)} [data-reveal].is-visible{opacity:1;transform:translateY(0)} /* --- Reduce motion respect --- */ @media (prefers-reduced-motion:reduce){ *,*::before,*::after{ animation-duration:0.01ms!important; animation-iteration-count:1!important; transition-duration:0.01ms!important; scroll-behavior:auto!important; } } /* --- Skeleton / empty states --- */ .is-loading,[data-loading]{ background:linear-gradient(90deg,#f4f4f4 0%,#fafafa 50%,#f4f4f4 100%); background-size:200% 100%; animation:fcSkelly 1.2s ease-in-out infinite; } @keyframes fcSkelly{ 0%{background-position:200% 0} 100%{background-position:-200% 0} } /* --- Image protection from layout shift --- */ img[src]{background:#f6f4ef} img[loading="lazy"]{content-visibility:auto} /* --- Ticker polish — no cut off --- */ .fc-ticker{ font-size:12px; padding:8px 0; letter-spacing:.06em; text-transform:uppercase; } /* --- Announcement bar tightening --- */ .fc-announ,[class*="announcement"]{ font-size:12px; padding:6px 12px; letter-spacing:.04em; } /* --- USP/feature grid — 2×N never stacks to 1 --- */ .fc-materials__grid, .fc-usp__grid, [class*="usp"][class*="grid"]{ grid-template-columns:repeat(2,1fr)!important; gap:10px!important; } .fc-materials__card, .fc-usp__card{ padding:14px 12px!important; min-height:auto!important; } .fc-materials__card h3, .fc-usp__card h3{ font-size:13px!important; line-height:1.25!important; } /* --- Footer spacing --- */ .fc-footer{ padding-top:40px; font-size:13px; } .fc-footer h4, .fc-footer .h4{ font-size:12px; letter-spacing:.1em; text-transform:uppercase; margin-bottom:12px; } .fc-footer a{ display:inline-block; padding:6px 0; color:rgba(0,0,0,.7); } /* --- Storia split — image first then text on mobile --- */ .fc-storia__inner, [class*="storia"]__inner{ display:flex!important; flex-direction:column!important; gap:20px!important; } .fc-storia__img, [class*="storia"] img{ order:-1; border-radius:var(--fc-radius); aspect-ratio:4/3; object-fit:cover; } /* --- Comparison tables — stack gracefully --- */ .fc-vs__table, table[class*="compare"]{ font-size:13px; } .fc-vs__table th, .fc-vs__table td{ padding:10px 8px!important; } /* --- Sticky ATC refinement --- */ .fc-sticky-atc, .fc-sa{ box-shadow:0 -4px 20px rgba(0,0,0,.08)!important; border-top:1px solid rgba(0,0,0,.05)!important; } /* --- Image gallery: snap + dots --- */ .fc-prod__gallery, .product__media-list, [class*="product"] [class*="gallery"]{ scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; } .fc-prod__gallery > *, .product__media-list > *{ scroll-snap-align:center; } /* --- Links — subtle underline on tap --- */ a:not(.btn):not(.button){ text-underline-offset:3px; } } /* ============================================ TABLET (641-1024px) — in-between optimization ============================================ */ @media (min-width:641px) and (max-width:1024px){ .fc-shop__grid, .fc-collection__grid{ grid-template-columns:repeat(3,1fr)!important; gap:16px!important; } section[class*="fc-"]{ padding-left:24px!important; padding-right:24px!important; } } /* ============================================ HIGH-DPI — sharper borders + shadows ============================================ */ @media (min-resolution:2dppx),(-webkit-min-device-pixel-ratio:2){ .fc-shop__card, .product-card-wrapper{ border:.5px solid rgba(0,0,0,.06); } } /* ===== fc-typo-fix-v1.css ===== */ /* SUPER-SPECIFIC H2 CAP - beats cm-polish 25 :not() chain */ html body section h2:not(.cm-hero__title):not(.fc-hero__title):not(.cm-cd__title):not(.fc-coll__card-name):not(.fc-shop__card-name):not(.fc-pcard-name):not(.fc-pcard__name):not(.fc-pcarousel__card-name):not(.fc-pcarousel__name):not(.fc-product-card__title):not(.fc-bundle__name):not(.cm-featured__heading):not(.cm-categories__title):not(.cm-split-story__title):not(.cm-split-benefits__title):not(.cm-problems__title):not(.cm-reviews__title):not(.cm-faq__title):not(.cm-footer__col-title):not(.__fcq_spec_0):not(.__fcq_spec_1):not(.__fcq_spec_2):not(.__fcq_spec_3):not(.__fcq_spec_4):not(.__fcq_spec_5):not(.__fcq_spec_6):not(.__fcq_spec_7):not(.__fcq_spec_8):not(.__fcq_spec_9):not(.__fcq_spec_10):not(.__fcq_spec_11):not(.__fcq_spec_12):not(.__fcq_spec_13):not(.__fcq_spec_14):not(.__fcq_spec_15):not(.__fcq_spec_16):not(.__fcq_spec_17):not(.__fcq_spec_18):not(.__fcq_spec_19):not(.__fcq_spec_20):not(.__fcq_spec_21):not(.__fcq_spec_22):not(.__fcq_spec_23):not(.__fcq_spec_24):not(.cm-featured__heading):not(.cm-categories__title):not(.cm-split-story__title):not(.cm-split-benefits__title):not(.cm-problems__title):not(.cm-reviews__title):not(.cm-faq__title):not(.cm-footer__col-title) { font-family: 'Playfair Display', Georgia, serif !important; font-size: clamp(22px, 2.4vw, 34px) !important; font-weight: 600 !important; line-height: 1.2 !important; letter-spacing: 0.005em !important; color: #0F1628 !important; margin: 0 0 14px 0 !important; } @media (max-width: 860px) { html body section h2:not(.cm-hero__title):not(.fc-hero__title):not(.cm-cd__title):not(.fc-coll__card-name):not(.fc-shop__card-name):not(.fc-pcard-name):not(.fc-pcard__name):not(.fc-pcarousel__card-name):not(.fc-pcarousel__name):not(.fc-product-card__title):not(.fc-bundle__name):not(.cm-featured__heading):not(.cm-categories__title):not(.cm-split-story__title):not(.cm-split-benefits__title):not(.cm-problems__title):not(.cm-reviews__title):not(.cm-faq__title):not(.cm-footer__col-title):not(.__fcq_spec_0):not(.__fcq_spec_1):not(.__fcq_spec_2):not(.__fcq_spec_3):not(.__fcq_spec_4):not(.__fcq_spec_5):not(.__fcq_spec_6):not(.__fcq_spec_7):not(.__fcq_spec_8):not(.__fcq_spec_9):not(.__fcq_spec_10):not(.__fcq_spec_11):not(.__fcq_spec_12):not(.__fcq_spec_13):not(.__fcq_spec_14):not(.__fcq_spec_15):not(.__fcq_spec_16):not(.__fcq_spec_17):not(.__fcq_spec_18):not(.__fcq_spec_19):not(.__fcq_spec_20):not(.__fcq_spec_21):not(.__fcq_spec_22):not(.__fcq_spec_23):not(.__fcq_spec_24):not(.cm-featured__heading):not(.cm-categories__title):not(.cm-split-story__title):not(.cm-split-benefits__title):not(.cm-problems__title):not(.cm-reviews__title):not(.cm-faq__title):not(.cm-footer__col-title) { font-size: 22px !important; line-height: 1.22 !important; margin: 0 0 10px 0 !important; } } /* ============================================================ FC TYPOGRAPHY FIX v1 — kill oversized titles everywhere ============================================================ */ /* UNIVERSAL H2 CAP */ html body section h2:not(.cm-hero__title):not(.fc-hero__title):not(.cm-cd__title):not(.fc-coll__card-name):not(.fc-shop__card-name):not(.fc-pcard-name):not(.fc-pcard__name):not(.fc-pcarousel__card-name):not(.fc-pcarousel__name):not(.fc-product-card__title):not(.fc-bundle__name):not(.cm-featured__heading):not(.cm-categories__title):not(.cm-split-story__title):not(.cm-split-benefits__title):not(.cm-problems__title):not(.cm-reviews__title):not(.cm-faq__title):not(.cm-footer__col-title) { font-family: 'Playfair Display', Georgia, 'Times New Roman', serif !important; font-size: clamp(22px, 2.4vw, 34px) !important; font-weight: 600 !important; line-height: 1.2 !important; letter-spacing: 0.005em !important; color: #0F1628 !important; margin: 0 0 14px 0 !important; } @media (max-width: 860px) { html body section h2:not(.cm-hero__title):not(.fc-hero__title):not(.cm-cd__title):not(.fc-coll__card-name):not(.fc-shop__card-name):not(.fc-pcard-name):not(.fc-pcard__name):not(.fc-pcarousel__card-name):not(.fc-pcarousel__name):not(.fc-product-card__title):not(.fc-bundle__name):not(.cm-featured__heading):not(.cm-categories__title):not(.cm-split-story__title):not(.cm-split-benefits__title):not(.cm-problems__title):not(.cm-reviews__title):not(.cm-faq__title):not(.cm-footer__col-title) { font-size: 22px !important; line-height: 1.22 !important; margin: 0 0 10px 0 !important; } } html body section h3:not(.cm-hero__sub):not(.fc-hero__sub) { font-size: clamp(14px, 1.2vw, 17px) !important; font-weight: 600 !important; line-height: 1.3 !important; } @media (max-width: 860px) { html body section h3:not(.cm-hero__sub):not(.fc-hero__sub) { font-size: 13.5px !important; } } @media (min-width: 861px) { body section .fc-coll__card-name, body section h2.fc-coll__card-name, body .fc-coll__card .fc-coll__card-name, body section .fc-shop__card-name, body section h2.fc-shop__card-name, body section .fc-pcard-name, body section .fc-pcard__name, body section .fc-pcarousel__card-name, body section .fc-pcarousel__name, body section .fc-product-card__title, body section .fc-bundle__name { font-family: 'Playfair Display', Georgia, serif !important; font-size: 15px !important; font-weight: 600 !important; line-height: 1.35 !important; letter-spacing: 0.01em !important; text-transform: none !important; color: #0F1628 !important; margin: 0 0 4px 0 !important; padding: 0 !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; min-height: 2.7em !important; text-align: left !important; } body section .fc-coll__card-name a, body section .fc-shop__card-name a, body section .fc-pcard-name a, body section .fc-pcard__name a, body section .fc-pcarousel__card-name a { font-size: inherit !important; font-weight: inherit !important; font-family: inherit !important; line-height: inherit !important; color: inherit !important; text-decoration: none !important; } } @media (max-width: 860px) { body section .fc-coll__card-name, body section h2.fc-coll__card-name, body .fc-coll__card .fc-coll__card-name, body section .fc-shop__card-name, body section .fc-pcard-name, body section .fc-pcard__name, body section .fc-pcarousel__card-name, body section .fc-pcarousel__name, body section .fc-product-card__title, body section .fc-bundle__name { font-family: 'Playfair Display', Georgia, serif !important; font-size: 12.5px !important; font-weight: 600 !important; line-height: 1.3 !important; letter-spacing: 0.01em !important; text-transform: none !important; color: #0F1628 !important; margin: 0 0 3px 0 !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; min-height: 2.6em !important; text-align: left !important; } } /* CARD PRICES */ @media (min-width: 861px) { body section .fc-coll__card-price, body section .fc-shop__card-price, body section .fc-pcard-price, body section .fc-pcard__price, body section .fc-pcarousel__card-price { font-size: 15px !important; font-weight: 700 !important; color: #0F1628 !important; letter-spacing: 0.01em !important; font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important; } body section .fc-coll__card-compare, body section .fc-shop__card-compare, body section .fc-pcard-compare { font-size: 12px !important; color: #8B8B8B !important; text-decoration: line-through !important; font-weight: 500 !important; margin-left: 6px !important; } } @media (max-width: 860px) { body section .fc-coll__card-price, body section .fc-shop__card-price, body section .fc-pcard-price, body section .fc-pcard__price, body section .fc-pcarousel__card-price { font-size: 13px !important; font-weight: 700 !important; } body section .fc-coll__card-compare, body section .fc-shop__card-compare, body section .fc-pcard-compare { font-size: 10.5px !important; } } /* CARD BUTTONS */ @media (min-width: 861px) { body section .fc-coll__card-btn, body section .fc-shop__card-btn, body section .fc-pcard-btn, body section .fc-pcard__btn { font-size: 12px !important; font-weight: 600 !important; padding: 9px 14px !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; border-radius: 999px !important; background: #0F1628 !important; color: #ffffff !important; border: none !important; cursor: pointer !important; transition: background 0.2s ease !important; width: 100% !important; text-align: center !important; display: block !important; margin-top: auto !important; } body section .fc-coll__card-btn:hover, body section .fc-shop__card-btn:hover { background: #1A2238 !important; } } @media (max-width: 860px) { body section .fc-coll__card-btn, body section .fc-shop__card-btn, body section .fc-pcard-btn, body section .fc-pcard__btn { font-size: 10.5px !important; padding: 7px 10px !important; letter-spacing: 0.06em !important; min-height: 36px !important; } } /* CARD SPACING */ @media (min-width: 861px) { body .fc-coll__card, body .fc-shop__card { padding: 12px !important; gap: 6px !important; } body .fc-coll__card-img, body .fc-shop__card-img { aspect-ratio: 1 / 1 !important; width: 100% !important; overflow: hidden !important; border-radius: 6px !important; background: #F7F4EE !important; } body .fc-coll__card-img img, body .fc-shop__card-img img { width: 100% !important; height: 100% !important; object-fit: contain !important; padding: 8px !important; } body .fc-coll__card-info, body .fc-shop__card-info { padding-top: 8px !important; display: flex !important; flex-direction: column !important; flex: 1 1 auto !important; gap: 4px !important; } } @media (max-width: 860px) { body .fc-coll__card, body .fc-shop__card { padding: 8px !important; gap: 4px !important; } body .fc-coll__card-img, body .fc-shop__card-img { aspect-ratio: 1 / 1 !important; border-radius: 4px !important; background: #F7F4EE !important; } body .fc-coll__card-img img, body .fc-shop__card-img img { object-fit: contain !important; padding: 6px !important; } } /* SECTION SPACING */ @media (min-width: 861px) { body .fc-coll, body .fc-shop, body .fc-pcarousel, body .fc-materials, body .fc-vs, body .fc-usp, body .fc-reviews, body .fc-faq, body .fc-storia, body .fc-newsletter, body .fc-vshow, body .fc-hero4, body .fc-tagdanger, body .fc-paystrip { padding-top: 60px !important; padding-bottom: 60px !important; } body .fc-coll__grid, body .fc-shop__grid { max-width: 1400px !important; margin: 0 auto !important; padding: 0 24px !important; } } @media (max-width: 860px) { body .fc-coll, body .fc-shop, body .fc-pcarousel, body .fc-materials, body .fc-vs, body .fc-usp, body .fc-reviews, body .fc-faq, body .fc-storia, body .fc-newsletter, body .fc-vshow, body .fc-hero4, body .fc-tagdanger, body .fc-paystrip { padding-top: 32px !important; padding-bottom: 32px !important; } html body .fc-coll__grid, html body .fc-shop__grid { display: grid !important; grid-template-columns: repeat(2, 1fr) !important; gap: 10px !important; padding: 0 10px !important; } } /* MOBILE PREMIUM POLISH */ @media (max-width: 860px) { html body section { scroll-margin-top: 72px; } html body .fc-pcarousel__track, html body .fc-pcarousel-track { scroll-snap-type: x mandatory !important; -webkit-overflow-scrolling: touch !important; scrollbar-width: none !important; } html body .fc-pcarousel__track::-webkit-scrollbar, html body .fc-pcarousel-track::-webkit-scrollbar { display: none !important; } html body .fc-pcarousel__card, html body .fc-pcarousel-card { scroll-snap-align: start !important; } } /* ===== fc-mobile-final-premium.css ===== */ /* ============================================================ FC MOBILE PREMIUM FINAL — safe-area, transitions, subtle shadows Mirrors Apple / Zalando / Airbnb mobile patterns ============================================================ */ /* Safe-area insets for notched devices */ @supports (padding: env(safe-area-inset-bottom)) { @media (max-width: 860px) { body { padding-bottom: env(safe-area-inset-bottom) !important; } .fc-sticky-atc, .fc-sticky-atc-section { padding-bottom: calc(10px + env(safe-area-inset-bottom)) !important; } } } /* Smooth scroll everywhere */ html { scroll-behavior: smooth !important; -webkit-text-size-adjust: 100%; } /* Mobile-only polish */ @media (max-width: 860px) { /* Premium subtle card shadow — like Zalando */ html body .fc-coll__card, html body .fc-shop__card, html body .fc-pcard, html body .fc-pcarousel__card { background: #ffffff !important; border-radius: 12px !important; box-shadow: 0 1px 2px rgba(15,22,40,0.04), 0 2px 8px rgba(15,22,40,0.03) !important; border: 1px solid rgba(15,22,40,0.05) !important; transition: transform 0.18s ease, box-shadow 0.18s ease !important; } html body .fc-coll__card:active, html body .fc-shop__card:active { transform: scale(0.985) !important; box-shadow: 0 1px 2px rgba(15,22,40,0.06) !important; } /* Tighter mobile section rhythm */ html body section.fc-section, html body section[class*="fc-"], html body section[class*="cm-"] { scroll-margin-top: 70px !important; } /* Premium button feel — subtle press state */ html body section .fc-coll__card-btn, html body section .fc-shop__card-btn, html body button.fc-prod__atc, html body button[type="submit"].fc-prod__btn { transition: transform 0.12s ease, background 0.18s ease, box-shadow 0.18s ease !important; box-shadow: 0 1px 2px rgba(15,22,40,0.08) !important; } html body section .fc-coll__card-btn:active, html body section .fc-shop__card-btn:active, html body button.fc-prod__atc:active { transform: scale(0.97) !important; } /* Mobile-first hero sizing control */ html body .fc-hero4__title, html body .cm-hero__title, html body .fc-hero__title { font-size: clamp(28px, 8vw, 40px) !important; line-height: 1.1 !important; letter-spacing: -0.02em !important; } /* Spacing between sections — consistent 32px gap */ html body section + section { margin-top: 0 !important; } /* Image rendering optimization */ html body img { image-rendering: -webkit-optimize-contrast !important; } /* Text selection color — premium accent */ html body ::selection { background: #C9A23A !important; color: #0F1628 !important; } /* Native-feeling scroll momentum */ html body .fc-pcarousel__track, html body .fc-pcarousel-track, html body [class*="scroll-x"], html body [class*="__track"] { -webkit-overflow-scrolling: touch !important; overscroll-behavior-x: contain !important; } /* Premium body font smoothing */ html body { -webkit-font-smoothing: antialiased !important; -moz-osx-font-smoothing: grayscale !important; text-rendering: optimizeLegibility !important; } /* Price emphasis — makes it instantly readable */ html body .fc-coll__card-price, html body .fc-shop__card-price, html body .fc-pcard__price { font-variant-numeric: tabular-nums !important; } /* Hide elements that break mobile */ html body .hide-on-mobile, html body [data-hide-mobile] { display: none !important; } /* Tap highlight — remove default grey, use brand gold tint */ html body a, html body button { -webkit-tap-highlight-color: rgba(201,162,58,0.12) !important; } /* Container max-width with consistent horizontal padding */ html body .fc-section__inner, html body .fc-materials__wrap, html body .fc-vs__wrap, html body .fc-reviews__wrap, html body .fc-faq__wrap, html body .fc-storia__wrap, html body .fc-newsletter__wrap, html body .fc-pcarousel__wrap { padding-left: 16px !important; padding-right: 16px !important; max-width: 100% !important; } /* FAQ items — premium chevron + spacing */ html body .fc-faq__item, html body details.fc-faq__item { border-bottom: 1px solid rgba(15,22,40,0.08) !important; padding: 12px 0 !important; } html body .fc-faq__item summary, html body .fc-faq__q { padding: 4px 0 !important; font-weight: 600 !important; font-size: 14.5px !important; } /* Reviews section — star + text sizing */ html body .fc-rev__stars, html body .fc-reviews__stars { font-size: 14px !important; } html body .fc-rev__body, html body .fc-reviews__body { font-size: 13.5px !important; line-height: 1.5 !important; } /* Storia section — readable paragraphs */ html body .fc-storia__body, html body .fc-storia__text p { font-size: 14px !important; line-height: 1.55 !important; color: #3A3A3A !important; } /* Newsletter input — bigger tap target */ html body .fc-nl__input, html body input[type="email"].fc-newsletter__input { min-height: 44px !important; font-size: 16px !important; /* 16px prevents iOS zoom */ } /* Paystrip — tighter on mobile */ html body .fc-paystrip { padding: 20px 0 !important; } html body .fc-paystrip__badge { min-width: 42px !important; height: 24px !important; } } /* ===== fc-regression-fix-v1.css ===== */ /* FC REGRESSION FIX v2 - Oro/Argento + header nav - full desktop+mobile gradient backstop */ /* 1. ORO / ARGENTO HERO CARDS - strip product-grid rules + force dark gradient */ html body .fc-coll__grid .fc-coll__card.fc-coll__card--oro, html body section .fc-coll__card.fc-coll__card--oro, html body .fc-coll__card--oro { padding: 0 !important; gap: 0 !important; box-shadow: none !important; border: 0 !important; border-radius: 12px !important; aspect-ratio: auto !important; min-height: auto !important; display: block !important; overflow: hidden !important; background: linear-gradient(135deg, #2a1f0e 0%, #1a1308 50%, #0d0a04 100%) !important; background-color: #1a1308 !important; position: relative !important; } html body .fc-coll__grid .fc-coll__card.fc-coll__card--argento, html body section .fc-coll__card.fc-coll__card--argento, html body .fc-coll__card--argento { padding: 0 !important; gap: 0 !important; box-shadow: none !important; border: 0 !important; border-radius: 12px !important; aspect-ratio: auto !important; min-height: auto !important; display: block !important; overflow: hidden !important; background: linear-gradient(135deg, #2a2f3a 0%, #1a1e27 50%, #0d1015 100%) !important; background-color: #1a1e27 !important; position: relative !important; } @media (max-width: 860px) { html body .fc-coll__card--oro, html body .fc-coll__card--argento { border-radius: 10px !important; } } /* Content wrapper padding inside the hero cards */ html body .fc-coll__card--oro .fc-coll__card-content, html body .fc-coll__card--argento .fc-coll__card-content { padding: 40px 32px !important; display: flex !important; flex-direction: column !important; justify-content: flex-end !important; min-height: 460px !important; height: 100% !important; position: relative !important; z-index: 2 !important; gap: 0 !important; } @media (max-width: 860px) { html body .fc-coll__card--oro .fc-coll__card-content, html body .fc-coll__card--argento .fc-coll__card-content { padding: 28px 22px !important; min-height: 360px !important; } } /* Icon - decorative circle (no img inside) */ html body .fc-coll__card--oro .fc-coll__card-icon, html body .fc-coll__card--argento .fc-coll__card-icon { width: 56px !important; height: 56px !important; margin: 0 0 auto 0 !important; display: block !important; min-height: 0 !important; padding: 0 !important; position: absolute !important; top: 32px !important; left: 32px !important; z-index: 3 !important; } @media (max-width: 860px) { html body .fc-coll__card--oro .fc-coll__card-icon, html body .fc-coll__card--argento .fc-coll__card-icon { top: 22px !important; left: 22px !important; width: 46px !important; height: 46px !important; } } /* Label (COLLEZIONE) */ html body .fc-coll__card--oro .fc-coll__card-label, html body .fc-coll__card--argento .fc-coll__card-label, html body section .fc-coll__card--oro .fc-coll__card-label, html body section .fc-coll__card--argento .fc-coll__card-label { font-family: 'DM Sans', 'Inter', sans-serif !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: 0.32em !important; text-transform: uppercase !important; color: rgba(255, 255, 255, 0.72) !important; margin: 0 0 14px 0 !important; line-height: 1 !important; -webkit-line-clamp: unset !important; min-height: 0 !important; display: block !important; -webkit-box-orient: initial !important; overflow: visible !important; background: transparent !important; } /* Name - big serif white */ html body .fc-coll__card--oro .fc-coll__card-name, html body .fc-coll__card--argento .fc-coll__card-name, html body section .fc-coll__card--oro .fc-coll__card-name, html body section .fc-coll__card--argento .fc-coll__card-name, html body section h2.fc-coll__card-name.fc-coll__card--oro, html body section h2.fc-coll__card-name.fc-coll__card--argento { font-family: 'Playfair Display', Georgia, serif !important; font-size: clamp(30px, 3.2vw, 46px) !important; font-weight: 600 !important; line-height: 1.08 !important; letter-spacing: 0.005em !important; color: #ffffff !important; margin: 0 0 16px 0 !important; text-align: left !important; display: block !important; -webkit-line-clamp: unset !important; -webkit-box-orient: initial !important; overflow: visible !important; min-height: 0 !important; text-transform: none !important; background: transparent !important; } @media (max-width: 860px) { html body .fc-coll__card--oro .fc-coll__card-name, html body .fc-coll__card--argento .fc-coll__card-name { font-size: 28px !important; margin: 0 0 12px 0 !important; } } /* Description */ html body .fc-coll__card--oro .fc-coll__card-desc, html body .fc-coll__card--argento .fc-coll__card-desc, html body section .fc-coll__card--oro .fc-coll__card-desc, html body section .fc-coll__card--argento .fc-coll__card-desc { font-family: 'Inter', 'DM Sans', sans-serif !important; font-size: 15px !important; line-height: 1.6 !important; color: rgba(255, 255, 255, 0.82) !important; margin: 0 0 24px 0 !important; font-weight: 400 !important; letter-spacing: 0.005em !important; -webkit-line-clamp: unset !important; -webkit-box-orient: initial !important; overflow: visible !important; min-height: 0 !important; display: block !important; background: transparent !important; } @media (max-width: 860px) { html body .fc-coll__card--oro .fc-coll__card-desc, html body .fc-coll__card--argento .fc-coll__card-desc { font-size: 14px !important; margin: 0 0 20px 0 !important; } } /* CTA button - ghost/outlined pill */ html body .fc-coll__card--oro .fc-coll__card-btn, html body .fc-coll__card--argento .fc-coll__card-btn, html body section .fc-coll__card--oro .fc-coll__card-btn, html body section .fc-coll__card--argento .fc-coll__card-btn { font-family: 'DM Sans', 'Inter', sans-serif !important; font-size: 12px !important; font-weight: 600 !important; letter-spacing: 0.22em !important; text-transform: uppercase !important; padding: 14px 30px !important; border-radius: 999px !important; background: transparent !important; color: #ffffff !important; border: 1px solid rgba(255, 255, 255, 0.72) !important; display: inline-block !important; width: auto !important; text-align: center !important; margin: 0 !important; min-height: 0 !important; align-self: flex-start !important; transition: background 0.22s ease, color 0.22s ease, border-color 0.22s ease !important; cursor: pointer !important; } html body .fc-coll__card--oro .fc-coll__card-btn:hover, html body .fc-coll__card--argento .fc-coll__card-btn:hover { background: #ffffff !important; color: #0F1628 !important; border-color: #ffffff !important; } @media (max-width: 860px) { html body .fc-coll__card--oro .fc-coll__card-btn, html body .fc-coll__card--argento .fc-coll__card-btn { padding: 12px 22px !important; font-size: 11px !important; letter-spacing: 0.18em !important; } } /* Overlay */ html body .fc-coll__card--oro .fc-coll__card-overlay, html body .fc-coll__card--argento .fc-coll__card-overlay { position: absolute !important; inset: 0 !important; z-index: 1 !important; pointer-events: none !important; } /* Grid */ @media (min-width: 861px) { html body section.fc-collections-section .fc-coll__grid, html body .fc-collections-section .fc-coll__grid { display: grid !important; grid-template-columns: repeat(2, 1fr) !important; gap: 20px !important; max-width: 1200px !important; margin: 0 auto !important; padding: 0 24px !important; } } @media (max-width: 860px) { html body section.fc-collections-section .fc-coll__grid, html body .fc-collections-section .fc-coll__grid { display: grid !important; grid-template-columns: 1fr !important; gap: 14px !important; padding: 0 16px !important; } } /* 2. HEADER NAV */ @media (min-width: 861px) { html body header.fc-section-header .fc-header-nav, html body .fc-section-header .fc-header-nav { display: flex !important; flex-wrap: nowrap !important; align-items: center !important; gap: clamp(16px, 2vw, 28px) !important; white-space: nowrap !important; } html body header.fc-section-header .fc-header-nav a, html body .fc-section-header .fc-header-nav a, html body header.fc-section-header .fc-header-nav > * a, html body .fc-section-header .fc-header-nav > * a { white-space: nowrap !important; display: inline-block !important; font-size: 14px !important; font-weight: 500 !important; letter-spacing: 0.02em !important; line-height: 1 !important; padding: 8px 0 !important; text-decoration: none !important; color: #0F1628 !important; transition: color 0.18s ease !important; } html body header.fc-section-header .fc-header-nav a:hover, html body .fc-section-header .fc-header-nav a:hover { color: #C9A23A !important; } html body header.fc-section-header .fc-header-nav > *, html body .fc-section-header .fc-header-nav > * { white-space: nowrap !important; flex-shrink: 0 !important; } } @media (min-width: 861px) and (max-width: 1100px) { html body header.fc-section-header .fc-header-nav, html body .fc-section-header .fc-header-nav { gap: 14px !important; } html body header.fc-section-header .fc-header-nav a, html body .fc-section-header .fc-header-nav a { font-size: 13px !important; } } html body .fc-header-nav, html body .fc-header-nav > *, html body .fc-header-nav a, html body .fc-header-nav li, html body .fc-header-nav span { white-space: nowrap !important; } /* CM-COLL-MOBILE-V3 - mobile radial gradient redesign (26 apr) */ @media (max-width: 768px) { html body section .fc-coll__heading, html body .fc-coll__heading { padding: 28px 12px 18px !important; background: #fff !important; } html body section .fc-coll__subtitle, html body .fc-coll__subtitle { font-size: 10px !important; letter-spacing: 2px !important; color: #c9a46c !important; margin-bottom: 8px !important; font-family: 'DM Sans', sans-serif !important; } html body section .fc-coll__title, html body .fc-coll__title { font-size: 22px !important; line-height: 1.15 !important; letter-spacing: .5px !important; color: #0b1020 !important; max-width: 300px !important; margin: 0 auto !important; font-family: 'Playfair Display', serif !important; } html body section.fc-collections-section .fc-coll__grid, html body .fc-collections-section .fc-coll__grid, html body section .fc-coll .fc-coll__grid, html body .fc-coll .fc-coll__grid, html body .fc-coll__grid { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 10px !important; padding: 0 12px 24px !important; min-height: auto !important; background: #fff !important; } html body .fc-coll__divider { display: none !important; } html body section .fc-coll__card, html body .fc-coll__grid .fc-coll__card.fc-coll__card--oro, html body section .fc-coll__card.fc-coll__card--oro, html body .fc-coll__card--oro, html body .fc-coll__grid .fc-coll__card.fc-coll__card--argento, html body section .fc-coll__card.fc-coll__card--argento, html body .fc-coll__card--argento { flex: none !important; position: relative !important; height: 280px !important; min-height: 280px !important; max-height: 280px !important; border-radius: 12px !important; overflow: hidden !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: flex-end !important; padding: 16px 10px !important; transition: none !important; aspect-ratio: auto !important; box-shadow: none !important; border: 0 !important; } html body .fc-coll__grid .fc-coll__card.fc-coll__card--oro, html body section .fc-coll__card.fc-coll__card--oro, html body .fc-coll__card--oro { background: radial-gradient(circle at 50% 30%, #5a5044 0%, #1d1914 45%, #020202 100%) !important; } html body .fc-coll__grid .fc-coll__card.fc-coll__card--argento, html body section .fc-coll__card.fc-coll__card--argento, html body .fc-coll__card--argento { background: radial-gradient(circle at 50% 30%, #707985 0%, #252b36 45%, #05070b 100%) !important; } html body .fc-coll__card .fc-coll__card-overlay, html body section .fc-coll__card-overlay, html body .fc-coll__card-overlay { display: none !important; } /* Circle: top-centered with translateX */ html body .fc-coll__card--oro .fc-coll__card-icon, html body .fc-coll__card--argento .fc-coll__card-icon, html body section .fc-coll__card-icon, html body .fc-coll__card-icon { position: absolute !important; top: 42px !important; left: 50% !important; transform: translateX(-50%) !important; width: 46px !important; height: 46px !important; border-radius: 50% !important; border: 2px solid rgba(255,255,255,.45) !important; background: transparent !important; display: block !important; margin: 0 !important; padding: 0 !important; z-index: 3 !important; } html body .fc-coll__card--oro .fc-coll__card-icon { border-color: rgba(201,164,108,.85) !important; } /* Card content */ html body .fc-coll__card--oro .fc-coll__card-content, html body .fc-coll__card--argento .fc-coll__card-content, html body section .fc-coll__card-content, html body .fc-coll__card-content { position: relative !important; z-index: 2 !important; text-align: center !important; padding: 0 !important; width: auto !important; max-width: none !important; min-height: 0 !important; height: auto !important; display: block !important; margin: 0 !important; gap: 0 !important; } html body section .fc-coll__card-label, html body .fc-coll__card--oro .fc-coll__card-label, html body .fc-coll__card--argento .fc-coll__card-label, html body .fc-coll__card-label { display: block !important; font-size: 8px !important; letter-spacing: 5px !important; margin: 0 0 8px !important; color: #fff !important; text-transform: uppercase !important; opacity: 1 !important; font-family: 'DM Sans', sans-serif !important; font-weight: 500 !important; } body section .fc-coll__card-name, body section h2.fc-coll__card-name, body .fc-coll__card .fc-coll__card-name, html body .fc-coll__card-name { margin: 0 0 16px !important; font-size: 28px !important; line-height: 1 !important; color: #fff !important; font-family: 'Playfair Display', serif !important; font-weight: 600 !important; white-space: nowrap !important; text-transform: none !important; letter-spacing: 0 !important; } html body .fc-coll__card-desc { display: none !important; } body section .fc-coll__card-btn, html body .fc-coll__card-btn { display: inline-block !important; min-width: 118px !important; padding: 11px 14px !important; border: 1px solid rgba(255,255,255,.85) !important; border-radius: 999px !important; background: transparent !important; color: #fff !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: 2px !important; text-transform: uppercase !important; text-align: center !important; font-family: 'DM Sans', sans-serif !important; min-height: auto !important; } } @media (max-width: 390px) { html body section .fc-coll__card, html body .fc-coll__card--oro, html body .fc-coll__card--argento { height: 250px !important; min-height: 250px !important; max-height: 250px !important; padding: 14px 8px !important; } html body .fc-coll__title { font-size: 20px !important; } body .fc-coll__card-name, html body .fc-coll__card-name { font-size: 24px !important; } body .fc-coll__card-btn, html body .fc-coll__card-btn { min-width: 105px !important; font-size: 10px !important; padding: 10px 12px !important; } } /* CM-COLL-MOBILE-V3-END */ /* CM-COLL-CQ - container queries so customizer preview also matches mobile (26 apr) */ html body .fc-coll, html body section.fc-collections-section, html body section.shopify-section[id*="fc-collections"] { container-type: inline-size !important; container-name: cmColl !important; } @container cmColl (max-width: 768px) { html body section .fc-coll__heading, html body .fc-coll__heading { padding: 28px 12px 18px !important; background: #fff !important; } html body .fc-coll__subtitle { font-size: 10px !important; letter-spacing: 2px !important; color: #c9a46c !important; margin-bottom: 8px !important; font-family: 'DM Sans', sans-serif !important; } html body .fc-coll__title { font-size: 22px !important; line-height: 1.15 !important; letter-spacing: .5px !important; color: #0b1020 !important; max-width: 300px !important; margin: 0 auto !important; font-family: 'Playfair Display', serif !important; } html body section.fc-collections-section .fc-coll__grid, html body .fc-collections-section .fc-coll__grid, html body section .fc-coll .fc-coll__grid, html body .fc-coll .fc-coll__grid, html body .fc-coll__grid { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 10px !important; padding: 0 12px 24px !important; min-height: auto !important; background: #fff !important; } html body .fc-coll__divider { display: none !important; } html body section .fc-coll__card, html body .fc-coll__grid .fc-coll__card.fc-coll__card--oro, html body section .fc-coll__card.fc-coll__card--oro, html body .fc-coll__card--oro, html body .fc-coll__grid .fc-coll__card.fc-coll__card--argento, html body section .fc-coll__card.fc-coll__card--argento, html body .fc-coll__card--argento { flex: none !important; position: relative !important; height: 280px !important; min-height: 280px !important; max-height: 280px !important; border-radius: 12px !important; overflow: hidden !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: flex-end !important; padding: 16px 10px !important; transition: none !important; aspect-ratio: auto !important; box-shadow: none !important; border: 0 !important; } html body .fc-coll__grid .fc-coll__card.fc-coll__card--oro, html body section .fc-coll__card.fc-coll__card--oro, html body .fc-coll__card--oro { background: radial-gradient(circle at 50% 30%, #5a5044 0%, #1d1914 45%, #020202 100%) !important; } html body .fc-coll__grid .fc-coll__card.fc-coll__card--argento, html body section .fc-coll__card.fc-coll__card--argento, html body .fc-coll__card--argento { background: radial-gradient(circle at 50% 30%, #707985 0%, #252b36 45%, #05070b 100%) !important; } html body .fc-coll__card-overlay { display: none !important; } html body .fc-coll__card--oro .fc-coll__card-icon, html body .fc-coll__card--argento .fc-coll__card-icon, html body section .fc-coll__card-icon, html body .fc-coll__card-icon { position: absolute !important; top: 42px !important; left: 50% !important; transform: translateX(-50%) !important; width: 46px !important; height: 46px !important; border-radius: 50% !important; border: 2px solid rgba(255,255,255,.45) !important; background: transparent !important; display: block !important; margin: 0 !important; padding: 0 !important; z-index: 3 !important; } html body .fc-coll__card--oro .fc-coll__card-icon { border-color: rgba(201,164,108,.85) !important; } html body .fc-coll__card--oro .fc-coll__card-content, html body .fc-coll__card--argento .fc-coll__card-content, html body section .fc-coll__card-content, html body .fc-coll__card-content { position: relative !important; z-index: 2 !important; text-align: center !important; padding: 0 !important; width: auto !important; max-width: none !important; min-height: 0 !important; height: auto !important; display: block !important; margin: 0 !important; gap: 0 !important; } html body section .fc-coll__card-label, html body .fc-coll__card-label { display: block !important; font-size: 8px !important; letter-spacing: 5px !important; margin: 0 0 8px !important; color: #fff !important; text-transform: uppercase !important; opacity: 1 !important; font-family: 'DM Sans', sans-serif !important; font-weight: 500 !important; } body section .fc-coll__card-name, body section h2.fc-coll__card-name, body .fc-coll__card .fc-coll__card-name, html body .fc-coll__card-name { margin: 0 0 16px !important; font-size: 28px !important; line-height: 1 !important; color: #fff !important; font-family: 'Playfair Display', serif !important; font-weight: 600 !important; white-space: nowrap !important; text-transform: none !important; letter-spacing: 0 !important; } html body .fc-coll__card-desc { display: none !important; } body section .fc-coll__card-btn, html body .fc-coll__card-btn { display: inline-block !important; min-width: 118px !important; padding: 11px 14px !important; border: 1px solid rgba(255,255,255,.85) !important; border-radius: 999px !important; background: transparent !important; color: #fff !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: 2px !important; text-transform: uppercase !important; text-align: center !important; font-family: 'DM Sans', sans-serif !important; min-height: auto !important; } } @container cmColl (max-width: 390px) { html body section .fc-coll__card, html body .fc-coll__card--oro, html body .fc-coll__card--argento { height: 250px !important; min-height: 250px !important; max-height: 250px !important; padding: 14px 8px !important; } html body .fc-coll__title { font-size: 20px !important; } body .fc-coll__card-name, html body .fc-coll__card-name { font-size: 24px !important; } body .fc-coll__card-btn, html body .fc-coll__card-btn { min-width: 105px !important; font-size: 10px !important; padding: 10px 12px !important; } } /* CM-COLL-CQ-END */ /* ===== fc-titaniopuro-match-v1.css ===== */ /* =========================================================== fc-titaniopuro-match-v1.css Aligns homepage sections to titaniopuro.it reference. Surgical visual fixes for hero, vshow, materials, carousel, storia, faq. NO changes to fc-collections (Oro/Argento). =========================================================== */ /* ---- 1. fc-hero: prevent product image from covering H1 ---- */ html body .fc-hero{ position:relative; min-height:clamp(520px, 70vh, 780px); overflow:hidden; background:#f6efe4; } html body .fc-hero__image-wrap{ position:absolute !important; inset:0 !important; width:100% !important; height:100% !important; z-index:0 !important; } html body .fc-hero__image-wrap img{ width:100% !important; height:100% !important; object-fit:cover !important; object-position:center center !important; display:block !important; } html body .fc-hero__overlay{ position:absolute !important; inset:0 !important; background:linear-gradient(180deg, rgba(20,15,8,0.25) 0%, rgba(20,15,8,0.55) 70%, rgba(20,15,8,0.75) 100%) !important; z-index:1 !important; pointer-events:none; } html body .fc-hero .page-width, html body .fc-hero__content{ position:relative !important; z-index:2 !important; } html body .fc-hero__content{ max-width:760px; padding:clamp(48px, 10vh, 120px) 0 clamp(48px, 8vh, 96px); color:#fff; } html body .fc-hero__badge{ display:inline-flex; align-items:center; gap:8px; background:rgba(255,255,255,0.14); backdrop-filter:blur(6px); padding:8px 16px; border-radius:999px; font:500 12px/1 "DM Sans", sans-serif; letter-spacing:0.08em; text-transform:uppercase; color:#fff; margin-bottom:20px; } html body .fc-hero__badge .stars{color:#e9c67a;letter-spacing:2px} html body .fc-hero__title{ font:700 clamp(36px, 5.2vw, 68px)/1.08 "Playfair Display", serif !important; color:#fff !important; margin:0 0 18px !important; letter-spacing:-0.01em; text-shadow:0 2px 24px rgba(0,0,0,0.4); } html body .fc-hero__subtitle{ font:400 clamp(15px, 1.3vw, 19px)/1.55 "Inter", sans-serif !important; color:rgba(255,255,255,0.92) !important; margin:0 0 28px !important; max-width:560px; } html body .fc-hero__features{ list-style:none; padding:0; margin:0 0 32px; display:flex; flex-wrap:wrap; gap:14px 24px; } html body .fc-hero__features li{ display:inline-flex; align-items:center; gap:8px; font:500 13px/1 "DM Sans", sans-serif; color:rgba(255,255,255,0.94); letter-spacing:0.02em; } html body .fc-hero__features .check{ display:inline-flex; width:18px;height:18px; align-items:center;justify-content:center; background:rgba(233,198,122,0.22); border-radius:50%; } html body .fc-hero__features .check svg{ width:11px;height:11px; stroke:#e9c67a;stroke-width:3;fill:none; } /* ---- 2. fc-video-showcase: force video to fill and be visible ---- */ html body .fc-vshow{ background:#f6efe4; padding:clamp(48px, 8vw, 96px) clamp(16px, 4vw, 48px); } html body .fc-vshow__inner{ max-width:1240px; margin:0 auto; display:grid !important; grid-template-columns:minmax(0, 1.1fr) minmax(0, 1fr) !important; gap:clamp(24px, 4vw, 64px) !important; align-items:center !important; } html body .fc-vshow__media{ position:relative; width:100% !important; aspect-ratio:9 / 16; max-height:720px; border-radius:20px; overflow:hidden; background:#0d1220; box-shadow:0 24px 60px -20px rgba(13,18,32,0.35); } html body .fc-vshow__media video, html body .fc-vshow__video{ position:absolute !important; inset:0 !important; width:100% !important; height:100% !important; object-fit:cover !important; display:block !important; } @media (max-width: 860px){ html body .fc-vshow__inner{ grid-template-columns:1fr !important; } html body .fc-vshow__media{ aspect-ratio:9/14; max-height:560px; } } /* ---- 3. fc-materials: fix cramped card widths ---- */ html body .fc-materials{ background:#f6efe4; padding:clamp(56px, 8vw, 96px) clamp(16px, 4vw, 48px); } html body .fc-materials__container{ max-width:1240px; margin:0 auto; } html body .fc-materials__content{ text-align:center; margin-bottom:clamp(32px, 5vw, 56px); } html body .fc-materials__title{ font:700 clamp(28px, 3.6vw, 44px)/1.15 "Playfair Display", serif !important; margin:0 0 12px !important; color:#1a1208; } html body .fc-materials__sub, html body .fc-materials__subtitle, html body .fc-materials__content > p{ font:400 clamp(14px, 1.1vw, 16px)/1.55 "Inter", sans-serif !important; color:#6e5a3b; max-width:620px; margin:0 auto; } html body .fc-materials__grid{ display:grid !important; grid-template-columns:repeat(5, minmax(0, 1fr)) !important; gap:16px !important; align-items:stretch; } html body .fc-materials__card, html body .fc-materials__item, html body .fc-materials__layer{ background:#fff !important; border-radius:14px !important; padding:28px 20px !important; min-height:220px !important; display:flex !important; flex-direction:column !important; gap:10px !important; border-left:4px solid #c9a268 !important; box-shadow:0 8px 20px -12px rgba(26,18,8,0.10); } html body .fc-materials__card h3, html body .fc-materials__item h3, html body .fc-materials__layer h3, html body .fc-materials__card-title{ font:600 13px/1.3 "DM Sans", sans-serif !important; text-transform:uppercase; letter-spacing:0.08em; color:#1a1208; margin:0; word-break:normal !important; hyphens:none !important; overflow-wrap:normal !important; } html body .fc-materials__card p, html body .fc-materials__item p, html body .fc-materials__layer p{ font:400 13px/1.55 "Inter", sans-serif !important; color:#6e5a3b; margin:0; } html body .fc-materials__num{ font:700 28px/1 "Playfair Display", serif !important; color:#c9a268; } @media (max-width: 1024px){ html body .fc-materials__grid{ grid-template-columns:repeat(3, minmax(0, 1fr)) !important; } } @media (max-width: 640px){ html body .fc-materials__grid{ grid-template-columns:repeat(2, minmax(0, 1fr)) !important; gap:12px !important; } html body .fc-materials__card, html body .fc-materials__item, html body .fc-materials__layer{ min-height:180px !important; padding:20px 16px !important; } } /* ---- 4. fc-carousel (Una Padella. 10 Funzioni.): 5-col clean grid ---- */ html body .fc-carousel, html body #shopify-section-template--29283662758236__fc-carousel > section{ background:#14213d !important; padding:clamp(56px, 8vw, 96px) clamp(16px, 4vw, 48px) !important; } html body .fc-carousel__head, html body .fc-carousel__header{ text-align:center; color:#fff; margin-bottom:clamp(32px, 4vw, 48px); max-width:720px; margin-left:auto;margin-right:auto; } html body .fc-carousel__eyebrow{ font:500 11px/1 "DM Sans", sans-serif; letter-spacing:0.24em; text-transform:uppercase; color:#e9c67a; margin:0 0 12px; } html body .fc-carousel__title{ font:700 clamp(28px, 3.6vw, 44px)/1.15 "Playfair Display", serif !important; color:#fff !important; margin:0 0 10px !important; } html body .fc-carousel__sub, html body .fc-carousel__subtitle, html body .fc-carousel__head > p{ font:400 clamp(13px, 1vw, 15px)/1.55 "Inter", sans-serif !important; color:rgba(255,255,255,0.76) !important; margin:0; } html body .fc-carousel__track, html body .fc-carousel__grid, html body .fc-carousel__list{ display:grid !important; grid-template-columns:repeat(5, minmax(0, 1fr)) !important; gap:14px !important; max-width:1240px; margin:0 auto !important; overflow:visible !important; } html body .fc-carousel__card, html body .fc-carousel__slide, html body .fc-carousel__item{ background:rgba(255,255,255,0.04) !important; border:1px solid rgba(255,255,255,0.08) !important; border-radius:14px !important; padding:24px 16px !important; display:flex !important; flex-direction:column !important; align-items:center !important; text-align:center !important; gap:10px !important; min-height:200px !important; justify-content:center !important; transition:transform .25s ease, border-color .25s ease; } html body .fc-carousel__card:hover, html body .fc-carousel__slide:hover{ transform:translateY(-2px); border-color:rgba(233,198,122,0.4) !important; } html body .fc-carousel__icon{ width:56px;height:56px; border-radius:50%; background:rgba(233,198,122,0.12); display:flex;align-items:center;justify-content:center; color:#e9c67a; } html body .fc-carousel__icon svg{width:24px;height:24px;stroke:#e9c67a;fill:none;stroke-width:1.8} html body .fc-carousel__cname, html body .fc-carousel__card h3, html body .fc-carousel__slide h3{ font:600 13px/1.2 "DM Sans", sans-serif !important; text-transform:uppercase; letter-spacing:0.1em; color:#e9c67a !important; margin:0 !important; } html body .fc-carousel__card p, html body .fc-carousel__slide p, html body .fc-carousel__desc{ font:400 12px/1.45 "Inter", sans-serif !important; color:rgba(255,255,255,0.72) !important; margin:0 !important; } @media (max-width: 1024px){ html body .fc-carousel__track, html body .fc-carousel__grid, html body .fc-carousel__list{ grid-template-columns:repeat(3, minmax(0, 1fr)) !important; } } @media (max-width: 640px){ html body .fc-carousel__track, html body .fc-carousel__grid, html body .fc-carousel__list{ grid-template-columns:repeat(2, minmax(0, 1fr)) !important; gap:10px !important; } } /* ---- 5. fc-storia: split layout with kitchen image ---- */ html body .fc-storia{ background:#f6efe4 !important; padding:clamp(56px, 8vw, 96px) clamp(16px, 4vw, 48px) !important; } html body .fc-storia__container{ max-width:1240px; margin:0 auto; display:grid !important; grid-template-columns:minmax(0, 1fr) minmax(0, 1.1fr) !important; gap:clamp(32px, 5vw, 72px) !important; align-items:center !important; } html body .fc-storia__bg{display:none !important} html body .fc-storia__container::before{ content:""; display:block; width:100%; aspect-ratio:4/5; max-height:620px; background-image:url("https://cdn.shopify.com/s/files/1/0961/4118/1261/files/ChatGPTImage15mrt2026_14_57_30.png"); background-size:cover; background-position:center; border-radius:18px; box-shadow:0 24px 60px -24px rgba(26,18,8,0.25); order:1; } html body .fc-storia__content{ order:2; max-width:560px; } html body .fc-storia__eyebrow{ font:500 11px/1 "DM Sans", sans-serif !important; letter-spacing:0.24em; text-transform:uppercase; color:#c9a268 !important; margin:0 0 16px; } html body .fc-storia__title, html body #fc-storia-title{ font:700 clamp(30px, 3.8vw, 48px)/1.15 "Playfair Display", serif !important; color:#1a1208 !important; margin:0 0 18px !important; text-align:left !important; } html body .fc-storia__content p{ font:400 clamp(14px, 1.05vw, 16px)/1.7 "Inter", sans-serif !important; color:#4b3f2e !important; margin:0 0 14px !important; text-align:left !important; } html body .fc-storia__quote{ margin:24px 0 0 !important; padding:18px 22px !important; background:#fff !important; border-radius:12px !important; display:inline-flex !important; box-shadow:0 8px 24px -12px rgba(26,18,8,0.18); } @media (max-width: 860px){ html body .fc-storia__container{ grid-template-columns:1fr !important; } html body .fc-storia__container::before{ aspect-ratio:4/3; max-height:420px; } } /* ---- 6. fc-faq: split with texture image right ---- */ html body .fc-faq{ padding:clamp(56px, 8vw, 96px) clamp(16px, 4vw, 48px) !important; } html body .fc-faq__wrap, html body .fc-faq__container, html body .fc-faq > .page-width, html body .fc-faq > div{ max-width:1240px; margin:0 auto !important; } html body .fc-faq__grid, html body .fc-faq__layout{ display:grid !important; grid-template-columns:minmax(0, 1.2fr) minmax(0, 0.9fr) !important; gap:clamp(32px, 5vw, 72px) !important; align-items:start !important; } html body .fc-faq__aside::before{ content:""; display:block; width:100%; aspect-ratio:4/5; max-height:620px; background-image:url("https://cdn.shopify.com/s/files/1/0961/4118/1261/files/ChatGPTImage15mrt2026_14_57_30.png"); background-size:cover; background-position:center; border-radius:18px; position:sticky; top:100px; } @media (max-width: 860px){ html body .fc-faq__grid, html body .fc-faq__layout{ grid-template-columns:1fr !important; } html body .fc-faq__aside{display:none !important} } /* ---- 7. Mobile-specific tightening ---- */ @media (max-width: 640px){ html body .fc-hero__content{ padding:clamp(32px, 8vh, 64px) 0 clamp(32px, 6vh, 48px); } html body .fc-hero__features{ gap:10px 16px; } } /* ===== fc-titaniopuro-match-v2.css ===== */ /* =========================================================== fc-titaniopuro-match-v2.css Targets the ACTUAL class names: - .fc-hero4 (not .fc-hero) - .fc-materials__layers (not .fc-materials__grid) =========================================================== */ /* ---- HERO (fc-hero4) ---- */ html body .fc-hero4{ position:relative !important; min-height:clamp(520px, 70vh, 780px) !important; overflow:hidden !important; background:#f6efe4; display:flex !important; align-items:center !important; } html body .fc-hero4__bg{ position:absolute !important; inset:0 !important; width:100% !important; height:100% !important; z-index:0 !important; } html body .fc-hero4__bg img, html body .fc-hero4__bg > picture img{ width:100% !important; height:100% !important; object-fit:cover !important; object-position:center center !important; display:block !important; position:absolute !important; inset:0 !important; } html body .fc-hero4__overlay{ position:absolute !important; inset:0 !important; background:linear-gradient(180deg, rgba(20,15,8,0.30) 0%, rgba(20,15,8,0.58) 60%, rgba(20,15,8,0.78) 100%) !important; z-index:1 !important; pointer-events:none; } html body .fc-hero4__content{ position:relative !important; z-index:2 !important; max-width:760px; margin:0 auto; padding:clamp(48px, 10vh, 120px) clamp(16px, 4vw, 32px) clamp(48px, 8vh, 96px) !important; color:#fff; text-align:center; } html body .fc-hero4__tag{ display:inline-flex !important; align-items:center !important; gap:8px !important; background:rgba(255,255,255,0.14); backdrop-filter:blur(6px); padding:8px 18px !important; border-radius:999px !important; font:500 11px/1 "DM Sans", sans-serif !important; letter-spacing:0.16em !important; text-transform:uppercase !important; color:#e9c67a !important; margin:0 auto 22px !important; } html body .fc-hero4__headline{ font:700 clamp(34px, 5.2vw, 68px)/1.08 "Playfair Display", serif !important; color:#fff !important; margin:0 auto 20px !important; letter-spacing:-0.01em !important; text-shadow:0 2px 24px rgba(0,0,0,0.35) !important; max-width:680px !important; } html body .fc-hero4__cta, html body .fc-hero4 .fc-hero4__cta{ display:inline-flex !important; align-items:center;justify-content:center; background:#c9a268 !important; color:#fff !important; padding:16px 34px !important; border-radius:999px !important; font:600 13px/1 "DM Sans", sans-serif !important; text-transform:uppercase !important; letter-spacing:0.16em !important; border:0 !important; box-shadow:0 12px 28px -10px rgba(26,18,8,0.45) !important; transition:transform .2s ease, box-shadow .2s ease, background .2s ease !important; text-decoration:none !important; } html body .fc-hero4__cta:hover{ transform:translateY(-1px) !important; background:#d3ae74 !important; } /* Countdown sits below hero as a strip */ html body .fc-hero4-timer{ position:relative; z-index:2; background:rgba(20,15,8,0.82) !important; border-top:1px solid rgba(255,255,255,0.08); padding:16px clamp(16px, 4vw, 32px) !important; } html body .fc-hero4-timer__inner{ max-width:1200px; margin:0 auto; display:flex !important; align-items:center !important; justify-content:center !important; gap:18px !important; flex-wrap:wrap !important; } html body .fc-hero4-timer__label{ font:600 12px/1 "DM Sans", sans-serif !important; color:#e9c67a !important; letter-spacing:0.16em !important; text-transform:uppercase !important; } html body .fc-hero4-timer__countdown{ display:inline-flex !important; gap:6px !important; align-items:center; } html body .fc-hero4-timer__block{ background:#e9c67a !important; color:#1a1208 !important; padding:8px 10px !important; border-radius:8px !important; min-width:44px !important; text-align:center !important; display:flex !important; flex-direction:column !important; align-items:center !important; gap:2px !important; } html body .fc-hero4-timer__number{ font:700 16px/1 "DM Sans", sans-serif !important; color:#1a1208 !important; } html body .fc-hero4-timer__unit{ font:500 9px/1 "DM Sans", sans-serif !important; letter-spacing:0.1em; text-transform:uppercase; color:rgba(26,18,8,0.7) !important; } html body .fc-hero4-timer__sep{ color:#e9c67a !important; font:700 14px/1 "DM Sans", sans-serif !important; } @media (max-width: 640px){ html body .fc-hero4__content{ padding:clamp(40px, 9vh, 72px) clamp(16px, 4vw, 24px) clamp(40px, 6vh, 56px) !important; } html body .fc-hero4__headline{ font-size:clamp(28px, 8vw, 40px) !important; } } /* ---- MATERIALS (fc-materials__layers) ---- */ html body .fc-materials__container{ max-width:1240px !important; margin:0 auto !important; display:block !important; grid-template-columns:none !important; } html body .fc-materials__content{ text-align:center !important; margin-bottom:clamp(32px, 5vw, 56px) !important; } html body .fc-materials__layers{ display:grid !important; grid-template-columns:repeat(5, minmax(0, 1fr)) !important; gap:16px !important; align-items:stretch !important; max-width:1240px !important; margin:0 auto !important; } html body .fc-materials__layer, html body .fc-materials__layers > *{ background:#fff !important; border-radius:14px !important; padding:24px 16px !important; min-height:220px !important; display:flex !important; flex-direction:column !important; gap:10px !important; border-left:4px solid #c9a268 !important; box-shadow:0 8px 20px -12px rgba(26,18,8,0.10) !important; } html body .fc-materials__layer h3, html body .fc-materials__layer-title, html body .fc-materials__layers h3{ font:600 12px/1.35 "DM Sans", sans-serif !important; text-transform:uppercase !important; letter-spacing:0.08em !important; color:#1a1208 !important; margin:0 !important; word-break:keep-all !important; overflow-wrap:normal !important; hyphens:none !important; -webkit-hyphens:none !important; } html body .fc-materials__layer p, html body .fc-materials__layers p{ font:400 13px/1.55 "Inter", sans-serif !important; color:#6e5a3b !important; margin:0 !important; } html body .fc-materials__layer-num, html body .fc-materials__num{ font:700 28px/1 "Playfair Display", serif !important; color:#c9a268 !important; } @media (max-width: 1024px){ html body .fc-materials__layers{ grid-template-columns:repeat(3, minmax(0, 1fr)) !important; } } @media (max-width: 640px){ html body .fc-materials__layers{ grid-template-columns:repeat(2, minmax(0, 1fr)) !important; gap:12px !important; } html body .fc-materials__layer, html body .fc-materials__layers > *{ min-height:180px !important; padding:18px 14px !important; } } /* ===== fc-titaniopuro-match-v3.css ===== */ /* =========================================================== fc-titaniopuro-match-v3.css Fixes product card grid in fc-shop + any remaining polish. Clean 3-col desktop / 2-col tablet / 2-col mobile grid with square image wrappers and readable titles/prices. =========================================================== */ /* ---- SHOP GRID (fc-shop__grid) ---- */ html body .fc-shop__grid{ display:grid !important; grid-template-columns:repeat(3, minmax(0, 1fr)) !important; gap:clamp(16px, 2.2vw, 28px) !important; max-width:1240px !important; margin:0 auto !important; align-items:stretch !important; } html body .fc-shop__card{ display:flex !important; flex-direction:column !important; background:#fff !important; border-radius:14px !important; overflow:hidden !important; box-shadow:0 6px 22px -14px rgba(26,18,8,0.18) !important; transition:transform .25s ease, box-shadow .25s ease !important; height:100% !important; min-height:auto !important; } html body .fc-shop__card:hover{ transform:translateY(-2px) !important; box-shadow:0 16px 32px -16px rgba(26,18,8,0.22) !important; } html body .fc-shop__img-link{ display:block !important; width:100% !important; text-decoration:none !important; } html body .fc-shop__img{ position:relative !important; width:100% !important; aspect-ratio:1 / 1 !important; overflow:hidden !important; background:#f6efe4 !important; display:block !important; height:auto !important; } html body .fc-shop__img img{ width:100% !important; height:100% !important; object-fit:cover !important; object-position:center center !important; display:block !important; transition:transform .4s ease !important; } html body .fc-shop__card:hover .fc-shop__img img{ transform:scale(1.03) !important; } html body .fc-shop__info, html body .fc-shop__body, html body .fc-shop__content{ display:flex !important; flex-direction:column !important; gap:6px !important; padding:16px 16px 18px !important; flex:1 !important; } html body .fc-shop__name, html body .fc-shop__card h3, html body .fc-shop__card .fc-shop__product-title{ font:600 15px/1.35 "DM Sans", sans-serif !important; color:#1a1208 !important; margin:0 !important; letter-spacing:-0.005em !important; } html body .fc-shop__price, html body .fc-shop__card .price{ font:700 17px/1.2 "DM Sans", sans-serif !important; color:#c9a268 !important; margin-top:auto !important; } html body .fc-shop__price del, html body .fc-shop__compare-price{ font-weight:400 !important; color:#a59988 !important; text-decoration:line-through !important; margin-right:6px !important; } html body .fc-shop__cta, html body .fc-shop__button{ display:inline-flex !important; align-items:center !important; justify-content:center !important; margin-top:10px !important; padding:10px 18px !important; background:#1a1208 !important; color:#fff !important; border-radius:999px !important; font:600 11px/1 "DM Sans", sans-serif !important; letter-spacing:0.1em !important; text-transform:uppercase !important; text-decoration:none !important; border:0 !important; } @media (max-width: 1024px){ html body .fc-shop__grid{ grid-template-columns:repeat(2, minmax(0, 1fr)) !important; gap:16px !important; } } @media (max-width: 640px){ html body .fc-shop__grid{ grid-template-columns:repeat(2, minmax(0, 1fr)) !important; gap:12px !important; } html body .fc-shop__name{ font-size:13px !important; } html body .fc-shop__price{ font-size:15px !important; } html body .fc-shop__info, html body .fc-shop__body, html body .fc-shop__content{ padding:12px 12px 14px !important; } } /* ---- CAROUSEL tighten ---- */ html body .fc-carousel-section .fc-carousel__grid, html body .fc-carousel-section .fc-carousel__track, html body .fc-carousel-section .fc-carousel__list{ display:grid !important; grid-template-columns:repeat(5, minmax(0, 1fr)) !important; gap:16px !important; max-width:1240px !important; margin:0 auto !important; padding:0 clamp(16px, 4vw, 32px) !important; overflow:visible !important; } @media (max-width: 1024px){ html body .fc-carousel-section .fc-carousel__grid, html body .fc-carousel-section .fc-carousel__track, html body .fc-carousel-section .fc-carousel__list{ grid-template-columns:repeat(3, minmax(0, 1fr)) !important; } } @media (max-width: 640px){ html body .fc-carousel-section .fc-carousel__grid, html body .fc-carousel-section .fc-carousel__track, html body .fc-carousel-section .fc-carousel__list{ grid-template-columns:repeat(2, minmax(0, 1fr)) !important; gap:12px !important; } } /* ---- TRUST tighten ---- */ html body .fc-trust-section{ padding:clamp(32px, 5vw, 64px) clamp(16px, 4vw, 32px) !important; background:#f6efe4 !important; } html body .fc-trust-section > *{ max-width:1240px !important; margin-left:auto !important; margin-right:auto !important; } /* ---- Storia split layout polish ---- */ html body .fc-storia__container{ max-width:1240px !important; margin:0 auto !important; padding:clamp(48px, 7vw, 96px) clamp(16px, 4vw, 32px) !important; } html body .fc-storia__bg{ position:absolute !important; inset:0 !important; z-index:0 !important; opacity:0.06 !important; } /* ===== fc-titaniopuro-match-v4.css ===== */ /* =========================================================== fc-titaniopuro-match-v4.css Overrides fc-polish-master-v2.css rail mode on fc-shop__grid. Resets grid-auto-flow/auto-columns and forces a true 3-col wrap grid on desktop, 2-col on tablet/mobile. =========================================================== */ html body .fc-shop .fc-shop__grid, html body .fc-shop__grid, html body .fc-shop__grid[class][class][class]{ display:grid !important; grid-auto-flow:row !important; grid-auto-columns:auto !important; grid-template-columns:repeat(3, minmax(0, 1fr)) !important; grid-template-rows:auto !important; gap:clamp(16px, 2.2vw, 28px) !important; max-width:1240px !important; margin:0 auto !important; padding:0 clamp(16px, 3vw, 24px) !important; overflow-x:visible !important; overflow:visible !important; scroll-snap-type:none !important; align-items:stretch !important; } /* Kill rail mode on pcarousel too if it shows same symptom */ html body .fc-pcarousel .fc-pcarousel__grid, html body .fc-pcarousel__grid, html body .fc-pcarousel__rail, html body .fc-shop__rail{ grid-auto-flow:row !important; grid-auto-columns:auto !important; overflow-x:visible !important; scroll-snap-type:none !important; } html body .fc-shop__card, html body .fc-shop__card[class][class]{ scroll-snap-align:none !important; min-width:0 !important; width:auto !important; flex:initial !important; } /* Tablet 2-col */ @media (max-width: 1024px){ html body .fc-shop .fc-shop__grid, html body .fc-shop__grid, html body .fc-shop__grid[class][class][class]{ grid-template-columns:repeat(2, minmax(0, 1fr)) !important; gap:16px !important; } } /* Mobile 2-col tight */ @media (max-width: 640px){ html body .fc-shop .fc-shop__grid, html body .fc-shop__grid, html body .fc-shop__grid[class][class][class]{ grid-template-columns:repeat(2, minmax(0, 1fr)) !important; gap:12px !important; padding:0 12px !important; } } /* Carousel section — same reset so it's a real 5-col grid, not a rail */ html body .fc-carousel-section .fc-carousel__grid, html body .fc-carousel-section .fc-carousel__track, html body .fc-carousel-section .fc-carousel__list{ display:grid !important; grid-auto-flow:row !important; grid-auto-columns:auto !important; grid-template-columns:repeat(5, minmax(0, 1fr)) !important; gap:16px !important; max-width:1240px !important; margin:0 auto !important; padding:0 clamp(16px, 4vw, 32px) !important; overflow:visible !important; } @media (max-width: 1024px){ html body .fc-carousel-section .fc-carousel__grid, html body .fc-carousel-section .fc-carousel__track, html body .fc-carousel-section .fc-carousel__list{ grid-template-columns:repeat(3, minmax(0, 1fr)) !important; } } @media (max-width: 640px){ html body .fc-carousel-section .fc-carousel__grid, html body .fc-carousel-section .fc-carousel__track, html body .fc-carousel-section .fc-carousel__list{ grid-template-columns:repeat(2, minmax(0, 1fr)) !important; gap:12px !important; } } /* ===== fc-titaniopuro-match-v5.css ===== */ /* =========================================================== fc-titaniopuro-match-v5.css Header centering + visible cart icon. - .fc-header becomes a single full-width grid track so .fc-header-inner fills the whole 1400px container - Cart button: dark icon, no underline on de badge, tidy badge =========================================================== */ html body header.fc-section-header, html body .fc-section-header{ background:#fff !important; border-bottom:1px solid rgba(26,18,8,0.06) !important; } html body header.fc-header, html body .fc-header, html body .fc-header[class][class]{ display:grid !important; grid-template-columns:1fr !important; grid-template-rows:auto !important; max-width:1400px !important; width:100% !important; margin:0 auto !important; padding:14px clamp(16px, 3vw, 32px) !important; align-items:center !important; justify-items:stretch !important; } html body .fc-header-inner, html body .fc-header-inner[class][class]{ display:grid !important; grid-template-columns:1fr auto 1fr !important; align-items:center !important; gap:24px !important; width:100% !important; max-width:100% !important; margin:0 !important; padding:0 !important; justify-items:stretch !important; } /* Column 1: logo left (or hamburger + logo on mobile) */ html body .fc-header-logo{ justify-self:start !important; display:inline-flex !important; align-items:center !important; text-decoration:none !important; color:#1a1208 !important; } /* Column 2: nav centered */ html body .fc-header-nav{ justify-self:center !important; display:flex !important; align-items:center !important; gap:clamp(18px, 2.2vw, 34px) !important; } html body .fc-header-nav a{ font:500 14px/1 "DM Sans", sans-serif !important; color:#1a1208 !important; text-decoration:none !important; letter-spacing:0.02em !important; white-space:nowrap !important; transition:color .2s ease !important; } html body .fc-header-nav a:hover{ color:#c9a268 !important; } /* Column 3: cart right */ html body .fc-cart-btn, html body .fc-cart-btn[class][class]{ justify-self:end !important; position:relative !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; width:38px !important; height:38px !important; border-radius:50% !important; background:#1a1208 !important; color:#fff !important; text-decoration:none !important; transition:background .2s ease, transform .2s ease !important; } html body .fc-cart-btn:hover{ background:#c9a268 !important; transform:translateY(-1px) !important; } html body .fc-cart-btn svg{ width:18px !important; height:18px !important; stroke:#fff !important; color:#fff !important; display:block !important; } html body .fc-cart-count, html body .fc-cart-btn .fc-cart-count{ position:absolute !important; top:-3px !important; right:-3px !important; min-width:16px !important; height:16px !important; padding:0 4px !important; border-radius:8px !important; background:#c9a268 !important; color:#1a1208 !important; font:700 10px/1 "DM Sans", sans-serif !important; text-align:center !important; text-decoration:none !important; border:1.5px solid #fff !important; box-sizing:content-box !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; } /* Mobile: hamburger visible, nav hidden, compact grid */ @media (max-width: 860px){ html body .fc-header-inner, html body .fc-header-inner[class][class]{ grid-template-columns:auto 1fr auto !important; gap:12px !important; } html body .fc-hamburger{ display:inline-flex !important; flex-direction:column !important; justify-self:start !important; align-items:stretch !important; justify-content:space-between !important; width:24px !important; height:18px !important; border:0 !important; background:transparent !important; padding:0 !important; cursor:pointer !important; } html body .fc-header-logo{ justify-self:center !important; font-size:18px !important; } html body .fc-header-nav{ display:none !important; } html body .fc-cart-btn{ justify-self:end !important; width:38px !important; height:38px !important; } } /* CM-HEADER-V3 - override (26 apr) */ html body .fc-mobile-toggle, html body button.fc-mobile-toggle{ width:24px !important; height:18px !important; display:flex !important; flex-direction:column !important; justify-content:space-between !important; background:transparent !important; border:none !important; padding:0 !important; cursor:pointer !important; flex:0 0 24px !important; } html body .fc-mobile-toggle span, html body button.fc-mobile-toggle span{ display:block !important; width:100% !important; height:2.5px !important; background:#1a1208 !important; border-radius:2px !important; transition:all .3s ease !important; margin:0 !important; } html body .fc-mobile-toggle.is-open span:nth-child(1){transform:rotate(45deg) translateY(7.5px) !important} html body .fc-mobile-toggle.is-open span:nth-child(2){opacity:0 !important} html body .fc-mobile-toggle.is-open span:nth-child(3){transform:rotate(-45deg) translateY(-7.5px) !important} @media (max-width: 860px){ html body .fc-header, html body header.fc-header{ position:sticky !important; top:0 !important; z-index:999 !important; background:#fff !important; transition:box-shadow .3s ease !important; } html body .fc-header.is-scrolled{box-shadow:0 4px 20px rgba(0,0,0,.08) !important} html body .fc-header-inner, html body .fc-header-inner[class][class]{ display:flex !important; align-items:center !important; justify-content:space-between !important; grid-template-columns:none !important; gap:0 !important; padding:14px 18px !important; min-height:64px !important; } html body .fc-logo{ flex:0 0 auto !important; display:inline-flex !important; align-items:center !important; height:auto !important; padding:0 !important; margin:0 !important; } html body .fc-logo-mark{ font-size:18px !important; font-weight:500 !important; letter-spacing:.4px !important; line-height:1 !important; color:#1a1208 !important; display:inline-block !important; } html body .fc-logo-accent{font-style:italic !important;color:#c9a268 !important} html body .fc-header-right{ display:flex !important; align-items:center !important; gap:16px !important; margin-left:auto !important; flex:0 0 auto !important; } html body .fc-quiz-cta{display:none !important} } /* ===== fc-titaniopuro-match-v6.css ===== */ /* fc-titaniopuro-match-v6.css */ /* Trust strip readability */ html body .fc-trust-section, html body .fc-trust-section[class][class]{ background:#1a1208 !important; color:#fff !important; padding:clamp(20px, 3vw, 36px) clamp(16px, 3vw, 32px) !important; } html body .fc-trust-section .fc-trust, html body .fc-trust-section .fc-trust__inner, html body .fc-trust-section [class*="trust__inner"]{ max-width:1240px !important; margin:0 auto !important; display:flex !important; flex-wrap:wrap !important; align-items:center !important; justify-content:center !important; gap:clamp(16px, 3vw, 40px) !important; } html body .fc-trust-section .badge, html body .fc-trust-section .fc-trust__badge, html body .fc-trust-section [class*="trust__item"]{ display:inline-flex !important; align-items:center !important; gap:10px !important; color:#f6efe4 !important; } html body .fc-trust-section .badge-text, html body .fc-trust-section .fc-trust__label, html body .fc-trust-section [class*="badge-text"]{ color:#f6efe4 !important; font:600 14px/1.2 "DM Sans", sans-serif !important; letter-spacing:0.02em !important; white-space:nowrap !important; } html body .fc-trust-section svg, html body .fc-trust-section .badge svg{ stroke:#c9a268 !important; color:#c9a268 !important; width:20px !important; height:20px !important; flex-shrink:0 !important; } @media (max-width: 640px){ html body .fc-trust-section .fc-trust, html body .fc-trust-section .fc-trust__inner, html body .fc-trust-section [class*="trust__inner"]{ gap:14px 20px !important; } html body .fc-trust-section .badge-text{ font-size:12px !important; } } /* fc-vshow balance */ html body .fc-vshow__inner, html body .fc-vshow__inner[class][class]{ display:grid !important; grid-template-columns:1fr 1fr !important; align-items:center !important; gap:clamp(24px, 3vw, 56px) !important; max-width:1200px !important; margin:0 auto !important; padding:clamp(24px, 4vw, 56px) clamp(16px, 3vw, 32px) !important; } html body .fc-vshow__media, html body .fc-vshow__media[class][class]{ width:100% !important; max-width:520px !important; aspect-ratio:9/10 !important; height:auto !important; border-radius:16px !important; overflow:hidden !important; position:relative !important; box-shadow:0 20px 60px rgba(26,18,8,0.18) !important; justify-self:start !important; } html body .fc-vshow__video, html body .fc-vshow__media video, html body .fc-vshow__media img{ width:100% !important; height:100% !important; object-fit:cover !important; display:block !important; } html body .fc-vshow__content, html body .fc-vshow__content[class][class]{ width:100% !important; max-width:500px !important; display:flex !important; flex-direction:column !important; justify-content:center !important; gap:16px !important; } @media (max-width: 860px){ html body .fc-vshow__inner, html body .fc-vshow__inner[class][class]{ grid-template-columns:1fr !important; gap:24px !important; padding:24px 16px !important; } html body .fc-vshow__media{ max-width:100% !important; aspect-ratio:4/5 !important; justify-self:stretch !important; } html body .fc-vshow__content{ max-width:100% !important; text-align:center !important; align-items:center !important; } } /* Fix glitchy page templates — hide duplicate auto-h1 */ html body.template-page h1.main-page-title, html body.template-page h1.page-title, html body.template-page .main-page-title{ display:none !important; } html body.template-page .shopify-section.section > .page-width, html body.template-page .shopify-section.section > .page-width--narrow{ max-width:880px !important; margin:0 auto !important; padding:48px clamp(16px, 3vw, 32px) !important; } html body.template-page .rte{ max-width:880px !important; margin:0 auto !important; color:#1a1208 !important; font:400 16px/1.65 "DM Sans", sans-serif !important; } html body.template-page .rte h1{ text-align:center !important; font:600 clamp(30px, 4vw, 44px)/1.15 "Cormorant Garamond", serif !important; color:#1a1208 !important; margin:0 0 12px !important; letter-spacing:-0.01em !important; text-transform:none !important; } html body.template-page .rte h2{ font:600 clamp(20px, 2.4vw, 26px)/1.3 "Cormorant Garamond", serif !important; color:#1a1208 !important; margin:36px 0 12px !important; } html body.template-page .rte h3{ font:600 clamp(17px, 1.9vw, 20px)/1.3 "DM Sans", sans-serif !important; color:#1a1208 !important; margin:24px 0 8px !important; letter-spacing:0 !important; } html body.template-page .rte p, html body.template-page .rte li{ color:#3a2f22 !important; line-height:1.65 !important; margin:0 0 12px !important; } html body.template-page .rte ul, html body.template-page .rte ol{ padding-left:22px !important; margin:0 0 16px !important; } html body.template-page .rte strong{ color:#1a1208 !important; font-weight:700 !important; }