/*
Theme Name:   Galyos
Theme URI:    https://studiogalyos.fr
Description:  Thème enfant de Blocksy pour Galyos Studio
Author:       Coline Buino
Author URI:   https://studiogalyos.fr
Template:     blocksy
Version:      1.0.0
License:      Propriétaire
Text Domain:  galyos
*/

/* ============================================================
   VARIABLES GALYOS — modifie ces valeurs pour changer tout le site
   ============================================================ */
:root {
  /* Couleurs */
  --gold:          #b8925a;
  --gold-light:    #d4b07a;
  --gold-dim:      #7a5c35;
  --bg:            #080604;
  --bg2:           #0e0a06;
  --bg3:           #130d07;
  --line:          #1c1408;
  --line2:         #2a1c0e;
  --text:          #ddd0be;
  --text-dim:      #9a8878;
  --muted:         #4a3820;
  --dim:           #2a1c0e;

  /* Typographie */
  --font-serif:    'Cormorant Garamond', Georgia, serif;
  --font-sans:     'Inter', system-ui, sans-serif;

  /* Espacements */
  --pad-x:         2.5rem;
  --pad-y:         4rem;
  --max-width:     1400px;

  /* Transitions */
  --ease:          cubic-bezier(0.16, 1, 0.3, 1);
  --transition:    0.4s var(--ease);
}

/* ============================================================
   RESET BLOCKSY — on efface ce qui gêne
   ============================================================ */
body {
  background: var(--bg) !important;
  color: var(--text) !important;
  font-family: var(--font-sans) !important;
  font-weight: 200 !important;
  -webkit-font-smoothing: antialiased;
}

/* Liens */
a { color: var(--text); text-decoration: none; transition: color var(--transition); }
a:hover { color: var(--gold); }

/* Titres */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-serif);
  font-weight: 200;
  color: var(--text);
  line-height: 1.1;
}

/* ============================================================
   NAVIGATION BLOCKSY — surcharge
   ============================================================ */
.ct-header {
  background: transparent !important;
  border-bottom: .5px solid transparent !important;
  transition: background var(--transition), border-color var(--transition) !important;
}
.ct-header.is-sticky,
.ct-header.has-background {
  background: rgba(8, 6, 4, 0.92) !important;
  backdrop-filter: blur(12px) !important;
  border-bottom-color: var(--line) !important;
}

/* Logo */
.ct-logo a,
.site-title a {
  font-family: var(--font-serif) !important;
  font-size: 1.15rem !important;
  font-weight: 300 !important;
  letter-spacing: .28em !important;
  color: var(--gold) !important;
  text-transform: uppercase !important;
}

/* Menu items */
.ct-menu > li > a,
.ct-nav-links > li > a {
  font-size: .58rem !important;
  letter-spacing: .25em !important;
  text-transform: uppercase !important;
  color: var(--muted) !important;
  font-weight: 200 !important;
}
.ct-menu > li > a:hover,
.ct-nav-links > li > a:hover {
  color: var(--gold) !important;
}

/* ============================================================
   BOUTONS GLOBAUX
   ============================================================ */
.btn,
.wp-block-button__link,
.button {
  font-size: .62rem !important;
  letter-spacing: .25em !important;
  text-transform: uppercase !important;
  font-family: var(--font-sans) !important;
  font-weight: 200 !important;
  transition: all var(--transition) !important;
  border-radius: 0 !important;
}
.btn-primary,
.wp-block-button.is-style-fill .wp-block-button__link {
  background: var(--gold) !important;
  color: var(--bg) !important;
  border: .5px solid var(--gold) !important;
  padding: .95rem 2.2rem !important;
}
.btn-primary:hover,
.wp-block-button.is-style-fill .wp-block-button__link:hover {
  background: var(--gold-light) !important;
  border-color: var(--gold-light) !important;
}
.btn-outline,
.wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent !important;
  color: var(--text-dim) !important;
  border: .5px solid var(--line2) !important;
  padding: .95rem 2.2rem !important;
}
.btn-outline:hover,
.wp-block-button.is-style-outline .wp-block-button__link:hover {
  border-color: var(--gold) !important;
  color: var(--gold) !important;
}

/* ============================================================
   WOOCOMMERCE
   ============================================================ */
.woocommerce,
.woocommerce-page {
  background: var(--bg);
}

/* Boutons WooCommerce */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
  background: var(--gold) !important;
  color: var(--bg) !important;
  border-radius: 0 !important;
  font-family: var(--font-sans) !important;
  font-size: .6rem !important;
  font-weight: 200 !important;
  letter-spacing: .22em !important;
  text-transform: uppercase !important;
  padding: .85rem 1.8rem !important;
  border: none !important;
  transition: background var(--transition) !important;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover {
  background: var(--gold-light) !important;
}

/* Prix */
.woocommerce .price,
.woocommerce-Price-amount {
  color: var(--gold) !important;
  font-family: var(--font-serif) !important;
  font-weight: 200 !important;
}

/* Inputs */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
  background: var(--bg2) !important;
  border: .5px solid var(--line2) !important;
  color: var(--text) !important;
  border-radius: 0 !important;
  font-family: var(--font-sans) !important;
  font-weight: 200 !important;
  padding: .8rem 1rem !important;
}

/* Grille produits */
.woocommerce ul.products {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: .5px !important;
  background: var(--line) !important;
}
.woocommerce ul.products li.product {
  background: var(--bg) !important;
  padding: 1.8rem !important;
  margin: 0 !important;
  transition: background var(--transition) !important;
}
.woocommerce ul.products li.product:hover {
  background: var(--bg2) !important;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: var(--font-serif) !important;
  font-size: 1.1rem !important;
  font-weight: 200 !important;
  color: var(--text-dim) !important;
  padding: .8rem 0 .4rem !important;
}

/* Étoiles */
.woocommerce .star-rating span::before,
.woocommerce .star-rating::before {
  color: var(--gold) !important;
}

/* Panier / checkout fond */
.woocommerce-cart table.cart,
.woocommerce-checkout #order_review {
  background: var(--bg2) !important;
  border: .5px solid var(--line) !important;
}

/* ============================================================
   FOOTER BLOCKSY — surcharge
   ============================================================ */
.ct-footer {
  background: var(--bg) !important;
  border-top: .5px solid var(--line) !important;
}
.ct-footer,
.ct-footer a,
.ct-footer p {
  color: var(--dim) !important;
  font-size: .5rem !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
}
.ct-footer a:hover { color: var(--gold) !important; }

/* ============================================================
   UTILITAIRES — classes custom à utiliser dans tes pages
   ============================================================ */
.galyos-section        { padding: var(--pad-y) var(--pad-x); }
.galyos-divider        { width: 100%; height: .5px; background: var(--line); }
.galyos-eyebrow        { font-size: .58rem; letter-spacing: .32em; text-transform: uppercase; color: var(--gold); }
.galyos-title-hero     { font-family: var(--font-serif); font-size: clamp(4rem,9vw,8rem); font-weight: 200; line-height: .9; }
.galyos-title-section  { font-family: var(--font-serif); font-size: clamp(1.8rem,3vw,2.8rem); font-weight: 200; }
.galyos-body           { font-size: .72rem; line-height: 1.9; letter-spacing: .06em; color: var(--text-dim); }
.galyos-caption        { font-size: .55rem; letter-spacing: .25em; text-transform: uppercase; color: var(--muted); }
.galyos-gold           { color: var(--gold); }
.galyos-italic         { font-style: italic; }
.galyos-grid-line-bg   {
  background-image: linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size: 60px 60px;
}

/* Responsive */
@media (max-width: 768px) {
  :root { --pad-x: 1.5rem; --pad-y: 3rem; }
  .woocommerce ul.products { grid-template-columns: 1fr 1fr !important; }
}
@media (max-width: 480px) {
  .woocommerce ul.products { grid-template-columns: 1fr !important; }
}
