/*
Theme Name: Beck Modern
Description: Theme WordPress autonome pour Beck Terrassement et Demolition.
Version: 1.0.0
Author: Beck
Text Domain: beck-modern
*/

@import url('https://fonts.googleapis.com/css2?family=Cantata+One&family=Source+Sans+3:wght@400;600;700&display=swap');

:root {
  --beck-blue: #269ccb;
  --beck-blue-dark: #0777a3;
  --beck-ink: #24323a;
  --beck-muted: #62727a;
  --beck-light: #f3f7f8;
  --beck-line: #dbe7eb;
  --beck-white: #fff;
  --beck-shadow: 0 14px 40px rgba(26, 75, 91, .12);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--beck-ink); background: #977902; font-family: 'Source Sans 3', sans-serif; font-size: 18px; line-height: 1.6; }
a { color: var(--beck-blue-dark); text-decoration-thickness: .08em; text-underline-offset: .15em; }
a:hover { color: var(--beck-blue); }
img { max-width: 100%; height: auto; }
.site-shell { width: 100%; min-height: 100vh; margin: 0; display: flex; flex-direction: column; background: transparent; }
.site-header { position: relative; z-index: 10; }
.site-main { width: min(1200px, 100%); margin: 0 auto; padding: 64px 40px 90px; background: var(--beck-white); }
.beck-menu { width: 100%; background: url('images/7fb0218a20304360e98dbd3ed1bc7f7f_menu_bg.png') center repeat; border-top: 1px dotted #fff; border-bottom: 1px dotted #fff; padding: 5px; }
.beck-menu__collapse { display: block; width: min(1180px, 100%); margin: 0 auto; }
.beck-menu__list, .beck-menu__sub-menu { display: flex; align-items: center; justify-content: center; gap: 0; margin: 0; padding: 0; list-style: none; }
.beck-menu__item { position: relative; list-style: none; }
.beck-menu__item > a { display: block; padding: 10px 15px; color: #fff; font-family: 'Cantata One', 'Times New Roman', Times, serif; font-size: 18px; line-height: 25.71428572px; text-decoration: none; white-space: nowrap; border-radius: 0; }
.beck-menu__item > a:hover { color: #333; text-decoration: none; border-radius: 10px; }
.beck-menu__item.is-active > a { color: #fff; background: rgba(74, 72, 69, .5); border-radius: 10px; background-image: none; }
.beck-menu__sub-menu { visibility: hidden; pointer-events: none; position: absolute; z-index: 20; top: 100%; left: 0; display: block; min-width: 190px; background: #fff; border: 1px solid #ccc; box-shadow: 4px 4px 0 rgba(0,0,0,.09); }
.beck-menu__item:hover > .beck-menu__sub-menu, .beck-menu__item:focus-within > .beck-menu__sub-menu { visibility: visible; pointer-events: auto; }
.beck-menu__sub-menu .beck-menu__item > a { padding: 10px; color: #777; font-family: 'Source Sans 3', sans-serif; font-size: 1rem; line-height: 1.4; border-radius: 0; }
.beck-menu__sub-menu .beck-menu__item > a:hover, .beck-menu__sub-menu .beck-menu__item.is-active > a { color: var(--beck-blue); background: #ededed; }
.beck-menu__sub-menu .beck-menu__sub-menu { top: -1px; left: 100%; }
.beck-menu__toggle { display: none; }
.beck-banner { position: relative; height: 440px; overflow: hidden; background: #ffcd05; }
.beck-banner__slide { position: absolute; inset: 0; background-position: center top; background-repeat: no-repeat; background-size: cover; }
.beck-banner__slide::before { position: absolute; inset: 0; background: #000; content: ''; opacity: .4; }
.beck-banner__slide--first { background-image: url('images/1a5f0a11f2e3ad82e398aa2595ab3e8f_bandeau1.jpg'); animation: beck-banner-first 8s infinite; }
.beck-banner__slide--second { background-image: url('images/94dd21a3340b0978db540a77b8f71747_bandeau2.jpg'); animation: beck-banner-second 8s infinite; }
.beck-banner__text { position: absolute; inset: 60% 0 auto; z-index: 1; text-align: center; color: #fff; text-shadow: 1px 1px 3px rgba(0,0,0,.3); }
.beck-banner__text strong { display: block; font-size: 72px; line-height: 102.857px; font-weight: 700; }
.beck-banner__text span { display: block; font: 18px/25.714px 'Arial Black', Arial, sans-serif; }
@keyframes beck-banner-first { 0%, 48% { opacity: 1; } 52%, 100% { opacity: 0; } }
@keyframes beck-banner-second { 0%, 48% { opacity: 0; } 52%, 100% { opacity: 1; } }
.site-main { flex: 1; }
.content-layout { display: block; }
.content-layout:has(> .sidebar) { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 56px; }
.content-layout--full { display: block; }
.entry-title { margin: 0 0 28px; font-family: 'Cantata One', serif; font-size: clamp(2rem, 4vw, 3.2rem); line-height: 1.2; color: var(--beck-blue-dark); }
.entry-content > :first-child { margin-top: 0; }
.entry-content h2, .entry-content h3 { color: var(--beck-blue-dark); line-height: 1.2; }
.entry-content blockquote { margin: 28px 0; padding: 18px 24px; border-left: 4px solid var(--beck-blue); background: var(--beck-light); }
.entry-content .vc_row { margin-left: 0; margin-right: 0; }
.sidebar { padding: 24px; border: 1px solid var(--beck-line); background: var(--beck-light); }
.sidebar h2, .sidebar h3 { margin-top: 0; color: var(--beck-blue-dark); font-family: 'Cantata One', serif; font-size: 1.25rem; }
.sidebar ul { margin: 0; padding-left: 20px; }
.button, button, input[type='submit'] { display: inline-block; border: 0; border-radius: 2px; padding: 12px 22px; color: var(--beck-white); background: var(--beck-blue-dark); font: inherit; font-weight: 700; cursor: pointer; }
.button:hover, button:hover, input[type='submit']:hover { background: var(--beck-blue); color: var(--beck-white); }
.site-footer { color: #d9eef4; background: #173d4c; }
.site-footer__inner { display: grid; grid-template-columns: 1fr repeat(3, minmax(0, 1fr)); gap: 36px; padding: 50px 0 28px; }
.site-footer h2, .site-footer h3 { margin-top: 0; color: var(--beck-white); font-family: 'Cantata One', serif; }
.site-footer a { color: #d9eef4; }
.site-footer ul { margin: 0; padding-left: 20px; }
.site-footer__bottom { width: min(1180px, calc(100% - 40px)); margin: 0 auto; padding: 18px 0; border-top: 1px solid rgba(255,255,255,.18); font-size: .9rem; }
.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; }
@media (max-width: 780px) {
  .beck-banner { height: 150px; }
  .beck-banner__slide--first { background-image: url('images/75a9f140cf5a8db35be81910047f9cad_bandeau1_mobile.jpg'); }
  .beck-banner__slide--second { background-image: url('images/cd2cb9937b36125e31dc537d0edbef99_bandeau2_mobile.jpg'); }
  .beck-banner__text { inset: 50% 0 auto; transform: translateY(-50%); }
  .beck-banner__text strong { font-size: 36px; line-height: 51.429px; }
  .beck-banner__text span { font-size: 14px; line-height: 20px; }
  .beck-menu__toggle { display: block; width: 42px; height: 36px; margin: 0 auto; padding: 8px; border: 1px solid rgba(255,255,255,.5); background: transparent; }
  .beck-menu__toggle-lines, .beck-menu__toggle-lines::before, .beck-menu__toggle-lines::after { display: block; height: 2px; background: #fff; content: ''; }
  .beck-menu__toggle-lines::before { transform: translateY(-7px); }
  .beck-menu__toggle-lines::after { transform: translateY(5px); }
  .beck-menu__collapse { display: none; }
  .beck-menu__collapse.is-open { display: block; }
  .beck-menu__list { display: block; }
  .beck-menu__item > a { padding: 8px 12px; font-size: 17px; }
  .beck-menu__sub-menu { position: static; visibility: visible; pointer-events: auto; display: block; border: 0; box-shadow: none; background: rgba(0,0,0,.12); }
  .beck-menu__sub-menu .beck-menu__item > a { color: #fff; padding-left: 28px; }
  .content-layout { grid-template-columns: 1fr; gap: 36px; }
  .site-footer__inner { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 480px) {
  .site-main { width: 100%; padding: 42px 14px 60px; }
  .site-footer__inner { grid-template-columns: 1fr; }
}
