/*
Theme Name: DS Belleza Logo Clinical
Theme URI: https://dsmexico.net/
Author: DS Belleza
Description: Minimal clinical-commerce block theme for DS Belleza, based on the red, magenta and cool-gray palette of the DS Belleza logo. Designed for multi-user content editing and WooCommerce.
Version: 3.1.0
Requires at least: 6.6
Requires PHP: 7.4
Text Domain: ds-belleza-logo-clinical
*/

:root {
  --ds-crimson: #b7192e;
  --ds-crimson-dark: #8f1022;
  --ds-magenta: #d62aa6;
  --ds-magenta-soft: #f8eaf4;
  --ds-steel: #8294a2;
  --ds-steel-dark: #536673;
  --ds-ink: #26343b;
  --ds-muted: #667680;
  --ds-line: #e1e7ea;
  --ds-surface: #f7f9fa;
  --ds-cool: #f0f4f6;
  --ds-blush: #fbf4f6;
  --ds-white: #ffffff;
  --ds-success: #2e716d;
  --ds-radius-sm: 8px;
  --ds-radius-md: 14px;
  --ds-radius-lg: 24px;
  --ds-shadow: 0 24px 70px rgba(63, 75, 83, .09);
  --ds-transition: 180ms ease;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { overflow-x: hidden; }
.wp-site-blocks { min-height: 100vh; }
.wp-site-blocks > * { margin-block-start: 0; }
:where(a,button,input,textarea,select):focus-visible { outline: 3px solid rgba(214,42,166,.38); outline-offset: 3px; }

/* Logo-derived accent line: the only prominent gradient in the visual system. */
.ds-logo-line { height: 3px; background: linear-gradient(90deg,var(--ds-crimson) 0%, #c52354 45%, var(--ds-magenta) 100%); }

.ds-announcement {
  border-bottom: 1px solid var(--ds-line);
  background: var(--ds-surface) !important;
  color: var(--ds-steel-dark) !important;
  font-size: .76rem;
  font-weight: 700;
  letter-spacing: .085em;
  text-transform: uppercase;
}
.ds-site-header {
  position: sticky;
  top: 0;
  z-index: 80;
  border-bottom: 1px solid rgba(225,231,234,.92);
  background: rgba(255,255,255,.94) !important;
  backdrop-filter: blur(18px);
}
.admin-bar .ds-site-header { top: 32px; }
.ds-header-row { min-height: 78px; }
.ds-site-title a { color: var(--ds-ink); text-decoration: none; font-weight: 750; letter-spacing: -.035em; }
.ds-site-title a::after { content: "·"; color: var(--ds-magenta); margin-left: .18rem; }
.ds-header-actions .wp-block-button__link { padding: .72rem 1.05rem; }
.ds-header-cart { margin-left: .25rem; }

.ds-section { padding-top: clamp(4rem, 8vw, 7.5rem); padding-bottom: clamp(4rem, 8vw, 7.5rem); }
.ds-section--compact { padding-top: clamp(2.25rem, 4vw, 3.75rem); padding-bottom: clamp(2.25rem, 4vw, 3.75rem); }
.ds-section-heading { max-width: 760px; margin-bottom: clamp(2rem, 4vw, 3.4rem); }
.ds-section-heading p { max-width: 650px; }
.ds-eyebrow { margin: 0 0 1rem; color: var(--ds-crimson); font-size: .73rem; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.ds-eyebrow::before { content: ""; display: inline-block; width: 26px; height: 2px; margin-right: .65rem; background: var(--ds-magenta); vertical-align: middle; }

.ds-hero { position: relative; overflow: hidden; background: #fff !important; }
.ds-hero::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(circle at 82% 30%, rgba(214,42,166,.055), transparent 29%), radial-gradient(circle at 68% 63%, rgba(183,25,46,.045), transparent 25%);
}
.ds-hero > * { position: relative; z-index: 1; }
.ds-hero h1 { max-width: 10.8ch; text-wrap: balance; }
.ds-hero-subtitle { max-width: 620px; font-size: clamp(1.05rem, 1.55vw, 1.25rem); }
.ds-hero-actions { margin-top: 2rem; }
.ds-hero-proof { display: flex; flex-wrap: wrap; gap: .75rem 1.25rem; margin-top: 2rem; color: var(--ds-muted); font-size: .88rem; }
.ds-hero-proof p { margin: 0; display: flex; align-items: center; gap: .45rem; }
.ds-hero-proof p::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--ds-crimson); box-shadow: 0 0 0 4px var(--ds-blush); }

.ds-hero-visual {
  position: relative; min-height: clamp(450px, 48vw, 610px); overflow: hidden;
  border: 1px solid var(--ds-line); border-radius: var(--ds-radius-lg);
  background: linear-gradient(150deg,#fafbfc 0%,#f2f5f7 56%,#fbf1f6 100%);
  box-shadow: var(--ds-shadow);
}
.ds-hero-visual::before { content:""; position:absolute; left:0; top:0; width:100%; height:4px; background:linear-gradient(90deg,var(--ds-crimson),var(--ds-magenta)); }
.ds-hero-logo { position:absolute; left:10%; top:11%; width:50%; max-width:250px; padding:1.25rem; background:#fff; border:1px solid var(--ds-line); border-radius:18px; box-shadow:0 18px 50px rgba(68,73,82,.08); }
.ds-hero-logo img { width:100%; height:auto; display:block; }
.ds-hero-card { position:absolute; right:8%; bottom:10%; width:60%; padding:1.5rem; background:rgba(255,255,255,.94); border:1px solid var(--ds-line); border-radius:18px; box-shadow:0 20px 50px rgba(64,72,80,.1); }
.ds-hero-card .ds-mini-kicker { color:var(--ds-crimson); font-size:.68rem; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.ds-hero-card h3 { margin:.55rem 0 .5rem; font-size:clamp(1.3rem,2.4vw,2rem); }
.ds-hero-card p { margin:0; color:var(--ds-muted); }
.ds-orbit { position:absolute; width:240px; height:240px; border-radius:50%; border:1px solid rgba(130,148,162,.35); right:-62px; top:20%; }
.ds-orbit::after { content:""; position:absolute; inset:34px; border:1px solid rgba(214,42,166,.22); border-radius:50%; }

.ds-trust { border-top:1px solid var(--ds-line); border-bottom:1px solid var(--ds-line); background:var(--ds-surface) !important; }
.ds-trust-item { padding:1rem 0; }
.ds-trust-item strong { color:var(--ds-ink); display:block; font-size:.96rem; }
.ds-trust-item span { color:var(--ds-muted); font-size:.85rem; }

.ds-need-grid { border-top:1px solid var(--ds-line); }
.ds-need-item { min-height:180px; padding:1.55rem 1.25rem 1.45rem; border-right:1px solid var(--ds-line); border-bottom:1px solid var(--ds-line); background:#fff; transition:background var(--ds-transition),transform var(--ds-transition); }
.ds-need-item:hover { background:var(--ds-blush); transform:translateY(-2px); }
.ds-need-index { color:var(--ds-steel); font-size:.72rem; font-weight:800; letter-spacing:.1em; }
.ds-need-item h3 { margin:.85rem 0 .45rem; font-size:1.32rem; }
.ds-need-item p { margin:0; color:var(--ds-muted); font-size:.93rem; }
.ds-need-item a { text-decoration:none; color:inherit; }

.ds-care-panel { overflow:hidden; border:1px solid var(--ds-line); border-radius:var(--ds-radius-lg); background:var(--ds-cool) !important; }
.ds-care-panel__intro { padding:clamp(2rem,5vw,4rem); }
.ds-care-steps { background:#fff; border-left:1px solid var(--ds-line); }
.ds-care-step { padding:1.4rem 1.6rem; border-bottom:1px solid var(--ds-line); }
.ds-care-step:last-child { border-bottom:0; }
.ds-step-no { color:var(--ds-magenta); font-size:.72rem; font-weight:850; letter-spacing:.12em; }
.ds-care-step h3 { margin:.35rem 0 .3rem; font-size:1.2rem; }
.ds-care-step p { margin:0; color:var(--ds-muted); }

.ds-store-section { background:var(--ds-surface) !important; }
.ds-store-intro { display:flex; align-items:end; justify-content:space-between; gap:2rem; margin-bottom:2rem; }
.ds-store-note { max-width:420px; color:var(--ds-muted); }

/* WooCommerce + shortcode product grid */
.woocommerce ul.products, .wc-block-product-template { gap:1.25rem !important; }
.woocommerce ul.products li.product, .wc-block-product {
  position:relative; padding:0 0 1.2rem !important; overflow:hidden; border:1px solid var(--ds-line); border-radius:16px; background:#fff; box-shadow:none !important;
}
.woocommerce ul.products li.product a img, .wc-block-components-product-image img, .wc-block-product img { margin:0 0 1rem !important; background:var(--ds-cool); }
.woocommerce ul.products li.product .woocommerce-loop-product__title, .wc-block-components-product-name { padding:0 1rem !important; color:var(--ds-ink) !important; font-size:1rem !important; font-weight:700; }
.woocommerce ul.products li.product .price, .wc-block-components-product-price { padding:0 1rem; color:var(--ds-crimson) !important; font-weight:800 !important; }
.woocommerce span.onsale, .wc-block-components-product-sale-badge { left:.8rem !important; right:auto !important; top:.8rem !important; min-height:auto !important; min-width:auto !important; padding:.35rem .55rem !important; border:0 !important; border-radius:999px !important; background:var(--ds-magenta) !important; color:#fff !important; font-size:.7rem !important; line-height:1 !important; }
.woocommerce ul.products li.product .button { margin:1rem 1rem 0 !important; width:calc(100% - 2rem); text-align:center; }
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .wc-block-components-button:not(.is-link), .wc-block-components-totals-coupon__button {
  border:1px solid var(--ds-crimson) !important; border-radius:999px !important; background:var(--ds-crimson) !important; color:#fff !important; font-weight:750 !important; box-shadow:none !important;
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .wc-block-components-button:not(.is-link):hover { background:var(--ds-crimson-dark) !important; color:#fff !important; }
.woocommerce div.product p.price, .woocommerce div.product span.price, .wc-block-components-product-price { color:var(--ds-crimson) !important; }
.woocommerce div.product .product_title { color:var(--ds-ink); }
.woocommerce div.product .woocommerce-product-gallery, .wc-block-components-product-image { border-radius:18px; overflow:hidden; }
.woocommerce .quantity .qty, .woocommerce input.input-text, .woocommerce select, .wc-block-components-text-input input, .wc-block-components-combobox-control input { border:1px solid var(--ds-line) !important; border-radius:10px !important; background:#fff !important; }
.woocommerce-message, .woocommerce-info { border-top-color:var(--ds-crimson) !important; background:var(--ds-blush) !important; }
.woocommerce-message::before, .woocommerce-info::before { color:var(--ds-crimson) !important; }
.woocommerce-error { border-top-color:var(--ds-magenta) !important; }
.woocommerce-cart-form, .wc-block-cart, .wc-block-checkout { --wp--preset--color--contrast: var(--ds-ink); }
.wc-block-components-sidebar-layout { gap:2.5rem !important; }
.wc-block-components-order-summary, .wc-block-components-totals-wrapper, .wc-block-checkout__terms { border-color:var(--ds-line) !important; }

.ds-brand-row { display:grid; grid-template-columns:1fr 2fr auto; gap:1.5rem; align-items:center; padding:1.4rem 0; border-top:1px solid var(--ds-line); }
.ds-brand-row:last-child { border-bottom:1px solid var(--ds-line); }
.ds-brand-row h3,.ds-brand-row p { margin:0; }
.ds-brand-row p { color:var(--ds-muted); }
.ds-brand-row a { text-decoration:none; font-weight:800; }

.ds-advice { position:relative; overflow:hidden; border-radius:var(--ds-radius-lg); background:var(--ds-ink) !important; color:#fff; }
.ds-advice::after { content:""; position:absolute; width:290px; height:290px; border:1px solid rgba(255,255,255,.16); border-radius:50%; right:-80px; top:-100px; box-shadow:0 0 0 36px rgba(214,42,166,.035); }
.ds-advice .wp-block-heading,.ds-advice p { color:#fff; }
.ds-advice .ds-eyebrow { color:#f6c0e6; }
.ds-advice .ds-eyebrow::before { background:#f6c0e6; }
.ds-advice .wp-block-button__link { background:#fff !important; color:var(--ds-ink) !important; }

.ds-guide-row { display:grid; grid-template-columns:70px 1fr auto; gap:1.25rem; align-items:center; padding:1.45rem 0; border-top:1px solid var(--ds-line); }
.ds-guide-row:last-child { border-bottom:1px solid var(--ds-line); }
.ds-guide-no { color:var(--ds-steel); font-size:.8rem; font-weight:800; }
.ds-guide-row h3 { margin:0; font-size:1.22rem; }
.ds-guide-row a { font-weight:800; text-decoration:none; }

.ds-footer { background:#202d33 !important; color:#dfe6e9 !important; }
.ds-footer h2,.ds-footer h3,.ds-footer a { color:#fff !important; }
.ds-footer a { text-decoration:none; }
.ds-footer a:hover { text-decoration:underline; }
.ds-footer .ds-footer-muted { color:#aebbc1 !important; }

/* Forms */
input[type=text],input[type=email],input[type=tel],input[type=search],input[type=password],textarea,select { width:100%; padding:.8rem .9rem; border:1px solid var(--ds-line); border-radius:10px; font:inherit; color:var(--ds-ink); background:#fff; }
input:focus,textarea:focus,select:focus { border-color:var(--ds-magenta); outline:none; box-shadow:0 0 0 3px rgba(214,42,166,.1); }

@media (max-width: 900px) {
  .ds-header-actions { display:none !important; }
  .ds-hero-visual { min-height:470px; }
  .ds-brand-row { grid-template-columns:1fr; gap:.45rem; }
  .ds-guide-row { grid-template-columns:48px 1fr; }
  .ds-guide-row > :last-child { grid-column:2; }
  .ds-care-steps { border-left:0; border-top:1px solid var(--ds-line); }
  .admin-bar .ds-site-header { top:46px; }
}
@media (max-width: 600px) {
  .ds-announcement .wp-block-group { justify-content:center !important; text-align:center; }
  .ds-announcement .wp-block-group > :last-child { display:none; }
  .ds-header-row { min-height:68px; }
  .ds-hero h1 { max-width:none; }
  .ds-hero-visual { min-height:400px; }
  .ds-hero-logo { left:7%; width:58%; }
  .ds-hero-card { right:6%; width:78%; }
  .ds-store-intro { display:block; }
  .ds-guide-row { grid-template-columns:34px 1fr; }
  .ds-guide-no { font-size:.72rem; }
  .ds-section { padding-top:3.7rem; padding-bottom:3.7rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.01ms !important; transition-duration:.01ms !important; }
}
