*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }

:root {
  --gold:      #D0B870;
  --gold-hi:   #F0E0A8;
  --gold-mid:  #C4A862;
  --gold-deep: #8A6C38;
  --gold-brush: linear-gradient(108deg,
    #C4922A 0%,
    #E8C84A 10%,
    #F5E080 22%,
    #EDD060 32%,
    #D4AA3C 44%,
    #F0D870 54%,
    #FDF0A0 62%,
    #E8C84A 72%,
    #C8A030 84%,
    #E4C460 92%,
    #F2DC88 100%);
  --gold-satin: linear-gradient(108deg,
    #C4A862 0%,
    #DEC880 18%,
    #F0E0A8 30%,
    #E8D090 42%,
    #D0B468 55%,
    #E4CA88 68%,
    #F4E4B4 80%,
    #DCC07A 92%,
    #C8A860 100%);
  --gold-brush2: linear-gradient(108deg,
    #C4A862 0%, #E4CA88 25%, #F4E4B4 50%, #E4CA88 75%, #C4A862 100%);
  --black:#060606; --dark:#0E0E0E; --dark2:#131313; --dark3:#191919;
  --white:#F0EDE6; --off:#F0EDE6; --muted:#FFFFFF;
}


/* ==========================================================================
   Variabile & Setup
   ========================================================================== */
   
.bg-skyblack {
	background-color: #0a0a0a;
	color:#fff;
	padding:3px;
	border-radius:5px;
}	
   
:root {
    --skyblack: #0a0a0a;
    --skydark: #171717;
    --skyaccent: #e5e7eb;
    --text-main: #0a0a0a;
    --text-muted: #71717a;
    --text-light: #a1a1aa;
    --bg-main: #fcfcfc;
    --bg-white: #ffffff;
    --border-color: #f4f4f5;
    
    --font-display: 'Montserrat', sans-serif;
    --font-body: 'Inter', sans-serif;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: var(--font-body);
    background-color: var(--bg-main);
    color: var(--text-main);
    -webkit-font-smoothing: antialiased;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

a {
    text-decoration: none;
    color: inherit;
    transition: all 0.3s ease;
}

/* ==========================================================================
   Layout & Componente Comune
   ========================================================================== */
.container {
    max-w-width: 1200px;
    margin: 0 auto;
    padding: 0 1.5rem;
    width: 100%;
}

main {
    flex-grow: 1;
}

/* ==========================================================================
   Header & Navigare
   ========================================================================== */
.site-header {
    background-color: var(--skyblack);
    color: var(--bg-white);
    position: sticky;
    top: 0;
    z-index: 50;
    padding: 1.5rem 0;
}

.site-header .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo {
    font-family: var(--font-display);
    font-size: 1.5rem;
    font-weight: 900;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.logo span {
    color: var(--text-light);
    font-weight: 300;
    margin-left: 0.25rem;
}

.main-nav {
    display: none;
}

.main-nav a {
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #d4d4d8;
    margin-left: 2.5rem;
}

.main-nav a:hover, .main-nav a.active {
    color: var(--bg-white);
}

.main-nav a.active {
    border-bottom: 1px solid var(--bg-white);
    padding-bottom: 4px;
}

@media (min-width: 768px) {
    .main-nav { display: flex; }
}

/* ==========================================================================
   Pagina Lista de Articole (Grid)
   ========================================================================== */
.hero-list {
    background-color: var(--skyblack);
    color: var(--bg-white);
    padding: 6rem 0;
    text-align: center;
}

.hero-list h1 {
    font-family: var(--font-display);
    font-size: clamp(2.5rem, 5vw, 4rem);
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: -0.05em;
    margin-bottom: 1.5rem;
}

.hero-list p {
    color: var(--text-light);
    font-size: 1.125rem;
    font-weight: 300;
    max-width: 600px;
    margin: 0 auto;
}

.articles-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 4rem 2rem;
    padding: 5rem 0;
}

@media (min-width: 768px) {
    .articles-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1024px) {
    .articles-grid { grid-template-columns: repeat(3, 1fr); }
}

.card {
    display: flex;
    flex-direction: column;
}

.card-image-wrap {
    display: block;
    position: relative;
    height: 250px;
    overflow: hidden;
    background-color: var(--border-color);
    margin-bottom: 1.5rem;
}

.card-image-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: grayscale(90%);
    opacity: 0.9;
    transition: transform 0.7s ease, filter 0.7s ease;
}

.card:hover .card-image-wrap img {
    filter: grayscale(0);
    transform: scale(1.05);
}

.card-category {
    position: absolute;
    top: 1rem;
    left: 1rem;
    background-color: var(--skyblack);
    color: var(--bg-white);
    font-family: var(--font-display);
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    padding: 0.35rem 0.75rem;
}

.card-meta {
    font-family: var(--font-display);
    font-size: 0.65rem;
    font-weight: 700;
    color: var(--text-light);
    text-transform: uppercase;
    letter-spacing: 0.15em;
    margin-bottom: 0.75rem;
}

.card-title {
    font-family: var(--font-display);
    font-size: 1.5rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    line-height: 1.2;
    margin-bottom: 0.75rem;
}

.card:hover .card-title { color: var(--text-muted); }

.card-excerpt {
    color: var(--text-muted);
    font-size: 0.875rem;
    font-weight: 300;
    line-height: 1.6;
    margin-bottom: 1.5rem;
    flex-grow: 1;
}

.card-footer {
    margin-top: auto;
    padding-top: 1rem;
    border-top: 1px solid var(--border-color);
}

.card-read-more {
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color: var(--skyblack);
    display: inline-flex;
    align-items: center;
}

.card:hover .card-read-more { padding-left: 0.5rem; }

/* ==========================================================================
   Pagina Detalii Articol
   ========================================================================== */
.article-hero {
    width: 100%;
    height: 50vh;
    min-height: 400px;
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.article-hero-overlay {
    position: absolute;
    inset: 0;
    background-color: rgba(10, 10, 10, 0.6);
}

.article-hero-content {
    position: relative;
    z-index: 10;
    color: var(--bg-white);
    padding: 0 1.5rem;
    max-width: 800px;
}

.article-category-badge {
    font-family: var(--font-display);
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    border: 1px solid rgba(255, 255, 255, 0.3);
    background-color: rgba(0, 0, 0, 0.2);
    backdrop-filter: blur(4px);
    padding: 0.25rem 0.75rem;
    display: inline-block;
    margin-bottom: 1.5rem;
}

.article-hero h1 {
    font-family: var(--font-display);
    font-size: clamp(2rem, 4vw, 3.5rem);
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: -0.05em;
    line-height: 1.1;
}

.article-container {
    max-width: 800px;
    margin: -4rem auto 4rem;
    background-color: var(--bg-white);
    position: relative;
    z-index: 20;
    padding: 3rem 2rem;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    border-top: 4px solid var(--skyblack);
}

.article-meta-header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 1.5rem;
    padding-bottom: 2rem;
    margin-bottom: 2.5rem;
    border-bottom: 1px solid var(--border-color);
}

.author-info {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.author-avatar {
    width: 3rem;
    height: 3rem;
    background-color: var(--skydark);
    color: var(--bg-white);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 0.875rem;
}

.author-details h4 {
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--skyblack);
}

.author-details p {
    font-size: 0.75rem;
    color: var(--text-muted);
    font-weight: 300;
    margin-top: 0.125rem;
}

.publish-info {
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--text-muted);
    text-align: left;
}

@media (min-width: 600px) {
    .publish-info { text-align: right; }
}

.publish-info p { margin-bottom: 0.5rem; }
.publish-info p:last-child { margin-bottom: 0; }

/* Stilizare conținut HTML (Markdown / Editor) */
.prose { max-width: 100%; }
.prose UL { list-style-type:none;padding-top:5px; }
.prose LI { margin-left:20px; }

.prose UL > LI { padding-bottom: 5px }
.prose UL > LI:last-item { padding-bottom:0px }
.prose hr { display: none }
.prose h1 {
	    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(1.6rem, 1.9vw, 2.2rem);
    font-weight: 300;
    line-height: 1.05;
    color: var(--white);
	margin-top:25px;
	margin-bottom:10px;
}
.prose h2 {
	    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(1.4rem, 1.7vw, 1.9rem);
    font-weight: 300;
    line-height: 1.05;
    color: var(--white);
	margin-top:25px;
	margin-bottom:10px;
}

.prose h3 {
	    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(1rem, 1vw, 1.5rem);
    font-weight: 300;
    line-height: 1.05;
    color: var(--white);
	margin-top:25px;
	margin-bottom:10px;
}
.prose p {
	padding-top:15px;
	line-height: 25.84px;
}

.article-tags {
    margin-top: 4rem;
    padding-top: 2rem;
    border-top: 1px solid var(--border-color);
}

.article-tags h3 {
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--text-light);
    text-transform: uppercase;
    letter-spacing: 0.15em;
    margin-bottom: 1rem;
}

.tags-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.tag {
    background-color: var(--bg-main);
    border: 1px solid #e4e4e7;
    color: var(--skyblack);
    padding: 0.25rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.tag:hover {
    background-color: var(--skyblack);
    color: var(--bg-white);
}

.back-button-wrap {
    margin-top: 4rem;
    padding-top: 2.5rem;
    border-top: 1px solid var(--border-color);
    text-align: center;
}

.btn-outline {
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color: var(--skyblack);
    border: 1px solid var(--skyblack);
    padding: 1rem 2rem;
    display: inline-block;
}

.btn-outline:hover {
    background-color: var(--skyblack);
    color: var(--bg-white);
}


/* ==========================================================================
   Sistem Grid
   ========================================================================== */
.grid { 
    display: grid; 
}

/* Gaps (Spațieri între elementele grilei) */
.gap-4 { gap: 1rem; }
.gap-6 { gap: 1.5rem; }
.gap-8 { gap: 2rem; }
.gap-10 { gap: 2.5rem; }
.gap-16 { gap: 4rem; }
.gap-x-8 { column-gap: 2rem; }
.gap-y-16 { row-gap: 4rem; }

/* Coloane de bază (Mobile First) */
.grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* ==========================================================================
   Flexbox & Alinieri
   ========================================================================== */
.flex { display: flex; }
.flex-col { flex-direction: column; }
.flex-row { flex-direction: row; }
.flex-wrap { flex-wrap: wrap; }
.flex-grow { flex-grow: 1; }

.items-center { align-items: center; }
.items-start { align-items: flex-start; }
.items-end { align-items: flex-end; }

.justify-center { justify-content: center; }
.justify-between { justify-content: space-between; }
.justify-end { justify-content: flex-end; }

/* ==========================================================================
   Containere & Dimensiuni
   ========================================================================== */
.w-full { width: 100%; }
.h-full { height: 100%; }
.min-h-screen { min-height: 100vh; }

.max-w-7xl { max-width: 80rem; /* 1280px */ }
.max-w-4xl { max-width: 56rem; /* 896px */ }
.max-w-3xl { max-width: 48rem; /* 768px */ }

.mx-auto { 
    margin-left: auto; 
    margin-right: auto; 
}

/* ==========================================================================
   Media Queries (Responsive)
   ========================================================================== */
/* Tablete (>= 768px) */
@media (min-width: 768px) {
    /* Folosim \: pentru a "scăpa" caracterul două puncte, altfel CSS-ul crapă */
    .md\:grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
    .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    
    .md\:flex-row { flex-direction: row; }
    .md\:flex-col { flex-direction: column; }
}

/* Desktop (>= 1024px) */
@media (min-width: 1024px) {
    .lg\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .lg\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}


html { scroll-behavior:smooth; }
body { background:var(--black); color:var(--white); font-family:'Barlow',sans-serif; font-weight:300; overflow-x:hidden; }
::-webkit-scrollbar{width:3px} ::-webkit-scrollbar-track{background:var(--black)} ::-webkit-scrollbar-thumb{background:var(--gold-deep)}

/* ════ NAV ════ */
nav {
  position:fixed; top:0; left:0; right:0; z-index:200;
  height:82px; display:flex; align-items:center; justify-content:space-between;
  padding:0 3.5rem;
  background:#060606;
  border-bottom:1px solid rgba(200,170,114,0.25);
  box-shadow:0 2px 40px rgba(0,0,0,0.8);
}
.nav-logo{display:flex;align-items:center;text-decoration:none;}
.nav-logo-img{height:72px;width:auto;display:block;}



.nav-links{display:flex;align-items:center;gap:2rem;list-style:none;}
.nav-links a{color:rgba(255,255,255,.9);text-decoration:none;font-size:.83rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;transition:color .2s;}
.nav-links a:hover{color:var(--gold-hi);}
.nav-phone{color:var(--gold)!important;font-weight:600!important;letter-spacing:.08em!important;font-size:.83rem!important;}
.nav-cta{background:var(--gold-satin)!important;-webkit-text-fill-color:#060606!important;color:#060606!important;padding:.5rem 1.4rem;font-size:.83rem!important;font-weight:700!important;transition:opacity .2s!important;}
.nav-cta:hover{opacity:.82;}

/* ════════════════════════════════════════════════
   HERO  —  text LEFT  |  jet flying in from RIGHT
   clouds animate in background behind jet
════════════════════════════════════════════════ */
.hero {
  position:relative;
  overflow:hidden;
  background:var(--black);
  display:flex;
  align-items:flex-start;
  margin-top:-82px;
  padding-top:0;
}

/* ── Deep sky gradient behind everything ── */
.hero-sky {
  position:absolute; inset:0; z-index:0;
  background:
    radial-gradient(ellipse 80% 60% at 70% 40%, rgba(8,14,32,0.9) 0%, transparent 70%),
    radial-gradient(ellipse 50% 50% at 100% 100%, rgba(6,6,6,1) 0%, transparent 60%),
    linear-gradient(160deg, #06080F 0%, #060608 60%, #060606 100%);
}

/* ══════════════════════════════════════
   MOVING CLOUD LAYERS — 3 depths
══════════════════════════════════════ */
.clouds {
  position:absolute; inset:0; z-index:1;
  overflow:hidden; pointer-events:none;
}

/* Each layer is 200% wide, half = 1 viewport-worth of clouds */
.c-layer { position:absolute; left:0; right:0; }
.c-layer-far   { top:0; bottom:0; }
.c-layer-mid   { top:0; bottom:0; }
.c-layer-near  { bottom:0; height:55%; }

.c-strip {
  display:flex;
  width:200%; height:100%;
  will-change:transform;
}
.c-strip-far   { animation: driftR 90s linear infinite; }
.c-strip-mid   { animation: driftL 60s linear infinite; }
.c-strip-near  { animation: driftR 38s linear infinite; }

@keyframes driftR {
  from { transform:translateX(-50%); }
  to   { transform:translateX(0%);   }
}
@keyframes driftL {
  from { transform:translateX(0%);   }
  to   { transform:translateX(-50%); }
}

/* Cloud segments — each segment = 50% of strip width */
.c-seg {
  flex-shrink:0;
  width:50%; height:100%;
  position:relative;
}

/* Cloud blob helper */
.cb {
  position:absolute;
  border-radius:50%;
  background:rgba(255,248,235,1);
}

/* ── Far layer blobs (very subtle, large, slow) ── */
.c-layer-far .cb { opacity:.08; }
.c-layer-far .cb:nth-child(1) { width:55%; height:35%; top:18%; left:5%;  filter:blur(70px); }
.c-layer-far .cb:nth-child(2) { width:45%; height:30%; top:12%; left:52%; filter:blur(65px); }
.c-layer-far .cb:nth-child(3) { width:38%; height:28%; top:55%; left:15%; filter:blur(60px); }
.c-layer-far .cb:nth-child(4) { width:42%; height:32%; top:60%; left:58%; filter:blur(68px); }

/* ── Mid layer blobs (medium opacity, varied height) ── */
.c-layer-mid .cb { opacity:.13; }
.c-layer-mid .cb:nth-child(1) { width:62%; height:40%; top:55%; left:0%;  filter:blur(52px); }
.c-layer-mid .cb:nth-child(2) { width:50%; height:38%; top:62%; left:48%; filter:blur(48px); }
.c-layer-mid .cb:nth-child(3) { width:40%; height:32%; top:30%; left:20%; filter:blur(55px); opacity:.07; }
.c-layer-mid .cb:nth-child(4) { width:35%; height:28%; top:25%; left:65%; filter:blur(50px); opacity:.06; }

/* ── Near layer blobs (most visible, bottom of frame, fastest) ── */
.c-layer-near .cb { opacity:.22; }
.c-layer-near .cb:nth-child(1) { width:70%; height:70%; top:30%; left:-5%; filter:blur(42px); }
.c-layer-near .cb:nth-child(2) { width:60%; height:65%; top:40%; left:45%; filter:blur(38px); }
.c-layer-near .cb:nth-child(3) { width:50%; height:60%; top:20%; left:22%; filter:blur(44px); opacity:.16; }

/* ── Jet photograph — RIGHT side, flying in ── */
.hero-photo {
  position:absolute;
  right:0; left:0;
  top:0; bottom:0;
  width:100%;
  height:100%;
  z-index:1;
  overflow:hidden;
}
.hero-photo img {
  width:100%; height:100%;
  object-fit:cover;
  object-position:58% center;
  filter:brightness(0.88) contrast(1.08) saturate(1.08);
  animation:jetDrift 18s ease-in-out infinite alternate;
  transform-origin:58% 50%;
  will-change:transform;
}
@keyframes jetDrift {
  from { transform:translateY(0px);  }
  to   { transform:translateY(-8px); }
}

/* Left-edge fade: jet bleeds into dark left side */
.hero-photo::before {
  content:'';
  position:absolute;
  left:0; top:0; bottom:0; width:50%;
  background:linear-gradient(to right,
    rgba(6,6,6,.9)   0%,
    rgba(6,6,6,.6)   35%,
    rgba(6,6,6,.2)   65%,
    transparent      100%);
  z-index:3; pointer-events:none;
}
/* Top + bottom vignette on photo */
.hero-photo::after {
  content:'';
  position:absolute; inset:0;
  background:
    linear-gradient(to bottom, rgba(6,6,6,.45) 0%, transparent 18%),
    linear-gradient(to top,    rgba(6,6,6,.65) 0%, transparent 25%),
    linear-gradient(to right,  transparent 60%, rgba(6,6,6,.35) 100%);
  z-index:3; pointer-events:none;
}

/* Solid left-side backing so text reads cleanly */
.hero-left-bg {
  position:absolute;
  left:0; top:0; bottom:0;
  width:68%;
  background:linear-gradient(to right,
    rgba(6,6,6,1)    0%,
    rgba(6,6,6,1)    25%,
    rgba(6,6,6,.92)  36%,
    rgba(6,6,6,.78)  46%,
    rgba(6,6,6,.55)  56%,
    rgba(6,6,6,.28)  68%,
    rgba(6,6,6,.08)  82%,
    transparent      100%);
  z-index:3; pointer-events:none;
}

/* ── Text content — LEFT aligned ── */
.hero-content {
  position:relative; z-index:5;
  width:100%; max-width:1360px;
  margin:0 auto;
  padding:0 3.5rem;
  display:flex;
  justify-content:flex-start;
  align-items:flex-start;
}
.hero-text {
  width:48%;
  padding:calc(82px + 82px + 4rem) 0 0;
}

/* Eyebrow */
.hero-eyebrow {
  display:flex; align-items:center; gap:.85rem;
  font-family:'Barlow Condensed',sans-serif;
  font-size:.78rem; font-weight:600; letter-spacing:.42em; text-transform:uppercase;
  color:var(--gold); margin-bottom:1.6rem;
  animation:fadeUp .9s ease both;
}
.hero-eyebrow::before{content:'';display:block;width:36px;height:1px;background:var(--gold-brush2);flex-shrink:0;}

/* Title */
.hero-title {
  font-family:'Barlow Condensed',sans-serif;
  font-weight:700; font-size:clamp(2.8rem,5.2vw,5.8rem);
  text-transform:uppercase; line-height:.93; letter-spacing:.015em;
  color:var(--white);
  animation:fadeUp .9s ease .1s both;
  text-shadow:0 2px 30px rgba(0,0,0,.6);
}
.hero-title .brushed {
  display:block;
  background:var(--gold-brush);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}
.hero-title .block { display:block; }

.hero-sub {
  margin-top:1.8rem; font-size:1.02rem; line-height:1.88;
  color:var(--white); font-weight:300; max-width:430px;
  animation:fadeUp .9s ease .2s both;
  text-shadow:0 1px 8px rgba(0,0,0,.6);
}
.hero-tags {
  margin-top:1rem; font-family:'Barlow Condensed',sans-serif;
  font-size:.9rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold-mid);
  animation:fadeUp .9s ease .28s both;
}
.hero-actions {
  margin-top:1.5rem; display:flex; gap:1rem; flex-wrap:wrap;
  animation:fadeUp .9s ease .36s both;
}

/* Stats row */
.hero-stats {
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  margin-top:1.25rem;
  background:rgba(200,170,114,.15);
  animation:fadeUp .9s ease .44s both;
}
.hstat {
  background:rgba(6,6,6,.82);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  padding:1.3rem 1rem;
  transition:border-bottom-color .3s;
  border-bottom:1px solid transparent;
}
.hstat:hover { border-bottom-color:rgba(200,170,114,.45); }
.hstat-num { font-family:'Cormorant Garamond',serif; font-size:2.1rem; font-weight:300; line-height:1; background:var(--gold-brush); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.hstat-lbl { font-size:.68rem; letter-spacing:.2em; text-transform:uppercase; color:rgba(255,255,255,0.82); margin-top:.22rem; }

/* Contact bar */
.hero-bar {
  display:flex; margin-top:1px;
  animation:fadeUp .9s ease .52s both;
}
.hbar-cell {
  flex:1; padding:.9rem 1rem;
  background:rgba(6,6,6,.82); backdrop-filter:blur(12px);
  border-right:1px solid rgba(200,170,114,.1);
}
.hbar-cell:last-child{border-right:none;}
.hbar-lbl { font-size:.76rem; letter-spacing:.24em; text-transform:uppercase; color:var(--gold-mid); margin-bottom:.22rem; }
.hbar-val { font-size:.98rem; font-weight:500; color:var(--white); }
.hbar-val a { color:var(--white); text-decoration:none; transition:color .2s; }
.hbar-val a:hover { color:var(--gold-hi); }

@keyframes fadeUp {
  from{opacity:0;transform:translateY(22px)}
  to  {opacity:1;transform:translateY(0)}
}

/* ── Buttons ── */
.btn-gold {
  background:var(--gold-satin); color:#060606; -webkit-text-fill-color:#060606;
  text-decoration:none; padding:.92rem 2.3rem;
  font-family:'Barlow Condensed',sans-serif; font-weight:700; font-size:.88rem;
  letter-spacing:.22em; text-transform:uppercase;
  transition:opacity .2s, transform .15s;
  display:inline-block; border:none; cursor:pointer; position:relative; overflow:hidden;
}
.btn-gold::after{content:'';position:absolute;inset:0;background:rgba(255,255,255,.08);opacity:0;transition:opacity .2s;}
.btn-gold:hover::after{opacity:1;} .btn-gold:hover{transform:translateY(-1px);}
.btn-outline{color:rgba(255,255,255,.85);text-decoration:none;padding:.92rem 2.3rem;font-family:'Barlow Condensed',sans-serif;font-weight:600;font-size:.88rem;letter-spacing:.22em;text-transform:uppercase;border:1px solid rgba(200,170,114,.35);transition:border-color .2s,color .2s;display:inline-block;}
.btn-outline:hover{border-color:var(--gold);color:var(--gold-hi);}

/* ════ MARQUEE ════ */
.marquee-wrap{overflow:hidden;padding:1.1rem 0;background:var(--gold-satin);margin-top:5.5rem;margin-bottom:5.5rem;}
.marquee-track{display:flex;animation:marquee 32s linear infinite;white-space:nowrap;}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.marquee-item{font-family:'Barlow Condensed',sans-serif;font-size:.95rem;font-weight:700;letter-spacing:.3em;text-transform:uppercase;color:rgba(0,0,0,1);padding:0 2.5rem;}
.marquee-sep{color:rgba(6,6,6,.3);padding:0;}

/* ════ SHARED ════ */
section{position:relative;z-index:1;}
.wrap{max-width:1360px;margin:0 auto;padding:0 3.5rem;}
.eyebrow{display:flex;align-items:center;gap:.85rem;font-family:'Barlow Condensed',sans-serif;font-size:.87rem;font-weight:600;letter-spacing:.4em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem;}
.eyebrow::before{content:'';display:block;width:28px;height:1px;background:var(--gold-brush2);flex-shrink:0;}
.s-title{font-family:'Cormorant Garamond',serif;font-size:clamp(2.4rem,3.7vw,3.9rem);font-weight:300;line-height:1.05;color:var(--white);}

/* ════ VALUES ════ */
.values-section{padding:1.5rem 0 1.5rem;background:var(--dark);}
.values-layout{display:grid;grid-template-columns:1fr 1.65fr;gap:5rem;align-items:start;margin-top:3.5rem;}
.values-side p{font-size:1rem;line-height:1.9;color:var(--white);font-weight:300;margin-top:1.5rem;}
.gen-tag{margin-top:2rem;display:inline-flex;align-items:center;gap:.65rem;font-family:'Barlow Condensed',sans-serif;font-size:.88rem;font-weight:600;letter-spacing:.25em;text-transform:uppercase;color:var(--gold-mid);border:1px solid rgba(200,170,114,.2);padding:.5rem 1rem;}
.values-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(200,170,114,.1);}
.val-card{background:var(--dark2);padding:2.25rem;transition:background .3s;}
.val-card:hover{background:var(--dark3);}
.val-icon-ring{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:1.3rem;border:1px solid rgba(200,170,114,.28);transition:background .3s,border-color .3s;}
.val-card:hover .val-icon-ring{background:var(--gold-brush);border-color:transparent;}
.val-icon-ring svg{width:18px;height:18px;stroke:var(--gold);transition:stroke .3s;}
.val-card:hover .val-icon-ring svg{stroke:#060606;}
.val-name{font-family:'Barlow Condensed',sans-serif;font-size:1.1rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--white);margin-bottom:.65rem;}
.val-desc{font-size:.92rem;line-height:1.8;color:rgba(255,255,255,0.82);font-weight:300;}

/* ════ SERVICES ════ */
.services-section{padding:7rem 0;background:var(--black);}
.services-hdr{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:3.5rem;gap:2rem;}
.services-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(200,170,114,.08);}
.svc-card{background:var(--dark2);padding:2.25rem 1.75rem;position:relative;overflow:hidden;transition:background .3s;}
.svc-card::before{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--gold-brush);transform:scaleX(0);transform-origin:left;transition:transform .35s ease;}
.svc-card:hover{background:var(--dark3);} .svc-card:hover::before{transform:scaleX(1);}
.svc-num{font-family:'Cormorant Garamond',serif;font-size:2.5rem;font-weight:300;line-height:1;margin-bottom:1.2rem;background:var(--gold-brush);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;opacity:1;transition:opacity .3s;}
.svc-card:hover .svc-num{opacity:1;}
.svc-name{font-family:'Barlow Condensed',sans-serif;font-size:1.08rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--white);margin-bottom:.7rem;line-height:1.3;}
.svc-desc{font-size:.9rem;line-height:1.78;color:rgba(255,255,255,0.82);font-weight:300;}
.svc-subs{list-style:none;margin-top:1rem;display:flex;flex-direction:column;gap:.32rem;}
.svc-subs li{font-size:.83rem;color:var(--white);display:flex;align-items:center;gap:.5rem;font-weight:300;}
.svc-subs li::before{content:'';display:block;width:14px;height:1px;background:var(--gold-brush2);flex-shrink:0;}

/* ════ AOG ════ */
.aog-band{position:relative;overflow:hidden;background:var(--gold-satin);}
.aog-band::before{content:'AOG';position:absolute;left:-1rem;top:50%;transform:translateY(-50%);font-family:'Barlow Condensed',sans-serif;font-size:14rem;font-weight:900;color:rgba(6,6,6,.06);line-height:1;pointer-events:none;white-space:nowrap;}
.aog-inner{max-width:1360px;margin:0 auto;padding:3.75rem 3.5rem;display:flex;align-items:center;justify-content:space-between;gap:3rem;position:relative;z-index:1;}
.aog-left .aog-label{font-family:'Barlow Condensed',sans-serif;font-size:.78rem;font-weight:700;letter-spacing:.38em;text-transform:uppercase;color:rgba(6,6,6,1);margin-bottom:.6rem;}
.aog-left h2{font-family:'Barlow Condensed',sans-serif;font-size:clamp(1.85rem,2.9vw,3.1rem);font-weight:700;text-transform:uppercase;color:var(--black);line-height:1.05;letter-spacing:.02em;margin-bottom:.85rem;}
.aog-left p{font-size:.98rem;line-height:1.8;color:rgba(6,6,6,1);max-width:500px;font-weight:300;}
.aog-coverage{margin-top:.75rem;font-family:'Barlow Condensed',sans-serif;font-size:.8rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:rgba(6,6,6,1);}
.aog-right{flex-shrink:0;text-align:center;}
.aog-phone{font-family:'Barlow Condensed',sans-serif;font-size:clamp(2.1rem,3.3vw,3.5rem);font-weight:700;color:var(--black);text-decoration:none;letter-spacing:.03em;display:block;line-height:1;margin-bottom:.3rem;transition:opacity .2s;}
.aog-phone:hover{opacity:.7;}
.aog-phone-lbl{font-size:.8rem;font-weight:700;letter-spacing:.3em;text-transform:uppercase;color:rgba(6,6,6,.65);margin-bottom:1.25rem;}
.aog-cta{display:inline-block;background:var(--black);color:var(--gold-hi);text-decoration:none;padding:.85rem 2rem;font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:.85rem;letter-spacing:.22em;text-transform:uppercase;transition:opacity .2s;}
.aog-cta:hover{opacity:.82;}

/* ════ LOCATIONS ════ */
.locations-section{padding:7rem 0;background:var(--dark);}
.locations-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;margin-top:3.5rem;background:rgba(200,170,114,.1);}
.loc-card{background:var(--dark2);padding:2.75rem;position:relative;overflow:hidden;transition:background .3s;}
.loc-card:hover{background:var(--dark3);}
.loc-card::after{content:attr(data-code);position:absolute;right:1rem;bottom:.75rem;font-family:'Barlow Condensed',sans-serif;font-size:5.5rem;font-weight:900;letter-spacing:-.02em;line-height:1;background:var(--gold-brush);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;opacity:.05;pointer-events:none;transition:opacity .3s;}
.loc-card:hover::after{opacity:.1;}
.loc-top{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1.75rem;}
.loc-badge{display:inline-flex;align-items:center;border:1px solid rgba(200,170,114,.25);padding:.28rem .75rem;font-size:.78rem;letter-spacing:.28em;text-transform:uppercase;color:var(--gold-mid);flex-shrink:0;}
.loc-icao{font-family:'Barlow Condensed',sans-serif;font-size:.92rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:.35rem;}
.loc-name{font-family:'Cormorant Garamond',serif;font-size:2rem;font-weight:300;color:var(--white);line-height:1.1;margin-bottom:.5rem;}
.loc-address{font-size:.92rem;line-height:1.75;color:rgba(255,255,255,0.82);font-weight:300;margin-bottom:1.5rem;}
.loc-divider{width:100%;height:1px;background:var(--gold-brush2);opacity:.2;margin-bottom:1.25rem;}
.loc-features{list-style:none;display:flex;flex-direction:column;gap:.38rem;}
.loc-features li{font-size:.88rem;color:var(--white);display:flex;align-items:center;gap:.6rem;font-weight:300;}
.loc-features li::before{content:'';display:block;width:16px;height:1px;background:var(--gold-brush2);flex-shrink:0;}

/* ════ TESTIMONIALS ════ */
.testi-section{padding:7rem 0;background:var(--black);}
.testi-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;margin-top:3.5rem;background:rgba(200,170,114,.08);}
.testi-card{background:var(--dark2);padding:2.75rem;position:relative;overflow:hidden;}
.testi-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1.75rem;}
.testi-stars{display:flex;gap:3px;}
.star{width:14px;height:14px;clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);background:var(--gold-brush);}
.testi-quote{font-family:'Cormorant Garamond',serif;font-size:5rem;font-weight:300;line-height:.8;background:var(--gold-brush);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;opacity:.2;}
.testi-text{font-family:'Cormorant Garamond',serif;font-size:1.18rem;font-weight:300;font-style:italic;line-height:1.8;color:var(--white);margin-bottom:1.75rem;}
.testi-rule{width:26px;height:1px;background:var(--gold-brush2);margin-bottom:1rem;}
.testi-name{font-family:'Barlow Condensed',sans-serif;font-size:.85rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);}
.testi-role{font-size:.82rem;color:rgba(255,255,255,0.82);font-weight:300;margin-top:.18rem;}

/* ════ CONTACT ════ */
.contact-section{padding:7rem 0;background:var(--dark);}
.contact-layout{display:grid;grid-template-columns:1.15fr 1fr;gap:5rem;margin-top:3.5rem;align-items:start;}
.contact-form label{display:block;font-family:'Barlow Condensed',sans-serif;font-size:.78rem;font-weight:400;letter-spacing:.22em;text-transform:uppercase;color:#ffffff;margin-bottom:.42rem;margin-top:0;}
.contact-form label:first-of-type{margin-top:0;}
.contact-form input,.contact-form select,.contact-form textarea{width:100%;background:rgba(255,255,255,.03);border:1px solid rgba(200,170,114,.2);color:var(--white);padding:.82rem 1rem;font-family:'Barlow',sans-serif;font-size:.88rem;font-weight:300;outline:none;transition:border-color .2s;border-radius:0;-webkit-appearance:none;appearance:none;}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:var(--gold);}
.contact-form input::placeholder,.contact-form textarea::placeholder{color:rgba(255,255,255,0.55);}
.contact-form select option{background:var(--dark2);}
.contact-form textarea{resize:vertical;min-height:90px;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:.85rem;}
.contact-aside h3{font-family:'Cormorant Garamond',serif;font-size:1.75rem;font-weight:300;color:var(--white);line-height:1.2;margin-bottom:.5rem;}
.contact-aside .tagline{font-size:.95rem;color:var(--white);line-height:1.75;font-weight:300;margin-bottom:2rem;}
.ci{margin-bottom:1.4rem;}
.ci .lbl{font-size:.8rem;letter-spacing:.28em;text-transform:uppercase;color:var(--gold-mid);margin-bottom:.28rem;}
.ci .val{font-size:1.06rem;color:var(--white);font-weight:300;line-height:1.65;}
.ci .val a{color:var(--white);text-decoration:none;transition:color .2s;}
.ci .val a:hover{color:var(--gold-hi);}
.ci-sep{width:34px;height:1px;background:var(--gold-brush2);opacity:.35;margin:1.75rem 0;}

/* ════ FOOTER ════ */
footer{background:var(--black);border-top:1px solid rgba(200,170,114,.1);padding:0.75rem 3.5rem;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem;}
.footer-brand{font-family:'Barlow Condensed',sans-serif;font-size:.9rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;background:var(--gold-brush);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.footer-nav{display:flex;gap:1.75rem;list-style:none;}
.footer-nav a{font-size:.87rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,1);text-decoration:none;transition:color .2s;}
.footer-nav a:hover{color:var(--gold);}
.footer-copy{font-size:.87rem;color:rgba(255,255,255,0.85);}

/* ════ RESPONSIVE ════ */
@media(max-width:1200px){.services-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:1024px){
  nav{padding:0 1.75rem;} .wrap{padding:0 1.75rem;}
  .hero-content{padding:0 1.75rem;}
  .hero-text{width:100%;padding-bottom:3rem;}
  .hero-photo{width:100%;right:0;}
  .hero-photo::before{width:100%;background:linear-gradient(to top,rgba(6,6,6,.95) 0%,rgba(6,6,6,.55) 50%,transparent 100%);}
  .hero-left-bg{width:100%;background:linear-gradient(to top,rgba(6,6,6,.9) 0%,rgba(6,6,6,.4) 60%,transparent 100%);}
  .hero-stats{grid-template-columns:repeat(4,1fr);}
  .values-layout{grid-template-columns:1fr;gap:2.5rem;}
  .aog-inner{padding:3rem 1.75rem;flex-direction:column;text-align:center;}
  .contact-layout{grid-template-columns:1fr;gap:3rem;}
  footer{padding:1.5rem 1.75rem;}
}
@media(max-width:768px){
  .nav-links{display:none;}
  .hero-stats{grid-template-columns:repeat(2,1fr);}
  .services-grid{grid-template-columns:1fr;}
  .locations-grid{grid-template-columns:1fr;}
  .testi-grid{grid-template-columns:1fr;}
  .form-row{grid-template-columns:1fr;}
  .services-hdr{flex-direction:column;align-items:flex-start;}
  footer{flex-direction:column;text-align:center;}
  .footer-nav{justify-content:center;flex-wrap:wrap;gap:1rem;}
}






/* ══ QUOTE MODAL ══ */
.modal-overlay{position:fixed;inset:0;z-index:9000;background:rgba(0,0,0,.78);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:1rem;opacity:0;pointer-events:none;transition:opacity .3s ease;}
.modal-overlay.open{opacity:1;pointer-events:all;}
.modal-box{
  background:#0e0e0e;
  border:1.5px solid #C4A862;
  width:min(560px,94vw);
  padding:2.4rem 2.6rem 2rem;
  position:relative;
  transform:translateY(20px);
  transition:transform .35s ease;
  border-radius:3px;
  box-shadow:0 0 60px rgba(196,168,98,.12);
}
.modal-overlay.open .modal-box{transform:translateY(0);}
.modal-close{position:absolute;top:1rem;right:1.2rem;background:none;border:none;cursor:pointer;color:rgba(255,255,255,.45);font-size:1.3rem;line-height:1;transition:color .2s;padding:0;font-family:sans-serif;}
.modal-close:hover{color:#D0B870;}
.modal-eyebrow-row{display:flex;align-items:center;gap:.7rem;margin-bottom:.55rem;}
.modal-eyebrow-line{width:32px;height:1.5px;background:linear-gradient(to right,#C4A862,#E8C84A);}
.modal-eyebrow-text{font-family:'Barlow Condensed',sans-serif;font-size:.85rem;font-weight:600;letter-spacing:.38em;text-transform:uppercase;color:#C4A862;}
.modal-title{font-family:'Cormorant Garamond',serif;font-size:2.5rem;font-weight:300;color:#F0EDE6;line-height:1.1;margin-bottom:.55rem;}
.modal-subtitle{font-size:.92rem;color:rgba(255,255,255,.55);margin-bottom:1.6rem;font-family:'Barlow',sans-serif;font-weight:300;}
.modal-grid{display:grid;grid-template-columns:1fr 1fr;gap:.85rem 1rem;margin-bottom:.85rem;}
.modal-field{display:flex;flex-direction:column;gap:.32rem;}
.modal-field.full{grid-column:1 / -1;}
.modal-label{font-family:'Barlow Condensed',sans-serif;font-size:.78rem;font-weight:400;letter-spacing:.22em;text-transform:uppercase;color:#ffffff;}
.modal-input,.modal-textarea{background:rgba(255,255,255,.04);border:1px solid rgba(196,168,98,.3);border-radius:2px;color:#F0EDE6;font-family:'Barlow',sans-serif;font-size:.95rem;padding:.72rem 1rem;outline:none;transition:border-color .2s;width:100%;box-sizing:border-box;}
.modal-input:focus,.modal-textarea:focus{border-color:rgba(196,168,98,.65);}
.modal-input::placeholder,.modal-textarea::placeholder{color:rgba(255,255,255,.2);}
.modal-textarea{resize:vertical;min-height:100px;line-height:1.55;}
.modal-submit{width:100%;margin-top:.9rem;background:linear-gradient(108deg,#C4A862 0%,#DEC880 18%,#F0E0A8 30%,#E8D090 42%,#D0B468 55%,#E4CA88 68%,#F4E4B4 80%,#DCC07A 92%,#C8A860 100%);border:none;cursor:pointer;font-family:'Barlow Condensed',sans-serif;font-size:.92rem;font-weight:700;letter-spacing:.25em;text-transform:uppercase;color:#060606;padding:1rem 2rem;transition:opacity .2s,transform .15s;display:flex;align-items:center;justify-content:center;gap:.6rem;}
.modal-submit:hover{opacity:.88;}
.modal-submit:active{transform:scale(.98);}
.modal-submit-arrow{font-size:1rem;}
.modal-aog{text-align:center;margin-top:1rem;font-family:'Barlow',sans-serif;font-size:.85rem;color:#ffffff;letter-spacing:.04em;}
.modal-aog a{color:#ffffff;text-decoration:none;}
.modal-aog a:hover{color:#D0B870;}


.contact-form .cf-field{margin-top:1.1rem;}
.form-row .cf-field{margin-top:0;}
.form-row{margin-top:1.1rem;gap:.85rem;display:grid;grid-template-columns:1fr 1fr;}


/* ==========================================================================
   Spațieri (Padding & Margin) - Bază (Mobile First)
   Formula: Valoarea * 0.25rem
   ========================================================================== */

/* --- Padding (Toate laturile) --- */
.p-4 { padding: 1rem; }
.p-6 { padding: 1.5rem; }
.p-8 { padding: 2rem; }
.p-10 { padding: 2.5rem; }

/* --- Padding Axa Y (Sus și Jos) --- */
.py-4 { padding-top: 1rem; padding-bottom: 1rem; }
.py-6 { padding-top: 1.5rem; padding-bottom: 1.5rem; }
.py-8 { padding-top: 2rem; padding-bottom: 2rem; }
.py-10 { padding-top: 2.5rem; padding-bottom: 2.5rem; }
.py-12 { padding-top: 3rem; padding-bottom: 3rem; }
.py-16 { padding-top: 4rem; padding-bottom: 4rem; }
.py-20 { padding-top: 5rem; padding-bottom: 5rem; }
.py-24 { padding-top: 6rem; padding-bottom: 6rem; }
.py-32 { padding-top: 8rem; padding-bottom: 8rem; }

/* --- Padding Axa X (Stânga și Dreapta) --- */
.px-4 { padding-left: 1rem; padding-right: 1rem; }
.px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
.px-8 { padding-left: 2rem; padding-right: 2rem; }
.px-10 { padding-left: 2.5rem; padding-right: 2.5rem; }

/* --- Padding Direcții Specifice --- */
.pt-4 { padding-top: 1rem; }
.pt-8 { padding-top: 2rem; }
.pt-10 { padding-top: 2.5rem; }
.pb-4 { padding-bottom: 1rem; }
.pb-8 { padding-bottom: 2rem; }

/* --- Margin Axa Y (Sus și Jos) --- */
.my-4 { margin-top: 1rem; margin-bottom: 1rem; }
.my-8 { margin-top: 2rem; margin-bottom: 2rem; }
.my-12 { margin-top: 3rem; margin-bottom: 3rem; }

/* --- Margin Direcții Specifice (cel mai des folosite pentru spațiere elemente) --- */
.mb-2 { margin-bottom: 0.5rem; }
.mb-4 { margin-bottom: 1rem; }
.mb-6 { margin-bottom: 1.5rem; }
.mb-8 { margin-bottom: 2rem; }
.mb-10 { margin-bottom: 2.5rem; }
.mb-12 { margin-bottom: 3rem; }
.mb-16 { margin-bottom: 4rem; }
.mb-20 { margin-bottom: 5rem; }
.mb-24 { margin-bottom: 6rem; }

.mt-4 { margin-top: 1rem; }
.mt-8 { margin-top: 2rem; }
.mt-12 { margin-top: 3rem; }
.mt-16 { margin-top: 4rem; }

/* ==========================================================================
   Media Queries - Tablete (>= 768px)
   Clasele cu prefixul md:
   ========================================================================== */
@media (min-width: 768px) {
    /* Padding */
    .md\:p-8 { padding: 2rem; }
    
    .md\:py-12 { padding-top: 3rem; padding-bottom: 3rem; }
    .md\:py-16 { padding-top: 4rem; padding-bottom: 4rem; }
    .md\:py-20 { padding-top: 5rem; padding-bottom: 5rem; }
    .md\:py-24 { padding-top: 6rem; padding-bottom: 6rem; }
    .md\:py-32 { padding-top: 8rem; padding-bottom: 8rem; }
    
    .md\:px-8 { padding-left: 2rem; padding-right: 2rem; }
    .md\:px-10 { padding-left: 2.5rem; padding-right: 2.5rem; }

    /* Margin */
    .md\:mb-10 { margin-bottom: 2.5rem; }
    .md\:mb-16 { margin-bottom: 4rem; }
    .md\:mt-10 { margin-top: 2.5rem; }
    .md\:mt-16 { margin-top: 4rem; }
}

/* ==========================================================================
   Media Queries - Desktop (>= 1024px)
   Clasele cu prefixul lg:
   ========================================================================== */
@media (min-width: 1024px) {
    /* Padding */
    .lg\:py-20 { padding-top: 5rem; padding-bottom: 5rem; }
    .lg\:py-24 { padding-top: 6rem; padding-bottom: 6rem; }
    .lg\:py-32 { padding-top: 8rem; padding-bottom: 8rem; }
    
    .lg\:px-10 { padding-left: 2.5rem; padding-right: 2.5rem; }
    .lg\:px-12 { padding-left: 3rem; padding-right: 3rem; }

    /* Margin */
    .lg\:mb-16 { margin-bottom: 4rem; }
    .lg\:mb-24 { margin-bottom: 6rem; }
}

.absolute { position: absolute }
.relative { position:relative }
.top-4 { top: 10px }
.left-4 { left: 10px }