/* Starliçe 2026 site layer — loaded last. It settles rules that the older layered
   files (v11…v37) override back and forth; prefer editing here over adding a layer. */

/* ---------- Type: Cormorant was set at -5…-7% tracking, which fused words ---------- */
body .wp-block-heading:not(.sx-hero-title):not(.sx-chapter-title):not(.sx-section-title) { letter-spacing: -.012em !important; word-spacing: .02em; }
body footer h3.wp-block-heading, body .footer-main h3.wp-block-heading { font-size: 11px !important; letter-spacing: .18em !important; }

/* ---------- WhatsApp: a quiet round button, never over prices ---------- */
body .sc-whatsapp-float { width: 54px !important; height: 54px !important; min-width: 54px !important; padding: 0 !important; border-radius: 50% !important; justify-content: center !important; right: 18px !important; bottom: calc(18px + env(safe-area-inset-bottom)) !important; box-shadow: 0 10px 28px rgba(22, 60, 46, .28) !important; transition: bottom .3s ease, transform .2s ease !important; }
body .sc-whatsapp-float > span { display: none !important; }
body .sc-whatsapp-chat { display: none !important; }
body.woocommerce-cart .sc-whatsapp-float,
body.woocommerce-checkout .sc-whatsapp-float,
body.woocommerce-account .sc-whatsapp-float { display: none !important; }
body.has-buybar .sc-whatsapp-float { bottom: calc(86px + env(safe-area-inset-bottom)) !important; }
/* On a phone the button always covers something; it leaves while prices and buy buttons are on screen. */
body .sc-whatsapp-float.is-aside { transform: translateX(calc(100% + 24px)) !important; visibility: hidden; transition: transform .3s ease, visibility 0s .3s !important; }

/* ---------- Mobile buy bar ---------- */
.sx-buybar { display: none; }
@media (max-width: 781px) {
  .sx-buybar { position: fixed; left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom)); z-index: 60; display: grid; grid-template-columns: 1fr 1.35fr; gap: 6px; padding: 6px; background: rgba(48, 35, 41, .96); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-radius: 6px; box-shadow: 0 14px 34px rgba(30, 18, 22, .32); transform: translateY(140%); transition: transform .35s cubic-bezier(.2, .8, .2, 1); }
  .sx-buybar.is-visible { transform: none; }
  .sx-buybar[hidden] { display: none; }
  .sx-buybar a { display: grid; gap: 2px; align-content: center; min-height: 52px; padding: 6px 12px; border-radius: 4px; text-decoration: none; color: #fbf1e3; font-family: Manrope, Arial, sans-serif; }
  .sx-buybar a small { font-size: 10.5px; letter-spacing: .02em; opacity: .8; }
  .sx-buybar a strong { font-size: 15px; font-weight: 700; }
  .sx-buybar a strong bdi, .sx-buybar a strong .amount { color: inherit; }
  .sx-buybar-three { background: #f4d9a6; color: #302329 !important; }
  .sx-buybar-one { border: 1px solid rgba(251, 241, 227, .28); }
}
@media (prefers-reduced-motion: reduce) { .sx-buybar { transition: none; } }

/* ---------- Footer: four columns, legal links and seller identity ---------- */
@media (min-width: 900px) {
  body .footer-top { grid-template-columns: 1.5fr 1fr 1fr 1fr !important; gap: 48px !important; }
  body .footer-top > div:nth-child(3) { grid-column: auto !important; }
}
@media (max-width: 899px) {
  body .footer-top { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  body .footer-top > div:first-child { grid-column: 1 / -1 !important; }
}
.sx-footer-legal .footer-links button { all: unset; cursor: pointer; font: inherit; color: inherit; display: inline-flex; align-items: center; min-height: 36px; line-height: 1.35; }
.sx-footer-legal .footer-links button:hover, .sx-footer-legal .footer-links button:focus-visible { text-decoration: underline; text-underline-offset: 4px; }
.sx-footer-trust { grid-column: 1 / -1; width: 100%; max-width: none !important; border-top: 1px solid rgba(233, 221, 202, .14); padding: 22px 0 6px; }
.sx-footer-assurances { list-style: none; margin: 0 0 14px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 22px; font: 600 12px/1.4 Manrope, Arial, sans-serif; color: #e9ddca; }
.sx-footer-assurances li::before { content: '✓'; color: #caa05e; margin-right: 8px; }
body .sx-footer-trust .sx-footer-seller { margin: 0; font: 400 11.5px/1.7 Manrope, Arial, sans-serif; color: rgba(233, 221, 202, .7); max-width: 980px !important; width: auto !important; }
.sx-footer-seller a { color: inherit; }

/* ---------- Cart / checkout: free-shipping meter ---------- */
.sx-ship-meter { margin: 0 0 22px; padding: 16px 18px; background: #f4ebdd; border: 1px solid #e3d4bf; }
.sx-ship-meter p { margin: 0 0 10px; font: 500 14px/1.5 Manrope, Arial, sans-serif; color: #302329; }
.sx-ship-bar { display: block; height: 6px; background: #e3d4bf; border-radius: 3px; overflow: hidden; }
.sx-ship-bar span { display: block; height: 100%; background: linear-gradient(90deg, #b8893a, #d9692b); border-radius: 3px; }

/* ---------- Consent banner ---------- */
.sx-consent { position: fixed; z-index: 80; left: 16px; bottom: 16px; max-width: 420px; padding: 20px 20px 18px; background: #fbf7f0; color: #302329; border: 1px solid #e0d2bd; box-shadow: 0 20px 50px rgba(30, 18, 22, .22); font: 400 13.5px/1.55 Manrope, Arial, sans-serif; }
.sx-consent p { margin: 0 0 10px; }
.sx-consent a { color: inherit; text-underline-offset: 3px; }
.sx-consent-title { font: 600 14px/1.3 Manrope, Arial, sans-serif; }
.sx-consent-options { display: flex; flex-wrap: wrap; gap: 8px 16px; margin: 4px 0 14px; }
.sx-consent-options label { display: inline-flex; gap: 6px; align-items: center; }
.sx-consent-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.sx-consent-actions button { min-height: 40px; padding: 0 14px; font: 600 13px/1 Manrope, Arial, sans-serif; background: transparent; color: #302329; border: 1px solid #c7b8a8; border-radius: 2px; cursor: pointer; }
.sx-consent-actions button.is-primary { background: #302329; color: #fbf1e3; border-color: #302329; }
.sx-consent-actions button:focus-visible { outline: 2px solid #d9692b; outline-offset: 2px; }
@media (max-width: 781px) { .sx-consent { left: 10px; right: 10px; bottom: 10px; max-width: none; } }

/* ---------- Details / accordions: the + sat above the summary text ---------- */
body .wp-block-details > summary { display: flex !important; align-items: center !important; justify-content: space-between; gap: 18px; }
body .wp-block-details > summary::after { align-self: center !important; margin-top: 0 !important; }

/* ---------- Tap targets ---------- */
body .wp-block-navigation__responsive-container-open, body .wp-block-navigation__responsive-container-close { min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }

/* ---------- Home hero on phones: the product was a 112 px thumbnail in the corner ---------- */
@media (max-width: 781px) {
  body.home .hero-grid { display: flex; flex-direction: column; }
  body.home .hero-grid .hero-visual { position: relative; inset: auto; order: -1; z-index: 3; width: 100%; height: auto; min-height: 0; opacity: 1; padding: 14px 0 6px; background: #f3e8d6; }
  body.home .hero-grid .hero-visual .wp-block-image { width: 100%; max-width: none; }
  body.home .hero-grid .hero-visual img { width: 100%; height: min(72vw, 330px); object-fit: contain; transform: none; }
  body.home .hero-grid .hero-visual .hero-index { display: none; }
  body.home .hero-grid .hero-visual .hero-caption { display: none; }
  body.home .hero-grid .hero-copy { padding-top: 26px; }
}

/* ---------- Text links: the paragraph and its link each drew an underline ---------- */
body .text-link { border-bottom: 0 !important; padding-bottom: 0 !important; }
/* …and the link was stretched to a 42 px flex box, which pushed its underline far below the words. */
body .text-link a { display: inline-block !important; min-height: 0 !important; margin-top: 15px !important; padding: 14px 0 8px !important; }

/* ---------- Home story, last chapter (wide screens): the guide link had no position ---------- */
@media (min-width: 782px) {
  body.home .unbox-scroll .sc-finale .sc-story-detail-link { top: calc(54% + 40px); left: 5%; margin: 0 !important; }
}

/* ---------- Home story on phones: the crop cut the sunbather at the neck ---------- */
@media (max-width: 781px) {
  body.home .unbox-chapters > .unbox-chapter:nth-child(1) { background-position: 0 0, 86% 50% !important; }
}

/* ---------- Contact page: the business block sat in a narrower, centred box, so its rule ran under
   the social cards and its text lined up with neither column ---------- */
body .standard-page .sc-company-info { max-width: none !important; margin: 72px 0 0 !important; }

/* ---------- Shop / category: the sale badge was half outside the card, in WooCommerce's default olive ---------- */
body.woocommerce ul.products li.product .onsale { top: 18px !important; right: 18px !important; left: auto !important; margin: 0 !important; min-width: 0 !important; min-height: 0 !important; padding: 9px 13px !important; border-radius: 2px !important; background: #302329 !important; color: #f4d9a6 !important; font: 600 11px/1 Manrope, Arial, sans-serif !important; letter-spacing: .1em; text-transform: uppercase; }

/* ---------- Home hero on phones: the scene photo is a ready-made portrait cut (see functions.php) ---------- */
body.home .hero-grid .hero-environment picture { display: contents; }
@media (max-width: 520px) {
  body.home .hero-grid .hero-environment img { object-position: 50% 50% !important; }
}

/* ---------- Shop card: the description ran into the button ---------- */
body.woocommerce ul.products li.product .sc-shop-product-copy { margin-bottom: 22px !important; }

/* ---------- Phones: labels and notes that were set at 6–10 px ---------- */
@media (max-width: 781px) {
  body .announcement .sc-announcement-product,
  body .hero-copy .eyebrow, body .hero-copy .product-line,
  body .sc-market-eyebrow, body .unbox-chapter .unbox-kicker,
  body .story-copy .eyebrow, body .brand-copy .eyebrow, body .faq-intro .eyebrow,
  body .brand-video figcaption, body .sc-bundle-kicker { font-size: 10.5px !important; }
  body .sc-market-byline, body .sc-market-count, body .sc-market-all a { font-size: 12px !important; }
  body .sc-market-position { font-size: 11px !important; }
  body .hero-copy .small-note, body .sc-offer-caption span { font-size: 12px !important; }
  body.home .sc-finale .unbox-body { font-size: 13px !important; }
  body.home .sc-finale .sc-finale-benefits li strong { font-size: 12.5px !important; }
  body.home .sc-finale .sc-finale-benefits li span { font-size: 11.5px !important; }
  body.home .sc-finale .sc-finale-verified { font-size: 11.5px !important; }
  body .sc-bundle-offer .sc-bundle-button { font-size: 13px !important; }
  body .sc-bundle-prices > span, body .sc-bundle-prices small, body .sc-bundle-copy > small { font-size: 12px !important; }
  body footer .sc-social-label strong, body footer .sc-social-label small { font-size: 11px !important; }
  body .footer-bottom p { font-size: 10.5px !important; }
  body .footer-membership span { font-size: 8px !important; }
}

/* ---------- Campaign block: "Ürün detayları" had the same stretched-box underline ---------- */
body .sc-bundle-offer .sc-bundle-secondary { display: inline-block !important; min-height: 0 !important; padding: 14px 0 8px !important; }

/* ---------- Footer on phones: two social cards no longer fit side by side at a readable size ---------- */
@media (max-width: 480px) {
  body footer .sc-footer-social { display: grid !important; grid-template-columns: 1fr 1fr; gap: 8px; }
  body footer .sc-footer-social .sc-social-link { min-width: 0; }
  body footer .sc-footer-social .sc-social-label { display: grid !important; gap: 1px; line-height: 1.3 !important; }
  body footer .sc-footer-social .sc-social-label strong, body footer .sc-footer-social .sc-social-label small { display: block; }
}

/* ---------- Checkout: the blocks above the order button started at two different left edges ---------- */
body.woocommerce-checkout #payment .place-order .sc-legal-facts { margin-left: 0 !important; margin-right: 0 !important; }
body.woocommerce-checkout #payment .place-order .sc-checkout-legal,
body.woocommerce-checkout #payment .place-order .sc-preinfo-ack,
body.woocommerce-checkout #payment .place-order .woocommerce-terms-and-conditions-wrapper .form-row { padding-left: 0 !important; padding-right: 0 !important; }
body.woocommerce-checkout #payment .place-order .woocommerce-privacy-policy-text p { margin: 2px 0 6px; font-size: 12px; line-height: 1.6; }

/* ---------- Search results ---------- */
.sx-search .sx-search-form { margin-top: 26px; margin-bottom: 34px; }
.sx-search .sx-search-form .wp-block-search__inside-wrapper { gap: 8px; border: 0; padding: 0; }
.sx-search .sx-search-form input[type="search"] { min-height: 50px; padding: 0 16px; font: 400 15px/1.4 Manrope, Arial, sans-serif; color: #302329; background: #fffdf8; border: 1px solid #cdbfab; border-radius: 0; }
.sx-search .sx-search-form input[type="search"]:focus-visible { outline: 2px solid #907046; outline-offset: 2px; }
.sx-search .sx-search-form button { min-height: 50px; margin: 0; padding: 0 26px; }
.sx-search .sx-search-results { list-style: none; margin: 0; padding: 0; }
.sx-search .sx-search-results > li { margin: 0; padding: 26px 0; border-top: 1px solid #ded0bc; }
.sx-search .sx-search-results > li:last-child { border-bottom: 1px solid #ded0bc; }
.sx-search .sx-search-results h2 { margin: 0 0 8px; font-size: clamp(1.5rem, 2.4vw, 2rem); }
.sx-search .sx-search-results h2 a { text-decoration: none; }
.sx-search .sx-search-results h2 a:hover, .sx-search .sx-search-results h2 a:focus-visible { text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1px; }
.sx-search .sx-search-results .wp-block-post-excerpt { margin: 0; }
.sx-search .sx-search-results .wp-block-post-excerpt p { margin: 0; max-width: 68ch; font-size: 15px; line-height: 1.65; color: #5a4b4d; }
.sx-search .sx-search-empty { max-width: 60ch; }

/* ---------- Product page: two more links whose underline hung at the bottom of a 44 px box ---------- */
body.single-product .sc-product-inquiry a,
body.single-product .sc-pd-review-source a { display: inline-block !important; min-height: 0 !important; padding: 14px 0 8px !important; }

/* ---------- Home story on phones: lighter scene photos ----------
   The two chapter backgrounds were the desktop files (260 KB + 191 KB) for boxes 375 px wide. Same
   pictures, same gradients, sized for a phone (87 KB + 51 KB). */
@media (max-width: 781px) {
  body.home .unbox-chapters > .unbox-chapter:nth-child(1) { background-image: linear-gradient(90deg, rgba(33, 27, 34, .91) 0%, rgba(33, 27, 34, .73) 43%, rgba(33, 27, 34, .306) 78%, rgba(33, 27, 34, .1) 100%), url('../beach-sunbather-v5-m.webp') !important; }
  body.home .unbox-chapters > .unbox-chapter:nth-child(4) { background-image: linear-gradient(90deg, rgba(245, 232, 217, .96) 0%, rgba(245, 232, 217, .835) 51%, rgba(245, 232, 217, .37) 100%), url('../hydration-cream-v13-m.webp') !important; }
}

/* ---------- Product page: right-sized backdrops ----------
   The archive preview is at most 434 px wide and was painted from the full 1 672 px file; the hero
   stage on a phone is 338 px wide. Same pictures at the size they are shown. */
body.single-product .sc-pd-archive-preview-main.sc-pd-vanity { background-image: url('../bathroom-vanity-empty-v20-s.webp') !important; }
@media (max-width: 781px) {
  body.single-product .sc-pd-stage { background-image: url('../scene-light-v3-m.webp') !important; }
}

/* ---------- Product gallery: a thumbnail rail instead of three labelled buttons and a text link ----------
   Sixteen of the seventeen product images sat behind "Tüm ürün görselleri ↗" and a collapsed archive.
   Five varied thumbnails open the lightbox; the last tile states the total and leads to the archive. */
body.sc-pd-campaign.single-product .sc-pd-rail { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
body.sc-pd-campaign.single-product .sc-pd-rail-item { position: relative; display: block; aspect-ratio: 1; overflow: hidden; border: 1px solid #d9c9b3; background: #fff; transition: border-color .2s ease; }
body.sc-pd-campaign.single-product .sc-pd-rail-item img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
body.sc-pd-campaign.single-product .sc-pd-rail-item:hover { border-color: #8a683f; }
body.sc-pd-campaign.single-product .sc-pd-rail-item:hover img { transform: scale(1.05); }
body.sc-pd-campaign.single-product .sc-pd-rail-item:focus-visible { outline: 3px solid #89673c; outline-offset: 2px; }
body.sc-pd-campaign.single-product .sc-pd-rail-all { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; border-color: #3a272b; background: #3a272b; color: #f6e7d2; text-align: center; text-decoration: none; }
body.sc-pd-campaign.single-product .sc-pd-rail-all strong { font: 500 clamp(26px, 2.4vw, 34px)/1 'Cormorant Garamond', Georgia, serif; }
body.sc-pd-campaign.single-product .sc-pd-rail-all span { font: 600 10px/1.3 Manrope, Arial, sans-serif; letter-spacing: .08em; text-transform: uppercase; }
body.sc-pd-campaign.single-product .sc-pd-rail-all:hover { background: #2b1c1f; border-color: #2b1c1f; }
body.sc-pd-campaign.single-product .sc-pd-composed > a { position: relative; display: block; }
body.sc-pd-campaign.single-product .sc-pd-zoom { position: absolute; right: 12px; bottom: 12px; padding: 8px 12px 8px 31px; border: 1px solid #d6c4ab; background: #fffaf3 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10.5 4a6.5 6.5 0 1 0 0 13 6.5 6.5 0 0 0 0-13Zm5 11.5L20 20M10.5 8v5M8 10.5h5' fill='none' stroke='%233a272b' stroke-width='1.7' stroke-linecap='round'/%3E%3C/svg%3E") 9px center/16px 16px no-repeat; color: #3a272b; font: 600 11px/1 Manrope, Arial, sans-serif; letter-spacing: .04em; pointer-events: none; }
@media (max-width: 781px) {
  body.sc-pd-campaign.single-product .sc-pd-rail { gap: 6px; }
  body.sc-pd-campaign.single-product .sc-pd-rail-all strong { font-size: 24px; }
  body.sc-pd-campaign.single-product .sc-pd-rail-all span { font-size: 8px; letter-spacing: .04em; }
  body.sc-pd-campaign.single-product .sc-pd-zoom { right: 8px; bottom: 8px; padding: 7px 9px 7px 27px; background-position: 7px center; font-size: 10px; }
}

/* ---------- Product archive: open by default, heading is a heading, the rest is one labelled button ---------- */
body.single-product .sc-pd-archive-details > summary { cursor: default; pointer-events: none; }
body.single-product .sc-pd-archive-details > summary::after { display: none; }
body.single-product .sc-pd-archive-details.is-clipped .sc-pd-archive-grid { padding-bottom: 28px; }
body.single-product .sc-pd-archive-details.is-clipped .sc-pd-archive-grid .wp-block-image:nth-child(n+8) { display: none; }
body.single-product .sc-pd-archive-more { display: block; min-height: 52px; margin: 0 auto 64px; padding: 0 34px; border: 1px solid #3a272b; background: transparent; color: #3a272b; font: 600 13px/1 Manrope, Arial, sans-serif; letter-spacing: .04em; cursor: pointer; transition: background .2s ease, color .2s ease; }
body.single-product .sc-pd-archive-more:hover { background: #3a272b; color: #fbf1e3; }
body.single-product .sc-pd-archive-more:focus-visible { outline: 3px solid #8a683f; outline-offset: 3px; }
body.single-product .sc-pd-archive-details:not(.is-clipped) .sc-pd-archive-grid { padding-bottom: 28px; }
@media (max-width: 900px) {
  body.single-product .sc-pd-archive-details.is-clipped .sc-pd-archive-grid .wp-block-image:nth-child(n+6) { display: none; }
  body.single-product .sc-pd-archive-details .sc-pd-archive-grid { padding-bottom: 20px !important; }
  body.single-product .sc-pd-archive-more { width: 92%; margin-bottom: 40px; padding: 0 12px; }
}

/* ---------- Home hero on large displays ----------
   The hero was a fixed ~694 px: on a 1920x1080 screen it ended at 839 px with a 560 px packshot in a
   952 px panel, and a slice of the next section filled the rest. From 1600x900 up the hero and the
   rating strip fill the first screen and the packshot grows with the panel. */
@media (min-width: 1600px) and (min-height: 900px) {
  body.home .hero-grid { min-height: min(calc(100svh - 221px), 900px) !important; }
  body.home .hero-visual .hero-real-product { width: auto !important; max-width: none !important; }
  body.home .hero-visual .hero-real-product img { width: min(700px, 37vw) !important; max-height: min(680px, calc(100svh - 400px)) !important; }
}

/* ---------- Product page: delivery and payment facts readable without opening the terms ---------- */
.sc-purchase-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; margin: 14px 0 0; padding: 0; list-style: none; border: 1px solid #dccdb8; background: #fffaf3; }
.sc-purchase-facts li { display: flex; flex-direction: column; gap: 3px; margin: 0; padding: 11px 12px 11px 14px; border-left: 1px solid #dccdb8; }
.sc-purchase-facts li:first-child { border-left: 0; }
.sc-purchase-facts strong { color: #33272a; font: 700 12px/1.35 Manrope, Arial, sans-serif; }
.sc-purchase-facts span { color: #6d5d58; font: 500 11px/1.35 Manrope, Arial, sans-serif; }
@media (max-width: 520px) {
  .sc-purchase-facts { grid-template-columns: 1fr; }
  .sc-purchase-facts li { flex-direction: row; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; padding: 9px 12px; border-left: 0; border-top: 1px solid #dccdb8; }
  .sc-purchase-facts li:first-child { border-top: 0; }
}

/* ---------- Product page: label facts under the gallery (wide screens only) ---------- */
body.sc-pd-campaign.single-product .sc-pd-keyfacts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 28px; margin: 18px 0 0; padding: 0; list-style: none; }
body.sc-pd-campaign.single-product .sc-pd-keyfacts li { display: flex; flex-direction: column; gap: 3px; margin: 0; padding: 13px 0 13px 16px; border-top: 1px solid #dccdb8; background: linear-gradient(#b08a52, #b08a52) left 16px / 2px 30px no-repeat; }
body.sc-pd-campaign.single-product .sc-pd-keyfacts strong { color: #33272a; font: 700 13px/1.35 Manrope, Arial, sans-serif; }
body.sc-pd-campaign.single-product .sc-pd-keyfacts span { color: #6d5d58; font: 500 12px/1.35 Manrope, Arial, sans-serif; }
@media (max-width: 781px) {
  body.sc-pd-campaign.single-product .sc-pd-keyfacts { display: none; }
}

/* ---------- Story page: three steps and a contact band ----------
   Between the founder video and the product card there was a single paragraph. */
body.page .sx-story-steps, body.page .sx-story-contact { box-sizing: border-box; width: 100%; max-width: none !important; margin: 0 !important; padding: clamp(52px, 6vw, 92px) max(5%, calc((100vw - 1320px) / 2)); }
body.page .sx-story-steps { background: #fbf5ec; }
body.page .sx-story-steps > * { max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; }
body.page .sx-story-steps > .eyebrow { margin: 0 0 18px !important; color: #745132; }
body.page .sx-story-steps > h2 { margin: 0 0 clamp(30px, 4vw, 54px) !important; color: #33272a; font: 400 clamp(38px, 4.4vw, 64px)/1.02 'Cormorant Garamond', Georgia, serif; letter-spacing: -.02em; }
body.page .sx-story-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border-top: 1px solid #cdbda8; }
body.page .sx-story-step { margin: 0 !important; padding: 30px clamp(20px, 3vw, 44px) 4px; border-left: 1px solid #ded0bc; }
body.page .sx-story-step:first-child { padding-left: 0; border-left: 0; }
body.page .sx-story-step > * { max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; }
body.page .sx-story-step .sx-story-no { margin: 0 0 14px !important; color: #b08a52; font: 500 46px/1 'Cormorant Garamond', Georgia, serif; }
body.page .sx-story-step h3 { margin: 0 0 10px !important; color: #33272a; font: 700 15px/1.35 Manrope, Arial, sans-serif; letter-spacing: 0; }
body.page .sx-story-step p:not(.sx-story-no) { margin: 0 !important; color: #4c3f41; font-size: 15px; line-height: 1.72; }
body.page .sx-story-step a { display: block; width: fit-content; margin-top: 12px; color: #33272a; font-weight: 600; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }
body.page .sx-story-contact { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(28px, 6vw, 96px); align-items: center; background: #f0e2cf; padding-top: clamp(44px, 5vw, 72px); padding-bottom: clamp(44px, 5vw, 72px); }
body.page .sx-story-contact > * { max-width: none !important; margin: 0 !important; }
body.page .sx-story-contact h2 { margin: 0 0 14px !important; color: #33272a; font: 400 clamp(30px, 3vw, 42px)/1.08 'Cormorant Garamond', Georgia, serif; }
body.page .sx-story-contact p { max-width: 58ch; margin: 0 !important; color: #4c3f41; font-size: 15px; line-height: 1.72; }
body.page .sx-story-links { list-style: none; padding: 0 !important; border-top: 1px solid #c9b596; }
body.page .sx-story-links li { margin: 0; border-bottom: 1px solid #c9b596; }
body.page .sx-story-links a { display: flex; align-items: center; justify-content: space-between; min-height: 58px; color: #33272a; font: 600 15px/1.3 Manrope, Arial, sans-serif; text-decoration: none; transition: padding .2s ease, color .2s ease; }
body.page .sx-story-links a:hover, body.page .sx-story-links a:focus-visible { padding-left: 8px; color: #7a5425; }
@media (max-width: 781px) {
  body.page .sx-story-steps, body.page .sx-story-contact { padding: 44px 7%; }
  body.page .sx-story-grid { grid-template-columns: 1fr; }
  body.page .sx-story-step { padding: 24px 0 22px; border-left: 0; border-top: 1px solid #ded0bc; }
  body.page .sx-story-step:first-child { border-top: 0; }
  body.page .sx-story-step .sx-story-no { font-size: 38px; margin-bottom: 10px !important; }
  body.page .sx-story-contact { grid-template-columns: 1fr; gap: 26px; }
}
@media (prefers-reduced-motion: reduce) { body.page .sx-story-links a { transition: none; } }

/* ---------- FAQ page: the second question group lines up with the first ----------
   "Sipariş ve ödeme" sat in a centred 760 px column with 14 px questions under a left-aligned group
   with 18 px questions, and its top rule ran under the product picture. */
.faq-v7-content + .sc-service-faq { width: min(718px, 100%); max-width: none !important; margin: 0 !important; padding: 0 0 34px; border-top: 0; }
.faq-v7-content + .sc-service-faq h2 { margin: 58px 0 6px; }
.faq-v7-content + .sc-service-faq details { margin: 0 !important; padding: 0; }
.faq-v7-content + .sc-service-faq summary { min-height: 72px; padding: 17px 40px 17px 0; font-size: 18px; line-height: 1.35; }
.faq-v7-content + .sc-service-faq details p { margin: 0 0 18px; font-size: 15px; }
@media (max-width: 781px) {
  .faq-v7-content + .sc-service-faq h2 { margin-top: 40px; }
  .faq-v7-content + .sc-service-faq summary { min-height: 60px; padding: 14px 34px 14px 0; font-size: 15px; }
}
/* Answers were 14 px on desktop and 12 px on phones in the first group. */
body.page .faq-v7-questions details p, .faq-v7-content + .sc-service-faq details p { font-size: 15px !important; line-height: 1.7 !important; }
@media (max-width: 781px) {
  body.page .faq-v7-questions details p, .faq-v7-content + .sc-service-faq details p { font-size: 14px !important; }
}
/* The "+" hung at the top edge of each question row instead of sitting on its line. */
body.page .faq-v7-questions details summary::after, .faq-v7-content + .sc-service-faq details summary::after { top: 50% !important; transform: translateY(-50%); }

/* ---------- Not-found page: somewhere to go besides the home page ---------- */
.sx-notfound .sx-notfound-links { display: flex; flex-wrap: wrap; gap: 6px 28px; max-width: 760px; margin-top: 34px; padding: 22px 0 0; list-style: none; border-top: 1px solid #ded0bc; }
.sx-notfound .sx-notfound-links li { margin: 0; }
.sx-notfound .sx-notfound-links a { display: inline-block; padding: 10px 0; color: #33272a; font: 600 14px/1.4 Manrope, Arial, sans-serif; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }
.sx-notfound .sx-notfound-links a:hover { color: #7a5425; }

/* ---------- Home reviews on wide screens ----------
   Above 1440 px the heading was inset by 5 % of the window and the cards snapped to 5 % of the
   1 440 px track, so the first card sat 23 px left of the heading at 1920. One fixed inset for
   both; the card that runs past the track's right edge fades out instead of being cut. */
@media (min-width: 1440px) {
  body.home .sc-market-intro { padding-inline: 72px; }
  body.home .sc-market-track { padding-inline: 72px; scroll-padding-inline: 72px; -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 72px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 72px), transparent); }
}

/* ---------- Product colour ----------
   The packshots are photographs on white. They were laid on the beige panels with multiply, which also
   multiplied the white carton and bottle by the panel colour: 248,248,248 in the photograph came out as
   236,226,208 in the hero, a cream/gold box instead of a white one. No blend mode on product photographs;
   the transparent cut-out served by inc/product-cutouts.php sits on the panel instead. */
body.home .hero-visual .wp-block-image.hero-real-product,
body.home .hero-visual .hero-real-product img,
body.home .sc-finale .sc-finale-mobile-pack img,
body.home .sc-bundle-pack { mix-blend-mode: normal; }
/* A hero photograph without a cut-out keeps its white background: the panel turns white around it
   instead of showing a white square on beige. */
body.home .hero-visual:has(.hero-real-product:not(.has-cutout)) { background: #fff; }

/* ---------- Scroll scene: copy clears the bottle ----------
   The bottle is drawn at a distance from the centre that follows the window's height, while the copy
   sat at a share of its width. On wide, short windows (most laptops) the bottle covered the first
   letters of each line. The copy now starts a fixed gap to the right of the bottle's edge. */
@media (min-width: 782px) {
  body.home .unbox-chapter:nth-child(-n+4) { box-sizing: border-box; padding-left: max(0px, calc(27% - 58.6vh + 32px)); }
}

/* ---------- Scroll scene: still layout ----------
   Last resort only. The scene plays for every desktop visitor (see sx_scene_motion_css in
   inc/performance.php and the 2D canvas renderer in unbox.js). If its photographs fail to load or the
   graphics context is lost mid-visit, unbox.js sets .is-static and the chapters are laid out as a
   plain grid under the beach photograph instead of being stacked on top of each other. */
@media (min-width: 782px) {
  body.home .unbox-scroll.is-static { height: auto !important; background: #261b1c; overflow: hidden; }
  body.home .unbox-scroll.is-static .unbox-stage { position: relative !important; top: auto; height: clamp(400px, 62vh, 620px) !important; min-height: 0 !important; background: #261b1c url("/wp-content/themes/starlice-atelier/assets/beach-sunbather-v5.webp") center 40% / cover no-repeat !important; }
  body.home .unbox-scroll.is-static .unbox-stage::before,
  body.home .unbox-scroll.is-static .unbox-stage::after,
  body.home .unbox-scroll.is-static .unbox-stage > :not(.unbox-fallback) { display: none !important; }
  body.home .unbox-scroll.is-static .unbox-fallback { position: absolute; inset: 0; z-index: 1; display: flex !important; align-items: flex-end; justify-content: flex-start; box-sizing: border-box; padding: 0 0 0 9%; opacity: 1 !important; background: linear-gradient(90deg, #1d1519c9 0%, #1d151980 30%, transparent 58%); }
  body.home .unbox-scroll.is-static .unbox-fallback-image { width: auto !important; height: 90%; margin: 0 !important; }
  body.home .unbox-scroll.is-static .unbox-fallback-image img { display: block; width: auto !important; height: 100% !important; max-width: none; max-height: none !important; object-fit: contain; filter: drop-shadow(0 18px 26px #0904078c); }

  body.home .unbox-scroll.is-static .unbox-chapters { position: relative !important; top: auto; z-index: 2; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); height: auto !important; margin: 0 !important; pointer-events: auto; }
  body.home .unbox-scroll.is-static .unbox-chapter:not(.sc-finale) { position: relative !important; inset: auto !important; grid-column: span 2; box-sizing: border-box; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; margin: 0 !important; width: auto !important; max-width: none !important; height: auto !important; min-height: 0 !important; padding: 54px clamp(28px, 3.4vw, 56px) 50px !important; border: 0; border-top: 1px solid #f6ecdf24; border-left: 1px solid #f6ecdf24; background: none !important; text-align: left; opacity: 1 !important; pointer-events: auto !important; }
  body.home .unbox-scroll.is-static .unbox-chapter:nth-child(1),
  body.home .unbox-scroll.is-static .unbox-chapter:nth-child(4) { border-left: 0; }
  body.home .unbox-scroll.is-static .unbox-chapter:nth-child(4),
  body.home .unbox-scroll.is-static .unbox-chapter:nth-child(5) { grid-column: span 3; }
  body.home .unbox-scroll.is-static .unbox-chapter:not(.sc-finale) .unbox-kicker { margin: 0 0 16px !important; color: #e0b86e !important; font-size: 10px; line-height: 1.4; letter-spacing: .2em; }
  body.home .unbox-scroll.is-static .unbox-chapters .unbox-chapter:nth-child(n):not(.sc-finale) h2 { max-width: none; margin: 0 0 18px !important; color: #fbf0df !important; font-size: clamp(34px, 3.1vw, 48px) !important; line-height: .96 !important; letter-spacing: -.04em; text-shadow: none; }
  body.home .unbox-scroll.is-static .unbox-chapter:not(.sc-finale) .unbox-body { max-width: 430px; margin: 0 !important; color: #e3d6c8 !important; font-size: 15px !important; line-height: 1.62; text-shadow: none; }
  body.home .unbox-scroll.is-static .unbox-mobile-carton { display: none !important; }

  body.home .unbox-scroll.is-static .unbox-chapter.sc-finale { position: relative !important; inset: auto !important; grid-column: 1 / -1; box-sizing: border-box; display: grid !important; margin: 0 !important; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr) minmax(0, .8fr); column-gap: clamp(32px, 4vw, 64px); align-content: center; width: auto !important; max-width: none !important; height: auto !important; min-height: 0 !important; padding: 68px 6% 64px !important; background: #efe2cd !important; color: #332728; text-align: left; opacity: 1 !important; pointer-events: auto !important; }
  body.home .unbox-scroll.is-static .sc-finale > * { position: static !important; grid-column: 1; width: auto !important; }
  body.home .unbox-scroll.is-static .sc-finale .unbox-kicker { margin: 0 0 16px !important; }
  body.home .unbox-scroll.is-static .sc-finale h2 { max-width: 520px !important; margin: 0 0 20px !important; }
  body.home .unbox-scroll.is-static .sc-finale .unbox-body { max-width: 440px !important; margin: 0 0 22px !important; font-size: 15px; }
  body.home .unbox-scroll.is-static .sc-finale .sc-finale-verified { max-width: 440px !important; margin: 0 0 22px !important; }
  body.home .unbox-scroll.is-static .sc-finale .sc-story-detail-link { margin: 0 !important; }
  body.home .unbox-scroll.is-static .sc-finale .sc-story-detail-link a { pointer-events: auto; }
  body.home .unbox-scroll.is-static .sc-finale .sc-finale-mobile-pack { display: block !important; grid-column: 2; grid-row: 1 / span 6; align-self: center; margin: 0 !important; }
  body.home .unbox-scroll.is-static .sc-finale .sc-finale-mobile-pack img { display: block; width: 100%; max-width: 380px; height: auto; margin: 0 auto; }
  body.home .unbox-scroll.is-static .sc-finale .sc-finale-benefits { grid-column: 3; grid-row: 1 / span 6; align-self: center; max-width: none !important; margin: 0 !important; }
}
@media (min-width: 782px) and (max-width: 1100px) {
  body.home .unbox-scroll.is-static .unbox-chapter:not(.sc-finale) { grid-column: span 3 !important; }
  body.home .unbox-scroll.is-static .unbox-chapter:nth-child(3) { border-left: 0; }
  body.home .unbox-scroll.is-static .unbox-chapter:nth-child(4) { border-left: 1px solid #f6ecdf24; }
  body.home .unbox-scroll.is-static .unbox-chapter:nth-child(5) { grid-column: 1 / -1 !important; border-left: 0; }
  body.home .unbox-scroll.is-static .unbox-chapter.sc-finale { grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); }
  body.home .unbox-scroll.is-static .sc-finale .sc-finale-mobile-pack { display: none !important; }
  body.home .unbox-scroll.is-static .sc-finale .sc-finale-benefits { grid-column: 2; }
}

/* ---------- Product page: image archive ----------
   The archive mixed double-width and single tiles and gave every photograph a fixed 250 px height, so
   square, upright and wide images each sat at a different scale with uneven margins. Every tile is now
   the same square with the same inner margin and a numbered caption; nothing spans two columns. */
body.single-product .sc-pd-archive-grid { counter-reset: sc-archive; gap: 16px; }
body.single-product .sc-pd-archive-grid .wp-block-image:nth-child(n) { grid-column: auto; border-color: #e3d7c6; transition: border-color .2s ease, box-shadow .2s ease; }
body.single-product .sc-pd-archive-grid .wp-block-image:hover { border-color: #b99a6b; box-shadow: 0 10px 26px #6344261f; }
body.single-product .sc-pd-archive-grid .wp-block-image a { flex: none; background: #fff; }
body.single-product .sc-pd-archive-grid .wp-block-image:nth-child(n) img { box-sizing: border-box; width: 100%; height: auto; aspect-ratio: 1 / 1; padding: 14px; object-fit: contain; }
body.single-product .sc-pd-archive-grid figcaption { counter-increment: sc-archive; display: flex; align-items: baseline; gap: 10px; flex: 1; min-height: 32px; padding: 12px 14px 13px; border-top: 1px solid #efe6d9; background: #fdfaf5; color: #4f413b; font: 600 11px/1.45 Manrope, Arial, sans-serif; }
body.single-product .sc-pd-archive-grid figcaption::before { content: counter(sc-archive, decimal-leading-zero); flex: none; color: #9a7a4c; font-weight: 700; letter-spacing: .08em; }
body.single-product .sc-pd-archive-details.is-clipped .sc-pd-archive-grid .wp-block-image:nth-child(n+8) { display: flex; }
body.single-product .sc-pd-archive-details.is-clipped .sc-pd-archive-grid .wp-block-image:nth-child(n+9) { display: none; }
@media (max-width: 1100px) and (min-width: 782px) {
  body.single-product .sc-pd-archive-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
}
@media (max-width: 1100px) {
  body.single-product .sc-pd-archive-details.is-clipped .sc-pd-archive-grid .wp-block-image:nth-child(n+6) { display: flex; }
  body.single-product .sc-pd-archive-details.is-clipped .sc-pd-archive-grid .wp-block-image:nth-child(n+7) { display: none; }
}
@media (max-width: 781px) {
  body.single-product .sc-pd-archive-grid { gap: 8px; }
  body.single-product .sc-pd-archive-grid .wp-block-image:nth-child(n) img { padding: 8px; }
  body.single-product .sc-pd-archive-grid figcaption { gap: 7px; padding: 9px 9px 10px; font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  body.single-product .sc-pd-archive-grid .wp-block-image:nth-child(n) { transition: none; }
}
/* The archive label no longer carries a hard-coded image count. */
body.single-product .sc-pd-archive-details > summary::before { content: 'GÖRSEL ARŞİVİ'; }
