/*
Theme Name: E_Cartop
Theme URI: https://ecartop.ro/
Author: Echipa E_Cartop & Alcaziu Robert
Author URI: https://www.alcaziurobert.ro/
Description: Temă WordPress personalizată, rapidă și optimizată pentru E_Cartop SRL.
Version: 3.3.0 (clean)
*/

/* ==========================================================================
   1) FUNDAȚIE: Variabile, reseturi, globale
   ========================================================================== */
html{box-sizing:border-box}
*,*:before,*:after{box-sizing:inherit}

:root{
  --color-primary:#1A508E;
  --color-primary-hover:#256bb9;
  --color-secondary:#2A7361;
  --color-text-main:#333333;
  --color-text-secondary:#6C757D;
  --color-bg-light:#FFFFFF;
  --color-bg-dark:#0E0E0E;
  --color-bg-off-dark:#1F2229;
  --color-border:#EAEAEA;
  --font-main:'Inter',sans-serif;
  --container-width:1200px;
  --header-height:80px;
}

body{margin:0;padding:0;font-family:var(--font-main);color:var(--color-text-main);background:#fff}
.container{width:90%;max-width:var(--container-width);margin-left:auto;margin-right:auto}
a{color:var(--color-primary);text-decoration:none;transition:color .3s ease}
a:hover{color:var(--color-primary-hover)}
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;width:1px;word-wrap:normal!important}

/* utilitare animații */
.animate-on-scroll{opacity:0;transform:translateY(20px);transition:opacity .8s ease,transform .8s ease}
.animate-on-scroll.is-visible{opacity:1;transform:none}

/* ==========================================================================
   2) CONTACT – v3.4 (actual)
   ========================================================================== */
.contact-hero-v3{padding:5rem 1rem;text-align:center;background:var(--color-bg-light)}
.contact-hero-v3 h1{margin-bottom:1rem}
.contact-hero-v3 p{font-size:1.25rem;color:var(--color-text-secondary);max-width:600px;margin:1rem auto 0;line-height:1.6}

.contact-main-v4{padding:5rem 1rem;background:var(--color-bg-light);border-top:1px solid var(--color-border)}
.contact-main-v4 .wp-block-columns{max-width:1200px;margin:0 auto;display:flex;flex-wrap:wrap;gap:4rem;align-items:center}
.contact-details-col{display:flex;flex-direction:column;gap:3rem;flex:1;min-width:300px}
.contact-map-col{flex:1.2;min-width:300px}

.contact-info-block-v2{display:flex;align-items:center;gap:1.5rem}
.contact-icon-v2{font-size:1.25rem;color:var(--color-primary);background:#f8fafc;border:1px solid var(--color-border);border-radius:12px;width:56px;height:56px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}
.contact-info-title{font-weight:600;margin:0 0 .25rem}
.contact-info-link{font-size:1.25rem;font-weight:500;color:var(--color-text-main)}
.contact-info-link:hover{color:var(--color-primary)}
.contact-info-text{margin:0;color:var(--color-text-secondary)}

.google-maps-container-v3{width:100%;height:480px;border-radius:16px;overflow:hidden;border:1px solid var(--color-border);padding:6px;background:#fff;box-shadow:0 4px 6px -1px rgba(0,0,0,.05),0 2px 4px -2px rgba(0,0,0,.05)}
.google-maps-container-v3 iframe{width:100%;height:100%;border:0;border-radius:12px}

/* apariție */
.contact-hero-v3,.contact-details-col,.contact-map-col{opacity:0;transform:translateY(30px);transition:opacity .8s ease-out,transform .8s ease-out}
.contact-hero-v3.is-visible,.contact-details-col.is-visible,.contact-map-col.is-visible{opacity:1;transform:none}
.contact-details-col.is-visible{transition-delay:.1s}
.contact-map-col.is-visible{transition-delay:.2s}

/* ==========================================================================
   3) ABOUT – v2025 (actual)
   ========================================================================== */
.about-page.v2025{background:#fff}

/* Hero */
.about-hero{padding:56px 16px 24px;text-align:center;border-bottom:1px solid var(--color-border)}
.about-hero h1{margin:0 0 .6rem;font-weight:800}
.about-hero .lede{max-width:860px;margin:0 auto .9rem;color:#475569;font-size:1.125rem;line-height:1.75}
.about-hero .button{min-width:260px}

/* Imagine card */
.about-visual{padding:18px 16px 8px}
.image-card{max-width:1100px;margin:0 auto;border:1px solid var(--color-border);border-radius:14px;overflow:hidden;box-shadow:0 14px 32px rgba(16,24,40,.10)}
.image-card img{display:block;width:100%;height:440px;object-fit:cover}
.image-card.sm img{height:300px}

/* Statistici */
.about-stats{padding:26px 16px 10px}
.stats-grid{display:grid;grid-template-columns:repeat(3,minmax(220px,1fr));gap:18px;max-width:1100px;margin:0 auto}
.stat-card{background:#f8fafc;border:1px solid var(--color-border);border-radius:14px;text-align:center;padding:26px 16px}
.stat-number{font-size:clamp(30px,5vw,44px);font-weight:800;line-height:1;color:var(--color-primary)}
.stat-label{margin-top:10px;color:#4b5563}

/* Why */
.about-why{padding:40px 16px 18px}
.why-grid{display:grid;grid-template-columns:repeat(4,minmax(220px,1fr));gap:18px;max-width:1100px;margin:14px auto 0}
.why-card{background:#fff;border:1px solid var(--color-border);border-radius:18px;padding:22px;box-shadow:0 6px 16px rgba(16,24,40,.06);transition:transform .18s ease,box-shadow .18s ease}
.why-card:hover{transform:translateY(-3px);box-shadow:0 12px 24px rgba(16,24,40,.12)}
.why-card h3{margin:0 0 .4rem;font-weight:800;font-size:1.1rem}
.why-card p{margin:0;color:#475569}

/* Who */
.about-who{padding:36px 16px}
.who-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:22px;max-width:1100px;margin:0 auto;align-items:center}
.who-text h2{margin:.2rem 0 .6rem}
.who-text p{color:#374151}
.bullet{margin:10px 0 14px;padding-left:0;list-style:none}
.bullet li{position:relative;margin:.45rem 0;padding-left:24px}
.bullet li:before{content:"";position:absolute;left:0;top:.55rem;width:10px;height:10px;border-radius:50%;background:conic-gradient(var(--color-primary),var(--color-secondary))}

/* Proces (v3 – folosit în about) */
.about-process{padding:30px 16px 14px;border-top:1px solid var(--color-border)}
.about-process.v3{padding:28px 16px 10px;max-width:1100px;margin:0 auto}
.about-process.v3 h2{margin:0 0 16px;font-weight:800}
.steps-pro{list-style:none;padding:0;margin:0 auto 18px;max-width:920px;display:grid;gap:12px}
.step{display:flex;align-items:center;gap:14px;padding:12px 10px;border-radius:12px}
.step-index{width:36px;height:36px;border-radius:999px;display:grid;place-items:center;font-weight:800;color:var(--color-primary);background:#e9f0fa;flex-shrink:0}
.step-text{display:flex;flex-wrap:wrap;column-gap:6px;row-gap:2px;line-height:1.6}
.step-title{font-weight:800;color:#111827}
.step-desc{color:#4b5563}
.org-badges{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:8px}
.badge{border:1px solid var(--color-border);background:#fff;padding:8px 14px;border-radius:999px;color:#0f172a;font-weight:600;box-shadow:0 2px 6px rgba(16,24,40,.06)}
.section-divider{border:0;border-top:1px solid var(--color-border);margin:22px auto 20px;max-width:1100px}

/* ==========================================================================
   4) SERVICII – v4.2 (actual, Homepage)
   ========================================================================== */
.services-hero.v42{background:#F8F9FA;padding:clamp(54px,6vw,88px) 0}
.sv42{width:min(1200px,92%);margin-inline:auto;display:flex;flex-direction:column;gap:clamp(18px,3vw,24px)}
.sv42-title{margin:0;font-size:clamp(30px,3.1vw,40px);line-height:1.15}
.sv42-title span{color:var(--color-primary)}
.sv42-lede{margin:.5rem 0 1rem;color:var(--color-text-secondary);max-width:70ch}
.sv42-badges{display:flex;gap:.6rem;flex-wrap:wrap;list-style:none;padding:0;margin:0}
.sv42-badge{background:#eef4fb;color:#114073;border:1px solid #dfeaf6;padding:.38rem .72rem;border-radius:999px;font-weight:600;font-size:.92rem}

.sv42-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(22px,3.2vw,36px);align-items:start}
.sv42-services,.sv42-aside{min-width:0}

/* carduri servicii */
.sv42-services{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,2.2vw,18px)}
.sv42-card{background:#fff;border:1px solid #e7eef6;border-radius:16px;box-shadow:0 12px 28px -20px rgba(10,22,70,.25);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;display:block;min-height:136px}
.sv42-card:hover{transform:translateY(-2px);border-color:#d7e4f3;box-shadow:0 22px 44px -22px rgba(10,22,70,.28)}
.sv42-link{display:flex;align-items:flex-start;gap:14px;padding:16px;text-decoration:none;color:var(--color-text-main);height:100%}
.sv42-icon{width:46px;height:46px;flex:0 0 46px;border-radius:12px;background:#eef4fb;color:var(--color-primary);display:inline-flex;align-items:center;justify-content:center}
.sv42-body{display:grid;gap:.35rem;align-content:start}
.sv42-name{margin:.15rem 0 0;font-size:1.06rem;line-height:1.25;font-weight:600}
.sv42-desc{margin:0;color:var(--color-text-secondary);font-size:.95rem}
.sv42-arrow{margin-left:auto;color:#a7b4c7;display:inline-flex;align-items:center;transition:transform .2s ease,color .2s ease}
.sv42-card:hover .sv42-arrow{transform:translateX(4px);color:var(--color-primary)}

/* aside */
.sv42-aside{display:flex;flex-direction:column;gap:clamp(12px,1.6vw,16px)}
.sv42-proof{margin:0;border:1px solid #e7eef6;border-radius:16px;overflow:hidden;box-shadow:0 18px 40px -22px rgba(10,22,70,.25)}
.sv42-proof img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}
.sv42-proof figcaption{padding:.8rem .9rem;background:#fff;font-size:.95rem}
.sv42-cta{text-align:center}
.sv42-help{margin:0;color:var(--color-text-secondary);font-size:.95rem}

/* animații compatibile */
.aos,.animate-on-scroll{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.aos.is-visible,.animate-on-scroll.is-visible{opacity:1;transform:none}

/* ==========================================================================
   5) Floating Location Button – roșu elegant (global)
   ========================================================================== */
.floating-loc{position:fixed;left:20px;bottom:20px;z-index:9999;display:flex;align-items:center;gap:10px;text-decoration:none}
.floating-loc__text{font-size:14px;background:rgba(0,0,0,.75);color:#fff;padding:6px 10px;border-radius:6px;line-height:1;white-space:nowrap;box-shadow:0 4px 10px rgba(0,0,0,.08)}
.floating-loc__btn{width:56px;height:56px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:#C1121F;color:#fff;box-shadow:0 6px 14px rgba(0,0,0,.2);transition:all .25s ease}
.floating-loc__btn:hover{transform:translateY(-2px);background:#780000;box-shadow:0 10px 20px rgba(0,0,0,.25)}
.floating-loc__btn svg{display:block}

/* ==========================================================================
   6) Responsive
   ========================================================================== */
@media (max-width:1100px){.image-card img{height:380px}}
@media (max-width:1024px){
  .sv42-grid{grid-template-columns:1fr;gap:22px}
  .sv42-aside{order:2}
}
@media (max-width:980px){
  .why-grid{grid-template-columns:1fr 1fr}
  .who-grid{grid-template-columns:1fr}
  .image-card img{height:300px}
  .stats-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:720px){
  .sv42-services{grid-template-columns:1fr}
  .sv42-card{min-height:auto}
  .sv42-link{padding:14px;gap:12px}
  .sv42-icon{width:42px;height:42px}
  .sv42-name{font-size:1.02rem}
  .sv42-desc{font-size:.95rem}
}
@media (max-width:640px){
  .stats-grid{grid-template-columns:1fr}
  .why-grid{grid-template-columns:1fr}
  .image-card img{height:230px}
  .about-hero .button{width:100%}
}
@media (max-width:480px){
  .floating-loc{left:16px;bottom:16px}
  .floating-loc__btn{width:52px;height:52px}
  .floating-loc__text{font-size:12px;padding:4px 8px}
}

/* respectă preferința utilizatorului */
@media (prefers-reduced-motion:reduce){
  .aos,.animate-on-scroll,.contact-hero-v3,.contact-details-col,.contact-map-col{transition:none}
  .why-card:hover{transform:none;box-shadow:0 6px 16px rgba(16,24,40,.06)}
}





/* ===== About – Stats (structura cu .about-stats.pro / .stats-wrap / .stat) ===== */
.about-stats.pro{
  background:#fff;
  padding: 26px 16px 18px !important; /* spațiu corectat */
  border-top:1px solid var(--color-border);
}

.about-stats.pro .stats-wrap{
  display:grid !important;
  grid-template-columns: repeat(3, minmax(220px,1fr));
  gap: 18px;
  max-width: 1100px;
  margin: 0 auto;
}

/* Card */
.about-stats.pro .stat{
  background:#f8fafc;
  border:1px solid var(--color-border);
  border-radius:14px;
  padding: 24px 16px;
  box-shadow: 0 10px 22px -18px rgba(16,24,40,.20);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
}

/* Cifra + sufix pe același rând */
.about-stats.pro .stat-top{ margin-bottom: 6px; }
.about-stats.pro .stat-value{
  display:inline-flex;
  align-items:flex-start;
  gap: 6px;
}

/* Cifra mare */
.about-stats.pro .num{
  font-size: clamp(30px, 5vw, 44px);
  font-weight: 800;
  line-height: 1;
  color: var(--color-primary);
}

/* Sufix (+ / %) */
.about-stats.pro .suf{
  font-size: clamp(20px, 3.4vw, 26px);
  font-weight: 800;
  line-height: 1;
  color: var(--color-primary);
  margin-top: 2px; /* aliniere fină pe verticală */
}

/* Eticheta */
.about-stats.pro .stat-label{
  margin-top: 6px;
  color: #4b5563;
  font-size: 0.98rem;
}

/* Reduce gap-ul mare înaintea secțiunii următoare */
.about-why{ padding-top: 28px !important; }

/* Responsive */
@media (max-width: 980px){
  .about-stats.pro .stats-wrap{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px){
  .about-stats.pro .stats-wrap{ grid-template-columns: 1fr; }
}

.visually-hidden{
  position:absolute!important;
  width:1px;height:1px;margin:-1px;border:0;padding:0;
  clip:rect(0 0 0 0);clip-path:inset(50%);overflow:hidden;white-space:nowrap;
}