/*
Theme Name: G&Co Visual
Theme URI: https://www.gecovisual.com
Author: G&Co Visual
Description: Thème WordPress sur mesure pour G&Co Visual — production audiovisuelle et solutions techniques.
Version: 0.7.0
Requires at least: 6.4
Tested up to: 7.1
Requires PHP: 8.0
Text Domain: gco-visual
*/

:root {
  --gco-bg: #0B0B0A;
  --gco-panel: #151513;
  --gco-graphite: #292927;
  --gco-white: #F4F1EA;
  --gco-grey: #B8B5AE;
  --gco-gold: #C89B46;
  --gco-gold-light: #DDBA72;
  --gco-max: 1280px;
  --gco-radius: 2px;
}

html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--gco-bg);
  color: var(--gco-white);
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.6;
}
* { box-sizing: border-box; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; height: auto; display: block; }

.gco-container { width: min(calc(100% - 40px), var(--gco-max)); margin-inline: auto; }
.gco-section { padding: 120px 0; }
.gco-eyebrow { color: var(--gco-gold-light); text-transform: uppercase; letter-spacing: .14em; font-size: .82rem; font-weight: 700; }
.gco-title { font-family: Manrope, Inter, sans-serif; font-size: clamp(2.2rem, 5vw, 4.5rem); line-height: 1.02; letter-spacing: -.03em; margin: 0 0 24px; }
.gco-subtitle { font-size: clamp(1.15rem, 2vw, 1.5rem); color: var(--gco-grey); max-width: 780px; }
.gco-gold-line { width: 68px; height: 2px; background: var(--gco-gold); margin: 28px 0; }

.gco-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 20px; border: 1px solid var(--gco-gold); font-weight: 700; letter-spacing: .02em; transition: .25s ease; }
.gco-btn--primary { background: var(--gco-gold); color: #0B0B0A; }
.gco-btn--primary:hover { background: var(--gco-gold-light); border-color: var(--gco-gold-light); }
.gco-btn--secondary { background: transparent; color: var(--gco-white); }
.gco-btn--secondary:hover { color: var(--gco-gold-light); border-color: var(--gco-gold-light); }

.site-header { position: fixed; inset: 0 0 auto 0; z-index: 40; background: rgba(11,11,10,.82); backdrop-filter: blur(14px); border-bottom: 1px solid rgba(244,241,234,.06); transition: background .25s ease; }
.site-header.is-scrolled { background: rgba(11,11,10,.96); }
.site-header__inner { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.site-branding { display:flex; align-items:center; flex:0 0 auto; }
.site-branding__logo { display:block; width: clamp(210px, 16vw, 260px); height: auto; max-height: 44px; object-fit: contain; object-position: left center; }
.site-nav-wrap { display:flex; align-items:center; gap:34px; margin-left:auto; }
.site-nav { display:flex; align-items:center; gap:26px; font-size:.78rem; text-transform:uppercase; letter-spacing:.09em; }
.site-nav a { color:var(--gco-grey); transition:color .2s ease; }
.site-nav a:hover, .site-nav a:focus-visible { color:var(--gco-white); }
.site-langs { display:flex; gap:8px; align-items:center; color:var(--gco-grey); font-size:.74rem; letter-spacing:.08em; }
.site-langs strong { color:var(--gco-gold-light); }
.site-langs span:nth-child(even) { color:#66645f; }
.site-menu-toggle { display:none; width:44px; height:44px; padding:0; border:0; background:transparent; cursor:pointer; }
.site-menu-toggle > span:not(.screen-reader-text) { display:block; width:24px; height:1px; background:var(--gco-white); margin:6px auto; transition:.25s ease; }
.screen-reader-text { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

.gco-hero { min-height: 100vh; position: relative; display: grid; align-items: end; overflow: hidden; padding-top: 78px; }
.gco-hero::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(11,11,10,.96) 0%, rgba(11,11,10,.72) 42%, rgba(11,11,10,.18) 70%, rgba(11,11,10,.35) 100%); z-index: 1; }
.gco-hero__media { position: absolute; inset: 0; background: radial-gradient(circle at 70% 30%, #343430 0%, #151513 40%, #0B0B0A 82%); }
.gco-hero__content { position: relative; z-index: 2; padding: 120px 0 90px; max-width: 870px; }
.gco-hero__tagline { color: var(--gco-gold-light); text-transform: uppercase; letter-spacing: .1em; font-weight: 700; margin-bottom: 18px; }
.gco-hero__copy { max-width: 700px; font-size: 1.15rem; color: var(--gco-grey); }
.gco-hero__actions { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 34px; }

.gco-split { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 24px; margin-top: 48px; }
.gco-card { background: var(--gco-panel); border: 1px solid rgba(200,155,70,.42); padding: 34px; min-height: 360px; display: flex; flex-direction: column; justify-content: space-between; }
.gco-card h3 { font-family: Manrope, sans-serif; font-size: 2rem; margin: 0 0 16px; }
.gco-card__lead { color: var(--gco-gold-light); font-weight: 700; font-size: 1.05rem; }
.gco-card ul { list-style: none; margin: 26px 0; padding: 0; color: var(--gco-grey); columns: 2; column-gap: 24px; }
.gco-card li { margin-bottom: 8px; }

.gco-approach { background: #0e0e0d; }
.gco-approach__grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 64px; align-items: start; }
.gco-quote { border-left: 2px solid var(--gco-gold); padding-left: 24px; color: var(--gco-grey); font-size: 1.1rem; }

.gco-projects { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 20px; margin-top: 42px; }
.gco-project { min-height: 420px; background: linear-gradient(180deg, #292927 0%, #151513 58%, #0B0B0A 100%); border: 1px solid rgba(244,241,234,.08); padding: 26px; display: flex; flex-direction: column; justify-content: flex-end; }
.gco-project__type { color: var(--gco-gold-light); font-size: .82rem; text-transform: uppercase; letter-spacing: .12em; }
.gco-project h3 { font-size: 1.55rem; margin: 8px 0 4px; }

.gco-method { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; margin-top: 46px; }
.gco-step { padding: 22px 18px; border-top: 1px solid var(--gco-gold); background: var(--gco-panel); min-height: 180px; }
.gco-step__num { color: var(--gco-gold); font-size: .78rem; font-weight: 700; }
.gco-step h4 { font-size: 1rem; margin: 22px 0 8px; }
.gco-step p { margin: 0; color: var(--gco-grey); font-size: .9rem; }

.gco-trust { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.gco-trust__item { border-top: 1px solid var(--gco-graphite); padding-top: 18px; color: var(--gco-grey); }
.gco-trust__item strong { color: var(--gco-white); display: block; margin-bottom: 6px; }

.gco-about { background: var(--gco-panel); }
.gco-about__grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 60px; align-items: center; }
.gco-about__visual { min-height: 480px; background: linear-gradient(160deg, #292927, #111110); border: 1px solid rgba(244,241,234,.08); }

.gco-cta { text-align: center; padding: 130px 0; }
.gco-cta h2 { max-width: 900px; margin-inline: auto; }
.gco-cta p { color: var(--gco-grey); margin-bottom: 30px; }

.site-footer { border-top: 1px solid var(--gco-graphite); padding: 34px 0 48px; color: var(--gco-grey); font-size: .9rem; }
.site-footer__inner { display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap; }

@media (max-width: 980px) {
  .site-menu-toggle { display:block; margin-left:auto; position:relative; z-index:52; }
  .site-nav-wrap { position:fixed; inset:0; min-height:100svh; background:rgba(11,11,10,.99); display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:36px; padding:100px 36px 50px; opacity:0; visibility:hidden; transform:translateY(-10px); transition:.25s ease; z-index:50; }
  .gco-menu-open .site-nav-wrap { opacity:1; visibility:visible; transform:none; }
  .site-nav { flex-direction:column; align-items:flex-start; gap:22px; font-family:Manrope,sans-serif; font-size:1.5rem; letter-spacing:.02em; }
  .site-langs { font-size:.9rem; }
  .gco-menu-open { overflow:hidden; }
  .gco-menu-open .site-menu-toggle > span:nth-of-type(1) { transform:translateY(3.5px) rotate(45deg); }
  .gco-menu-open .site-menu-toggle > span:nth-of-type(2) { transform:translateY(-3.5px) rotate(-45deg); }
  .gco-section { padding: 88px 0; }
  .gco-split, .gco-approach__grid, .gco-about__grid { grid-template-columns: 1fr; }
  .gco-projects { grid-template-columns: 1fr; }
  .gco-method { grid-template-columns: repeat(2, 1fr); }
  .gco-trust { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .gco-container { width: min(calc(100% - 28px), var(--gco-max)); }
  .site-header__inner { min-height: 68px; }
  .site-branding__logo { width: 190px; max-height: 34px; }
  .gco-hero { min-height: 92svh; }
  .gco-hero__content { padding: 100px 0 54px; }
  .gco-card { padding: 24px; min-height: auto; }
  .gco-card ul { columns: 1; }
  .gco-method { grid-template-columns: 1fr; }
  .gco-title { font-size: clamp(2rem, 12vw, 3.4rem); }
}

/* Gutenberg homepage components */
.gco-front-content { padding: 0; }
.gco-front-content > * { margin-block-start: 0; margin-block-end: 0; }
.gco-block-hero { background: radial-gradient(circle at 70% 30%, #343430 0%, #151513 40%, #0B0B0A 82%); }
.gco-block-hero::before { pointer-events:none; }
.gco-block-cards, .gco-block-projects, .gco-block-method { gap: 20px; margin-top: 42px; }
.gco-block-cards .gco-card { margin: 0; }
.gco-block-projects .gco-project { margin: 0; }
.gco-block-method .gco-step { margin: 0; }
.gco-card .wp-block-list { list-style:none; padding-left:0; color:var(--gco-grey); columns:2; column-gap:24px; }
.gco-card .wp-block-list li { margin-bottom:8px; }
.gco-btn-block .wp-block-button__link { border-radius:0; min-height:48px; display:inline-flex; align-items:center; padding:0 20px; font-weight:700; border:1px solid var(--gco-gold); }
.gco-btn-primary .wp-block-button__link { background:var(--gco-gold); color:var(--gco-bg); }
.gco-btn-secondary .wp-block-button__link { background:transparent; color:var(--gco-white); }
.gco-block-hero .wp-block-separator.gco-gold-line { border:0; opacity:1; }

/* Make the editor resemble the site without printing the administrative page title on the front end. */
.editor-styles-wrapper .gco-hero { min-height: 720px; }
.editor-styles-wrapper .gco-container { width:min(calc(100% - 40px), var(--gco-max)); }
.editor-styles-wrapper .gco-section { padding:80px 0; }
.editor-styles-wrapper .gco-title { color:var(--gco-white); }
.editor-styles-wrapper .gco-card, .editor-styles-wrapper .gco-step { color:var(--gco-white); }

@media (max-width: 980px) {
  .gco-block-cards, .gco-block-projects, .gco-block-method { flex-wrap:wrap !important; }
  .gco-block-cards > .wp-block-column, .gco-block-projects > .wp-block-column { flex-basis:100% !important; }
  .gco-block-method > .wp-block-column { flex-basis:calc(50% - 10px) !important; }
}
@media (max-width: 640px) {
  .gco-card .wp-block-list { columns:1; }
  .gco-block-method > .wp-block-column { flex-basis:100% !important; }
}
