/*
Theme Name: WS Ventanas
Theme URI: https://wsventanas.es
Author: Grupo WSCover S.L.U.
Description: Tema editorial y comercial para WS Ventanas — Winter Summer Ventanas.
Version: 1.0.0
Requires at least: 6.8
Requires PHP: 8.1
Text Domain: ws-ventanas
*/

:root {
  --ws-ink: #0b3439;
  --ws-ink-2: #143f44;
  --ws-lime: #c8ff56;
  --ws-ivory: #f3f3ed;
  --ws-white: #fff;
  --ws-muted: #61706d;
  --ws-line: #d7ddd7;
  --ws-soft: #e4e9e4;
  --ws-radius: 18px;
  --ws-shell: min(1320px, calc(100% - 9vw));
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--ws-ivory);
  color: var(--ws-ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
}
body.admin-bar .ws-header { top: 32px; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; height: auto; }
.ws-shell { width: var(--ws-shell); margin-inline: auto; }
.ws-main { min-height: 60vh; }
.ws-eyebrow {
  margin: 0 0 18px;
  color: #6b7b77;
  font: 700 11px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.ws-display {
  margin: 0;
  font-size: clamp(52px, 7vw, 108px);
  font-weight: 520;
  letter-spacing: -.072em;
  line-height: .9;
}
.ws-heading {
  margin: 0;
  font-size: clamp(42px, 5vw, 76px);
  font-weight: 520;
  letter-spacing: -.06em;
  line-height: .95;
}
.ws-lead { color: var(--ws-muted); font-size: clamp(17px, 1.6vw, 23px); line-height: 1.55; }
.ws-copy { color: var(--ws-muted); font-size: 16px; line-height: 1.75; }
.ws-button,
.wp-block-button__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 50px;
  border: 1px solid transparent;
  border-radius: 999px;
  padding: 0 24px;
  background: var(--ws-lime);
  color: var(--ws-ink);
  font-size: 13px;
  font-weight: 800;
  transition: transform .2s ease, background .2s ease;
}
.ws-button:hover,
.wp-block-button__link:hover { transform: translateY(-2px); background: #d5ff7f; }
.ws-button--dark { background: var(--ws-ink); color: white; }
.ws-button--ghost { border-color: currentColor; background: transparent; color: inherit; }
.ws-text-link { display: inline-flex; gap: 10px; border-bottom: 1px solid; padding-bottom: 5px; font-weight: 800; }

/* Header */
.ws-header {
  position: sticky;
  z-index: 50;
  top: 0;
  border-bottom: 1px solid rgba(11,52,57,.1);
  background: rgba(243,243,237,.92);
  backdrop-filter: blur(16px);
}
.ws-header__inner {
  width: var(--ws-shell);
  min-height: 80px;
  margin-inline: auto;
  display: grid;
  grid-template-columns: 210px 1fr auto;
  align-items: center;
  gap: 28px;
}
.ws-logo { display: grid; grid-template-columns: 43px 1fr; grid-template-rows: 24px 14px; align-items: center; column-gap: 10px; }
.ws-logo__mark { grid-row: 1 / 3; display: grid; place-items: center; width: 43px; height: 43px; border-radius: 50%; background: var(--ws-ink); color: var(--ws-lime); font-size: 15px; font-weight: 900; letter-spacing: -.06em; }
.ws-logo strong { align-self: end; font-size: 15px; line-height: 1; letter-spacing: .03em; }
.ws-logo small { align-self: start; font: 650 7px/1.2 ui-monospace, monospace; letter-spacing: .12em; color: #75817e; }
.ws-nav ul { display: flex; justify-content: center; align-items: center; gap: 25px; margin: 0; padding: 0; list-style: none; }
.ws-nav a { font-size: 12px; font-weight: 750; }
.ws-nav a:hover { color: #3c6d65; }
.ws-mobile-menu { display: none; }

/* Home hero */
.ws-hero {
  position: relative;
  min-height: min(860px, calc(100vh - 80px));
  overflow: hidden;
  background: var(--ws-ink);
  color: white;
}
.ws-hero__media,
.ws-hero__shade { position: absolute; inset: 0; }
.ws-hero__media img { width: 100%; height: 100%; object-fit: cover; }
.ws-hero__shade { background: linear-gradient(90deg, rgba(2,27,31,.86) 0%, rgba(2,27,31,.48) 46%, rgba(2,27,31,.08) 78%); }
.ws-hero__content { position: relative; z-index: 2; width: var(--ws-shell); margin-inline: auto; padding: clamp(100px, 12vh, 150px) 0 95px; }
.ws-hero .ws-eyebrow { color: var(--ws-lime); }
.ws-hero__title { max-width: 790px; }
.ws-hero__copy { max-width: 580px; margin: 28px 0; color: #d2dfdc; font-size: clamp(17px,1.6vw,23px); line-height: 1.55; }
.ws-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.ws-service-card { position: absolute; z-index: 3; right: 4.5vw; bottom: 34px; width: min(370px, 40vw); padding: 24px 26px; border-radius: 14px; background: rgba(255,255,255,.94); color: var(--ws-ink); }
.ws-service-card small { display: block; color: #73817e; font: 700 8px/1.3 ui-monospace, monospace; letter-spacing: .12em; }
.ws-service-card strong { display: block; margin-top: 8px; font-size: 16px; }
.ws-trust { display: grid; grid-template-columns: repeat(4,1fr); background: white; }
.ws-trust > div { position: relative; padding: 25px 25px 25px 48px; border-right: 1px solid var(--ws-line); }
.ws-trust > div::before { content: ""; position: absolute; left: 25px; top: 31px; width: 9px; height: 9px; border-radius: 50%; background: var(--ws-lime); box-shadow: 0 0 0 4px var(--ws-ink); }
.ws-trust strong { display: block; font-size: 12px; }
.ws-trust span { display: block; margin-top: 4px; color: #7b8885; font-size: 10px; }

/* Sections */
.ws-section { padding: 110px 0; }
.ws-section--tight { padding: 78px 0; }
.ws-section--dark { background: var(--ws-ink); color: white; }
.ws-section--soft { background: #e5eae5; }
.ws-split-heading { display: grid; grid-template-columns: .75fr 1.25fr; gap: 7vw; align-items: start; margin-bottom: 52px; }
.ws-collection-grid { display: grid; grid-template-columns: repeat(5,1fr); gap: 10px; }
.ws-collection-card { position: relative; min-height: 430px; overflow: hidden; border-radius: 15px; background: var(--ws-ink); color: white; }
.ws-collection-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; }
.ws-collection-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(3,30,34,.92), rgba(3,30,34,.04) 68%); }
.ws-collection-card:hover img { transform: scale(1.035); }
.ws-collection-card__body { position: absolute; z-index: 2; inset: auto 22px 24px; }
.ws-collection-card strong { display: block; font-size: 22px; letter-spacing: -.04em; }
.ws-collection-card span { display: block; margin-top: 7px; color: #d5e0dd; font-size: 11px; line-height: 1.45; }
.ws-featured { display: grid; grid-template-columns: 1.05fr .95fr; min-height: 590px; overflow: hidden; border-radius: 22px; background: var(--ws-ink); color: white; }
.ws-featured__image img { width: 100%; height: 100%; object-fit: cover; }
.ws-featured__content { padding: clamp(42px,5vw,76px); display: flex; flex-direction: column; justify-content: center; }
.ws-featured__content .ws-eyebrow { color: var(--ws-lime); }
.ws-featured__content p { color: #b8c9c5; }
.ws-benefit-grid { display: grid; grid-template-columns: repeat(3,1fr); border: 1px solid var(--ws-line); border-radius: 16px; overflow: hidden; background: white; }
.ws-benefit { padding: 38px; border-right: 1px solid var(--ws-line); }
.ws-benefit:last-child { border: 0; }
.ws-benefit__num { color: #76928b; font: 700 10px ui-monospace, monospace; letter-spacing: .1em; }
.ws-benefit h3 { margin: 25px 0 12px; font-size: 22px; }
.ws-benefit p { color: var(--ws-muted); font-size: 14px; line-height: 1.7; }
.ws-brand-strip { padding: 55px 4.5vw; background: white; text-align: center; }
.ws-brand-strip > p { margin: 0 0 34px; color: #7b8784; font: 700 9px ui-monospace, monospace; letter-spacing: .13em; }
.ws-brands { width: min(1050px,100%); margin: auto; display: grid; grid-template-columns: repeat(5,1fr); align-items: center; gap: 48px; }
.ws-brands img { width: 100%; max-height: 50px; object-fit: contain; filter: grayscale(1); opacity: .82; }
.ws-brand-text { font-size: 18px; font-weight: 900; color: #586a66; }
.ws-territory { display: grid; grid-template-columns: .8fr 1.2fr; gap: 8vw; align-items: start; }
.ws-territory__groups { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ws-territory__groups article { padding: 26px; border-radius: 14px; background: white; }
.ws-territory__groups h3 { margin: 0 0 9px; font-size: 17px; }
.ws-territory__groups p { margin: 0; color: var(--ws-muted); font-size: 12px; line-height: 1.65; }
.ws-process { display: grid; grid-template-columns: repeat(4,1fr); counter-reset: ws-step; }
.ws-process article { counter-increment: ws-step; padding: 30px; border-top: 1px solid #426166; }
.ws-process article::before { content: "0" counter(ws-step); display: block; margin-bottom: 45px; color: var(--ws-lime); font: 700 10px ui-monospace, monospace; }
.ws-process h3 { font-size: 19px; }
.ws-process p { color: #aec1bd; font-size: 13px; line-height: 1.65; }
.ws-contact-cta { display: grid; grid-template-columns: 1.3fr .7fr; gap: 7vw; align-items: center; padding: 75px; border-radius: 22px; background: var(--ws-lime); }
.ws-contact-cta p { max-width: 700px; color: #31504a; }
.ws-contact-cta__details { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; font-size: 18px; font-weight: 850; }

/* Pages */
.ws-page-hero { padding: 105px 0 75px; border-bottom: 1px solid var(--ws-line); }
.ws-page-hero__inner { width: var(--ws-shell); margin: auto; display: grid; grid-template-columns: 1.05fr .95fr; gap: 7vw; align-items: end; }
.ws-page-hero p { color: var(--ws-muted); font-size: 18px; line-height: 1.7; }
.ws-page-content { width: var(--ws-shell); margin-inline: auto; padding: 75px 0 110px; }
.ws-page-content > * { max-width: 920px; }
.ws-page-content > .alignwide { max-width: 100%; }
.ws-page-content h2 { margin: 55px 0 15px; font-size: clamp(34px,4vw,56px); letter-spacing: -.05em; line-height: 1; }
.ws-page-content h3 { margin-top: 35px; font-size: 25px; }
.ws-page-content p,
.ws-page-content li { color: #4f615d; font-size: 17px; line-height: 1.8; }
.ws-area-grid { max-width: 100% !important; display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin-top: 45px; }
.ws-area-card { padding: 30px; border-radius: 15px; background: white; }
.ws-area-card h3 { margin: 0 0 12px; }
.ws-area-card p { font-size: 14px; }
.ws-notice { max-width: 100% !important; margin: 35px 0; padding: 24px 28px; border-left: 4px solid var(--ws-lime); background: white; }

/* Products */
.ws-product-intro { padding: 95px 0 50px; }
.ws-product-filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 30px 0 45px; }
.ws-product-filters a { padding: 9px 14px; border: 1px solid var(--ws-line); border-radius: 999px; background: white; font-size: 12px; font-weight: 750; }
.ws-product-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; padding-bottom: 110px; }
.ws-product-card { overflow: hidden; border-radius: 16px; background: white; }
.ws-product-card__image { position: relative; height: 340px; background: var(--ws-soft); }
.ws-product-card__image img { width: 100%; height: 100%; object-fit: cover; }
.ws-product-card__tags { position: absolute; top: 14px; left: 14px; display: flex; gap: 6px; }
.ws-product-card__tags span { padding: 7px 9px; border-radius: 999px; background: rgba(255,255,255,.92); font: 700 8px ui-monospace, monospace; letter-spacing: .07em; text-transform: uppercase; }
.ws-product-card__body { padding: 24px; }
.ws-product-card h2 { margin: 0 0 10px; font-size: 23px; letter-spacing: -.04em; }
.ws-product-card p { min-height: 66px; color: var(--ws-muted); font-size: 13px; line-height: 1.65; }
.ws-product-single { padding: 65px 0 110px; }
.ws-product-single__hero { display: grid; grid-template-columns: 1.05fr .95fr; gap: 6vw; align-items: center; }
.ws-product-single__hero > img { width: 100%; height: 580px; object-fit: cover; border-radius: 20px; }
.ws-product-single__hero h1 { margin: 16px 0; font-size: clamp(50px,6vw,88px); line-height: .9; letter-spacing: -.07em; }
.ws-product-single__hero p { color: var(--ws-muted); font-size: 18px; line-height: 1.7; }
.ws-product-single__detail { display: grid; grid-template-columns: .75fr 1.25fr; gap: 4vw; margin-top: 75px; }
.ws-product-single__profile { min-height: 420px; display: grid; place-items: center; border-radius: 16px; background: var(--ws-soft); }
.ws-product-single__profile img { max-height: 380px; object-fit: contain; }
.ws-product-single__content { padding: 20px 0; }

/* Footer */
.ws-footer { padding: 68px 0 28px; background: #06282d; color: white; }
.ws-footer__grid { width: var(--ws-shell); margin: auto; display: grid; grid-template-columns: 1.2fr .8fr .8fr; gap: 6vw; }
.ws-footer h3 { margin-top: 0; font-size: 22px; }
.ws-footer p,
.ws-footer a { color: #b5c6c2; font-size: 13px; line-height: 1.7; }
.ws-footer nav { display: flex; flex-direction: column; gap: 8px; }
.ws-footer__bottom { width: var(--ws-shell); margin: 45px auto 0; padding-top: 20px; border-top: 1px solid #2f5055; color: #819995; font-size: 10px; }

@media (max-width: 1150px) {
  .ws-header__inner { grid-template-columns: 200px auto 160px; }
  .ws-nav { display: none; }
  .ws-mobile-menu { display: block; justify-self: end; position: relative; }
  .ws-mobile-menu summary { cursor: pointer; font-size: 12px; font-weight: 800; }
  .ws-mobile-menu ul { position: absolute; right: 0; top: 30px; width: 250px; padding: 18px; border-radius: 13px; background: white; box-shadow: 0 18px 50px rgba(11,52,57,.18); list-style: none; }
  .ws-mobile-menu li + li { margin-top: 13px; }
  .ws-collection-grid { grid-template-columns: repeat(3,1fr); }
  .ws-collection-card { min-height: 380px; }
}

@media (max-width: 800px) {
  body.admin-bar .ws-header { top: 46px; }
  .ws-header__inner { min-height: 68px; grid-template-columns: 1fr auto; }
  .ws-header__cta { display: none; }
  .ws-logo { grid-template-columns: 36px 1fr; }
  .ws-logo__mark { width: 36px; height: 36px; }
  .ws-hero { min-height: 720px; }
  .ws-hero__shade { background: linear-gradient(90deg, rgba(2,27,31,.88), rgba(2,27,31,.22)); }
  .ws-service-card { left: 4.5vw; right: 4.5vw; bottom: 24px; width: auto; }
  .ws-trust { grid-template-columns: 1fr 1fr; }
  .ws-split-heading,
  .ws-featured,
  .ws-territory,
  .ws-contact-cta,
  .ws-page-hero__inner,
  .ws-product-single__hero,
  .ws-product-single__detail { grid-template-columns: 1fr; }
  .ws-collection-grid { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; }
  .ws-collection-card { min-width: 78vw; scroll-snap-align: start; }
  .ws-benefit-grid,
  .ws-process { grid-template-columns: 1fr; }
  .ws-benefit { border-right: 0; border-bottom: 1px solid var(--ws-line); }
  .ws-brands { grid-template-columns: 1fr 1fr; }
  .ws-territory__groups,
  .ws-area-grid { grid-template-columns: 1fr; }
  .ws-contact-cta { padding: 45px 28px; }
  .ws-product-grid { grid-template-columns: 1fr 1fr; }
  .ws-product-single__hero > img { height: 430px; }
  .ws-footer__grid { grid-template-columns: 1fr; }
}

@media (max-width: 540px) {
  :root { --ws-shell: calc(100% - 40px); }
  .ws-display { font-size: 60px; }
  .ws-heading { font-size: 43px; }
  .ws-section { padding: 78px 0; }
  .ws-trust { grid-template-columns: 1fr; }
  .ws-collection-card { min-width: 86vw; min-height: 400px; }
  .ws-featured__image { min-height: 340px; }
  .ws-product-grid { grid-template-columns: 1fr; }
  .ws-product-card__image { height: 320px; }
}
