/* ============================= */
/* FONTS */
/* ============================= */

/* GOOGLE FONTS */
@import url('https://fonts.googleapis.com/css2?family=DynaPuff:wght@400;500;600;700&family=Poppins:wght@300;400;500;600;700;800&display=swap');

/* THE JUNGLE */
@font-face{
  font-family: "The Jungle";
  src: url("/wp-content/themes/boo-theme/assets/fonts/TheJungle_Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}


/* ============================= */
/* ROOT */
/* ============================= */

:root{
  --boo-green: #273e2c;
  --boo-gold: #caa472;
  --boo-cream: #f9f7f1;
  --boo-white: #ffffff;
  --boo-text: #1f2a22;

  --boo-font-body: "Poppins", sans-serif;
  --boo-font-soft: "DynaPuff", cursive;
  --boo-font-display: "The Jungle", cursive;

  --boo-container: 1200px;
  --boo-radius: 20px;
  --boo-transition: 0.25s ease;
  --boo-shadow: 0 10px 30px rgba(39, 62, 44, 0.08);
}


/* ============================= */
/* RESET */
/* ============================= */

*,
*::before,
*::after{
  box-sizing: border-box;
}

html{
  scroll-behavior: smooth;
}

body{
  margin: 0;
  padding: 0;
  font-family: var(--boo-font-body);
  color: var(--boo-text);
  background: var(--boo-white);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img,
video{
  display: block;
  max-width: 100%;
  height: auto;
}

a{
  color: inherit;
  text-decoration: none;
  transition: var(--boo-transition);
}

button,
input,
textarea,
select{
  font: inherit;
}


/* ============================= */
/* LAYOUT */
/* ============================= */

.boo-shell{
  width: 100%;
  max-width: var(--boo-container);
  margin: 0 auto;
  padding-left: 20px;
  padding-right: 20px;
}


/* ============================= */
/* BUTTON */
/* ============================= */

.boo-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 50px;
  padding: 13px 22px;
  border: none;
  border-radius: 999px;
  background: var(--boo-gold);
  color: var(--boo-white);
  font-family: var(--boo-font-body);
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  transition: transform var(--boo-transition), background var(--boo-transition), color var(--boo-transition), box-shadow var(--boo-transition);
}

.boo-btn:hover{
  transform: translateY(-2px);
  box-shadow: var(--boo-shadow);
}

.boo-btn:focus-visible{
  outline: 2px solid var(--boo-green);
  outline-offset: 3px;
}


/* ============================= */
/* TYPOGRAPHY */
/* ============================= */

h1, h2, h3{
  margin: 0;
  line-height: 1.2;
}

/* ÖZEL FONT CLASSLARI */
.boo-font-display{
  font-family: var(--boo-font-display);
}

.boo-font-soft{
  font-family: var(--boo-font-soft);
}


/* ============================= */
/* SECTION HEAD */
/* ============================= */

.boo-section-head__eyebrow{
  margin: 0 0 8px;
  color: var(--boo-gold);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.boo-section-head h2{
  margin: 0;
  font-family: var(--boo-font-display);
  font-size: clamp(28px, 4vw, 48px);
  line-height: 1.1;
  color: var(--boo-green);
}