/* ============================================================
   STRATUM ENERGY — "Surface Core"
   Light variant of the same system: white ground, ink-dark text,
   a single rust/flare-orange accent tuned for AA contrast on white.
   Typography unchanged: condensed industrial display + engineering
   sans + mono data readouts.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Big+Shoulders:wght@400;600;700;800&family=Kanit:wght@600;700;800&family=IBM+Plex+Sans:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{
  --bg:            #FFFFFF;
  --bg-raised:     #F4F5F6;
  --bg-raised-2:   #E9EBED;
  --line:          #E1E4E8;
  --line-strong:   #C7CCD1;
  --text:          #14161A;
  --text-dim:      #565F69;
  --text-faint:    #848D96;
  --flare:         #C1440E;
  --flare-dim:     #96350A;
  --flare-glow:    rgba(193,68,14,.10);
  --steel:         #48525C;
  --on-flare:      #FFFFFF;

  --f-display: 'Big Shoulders', sans-serif;
  --f-h1:      'Kanit', sans-serif;
  --f-body:    'IBM Plex Sans', sans-serif;
  --f-mono:    'IBM Plex Mono', monospace;

  --gutter: clamp(20px, 5vw, 64px);
  --maxw: 1280px;
}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } *{ animation-duration:.01ms !important; transition-duration:.01ms !important; } }

body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--f-body);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
ul{ list-style:none; }

::selection{ background:var(--flare); color:var(--on-flare); }

:focus-visible{ outline:2px solid var(--flare); outline-offset:3px; }

.wrap{ max-width:var(--maxw); margin:0 auto; padding-left:var(--gutter); padding-right:var(--gutter); }

.eyebrow{
  font-family:var(--f-mono);
  font-size:12.5px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--flare);
  display:flex; align-items:center; gap:10px;
}
.eyebrow::before{ content:''; width:22px; height:1px; background:var(--flare); display:inline-block; }

h1,h2,h3{
  font-family:var(--f-h1);
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.01em;
  line-height:.98;
}

/* ---------- Depth gauge — signature element ---------- */
/* A vertical well-log / wireline strip used as section dividers
   and as the hero's anchoring graphic. Ticks + depth numbers. */
.depth-gauge{
  position:absolute;
  top:0; bottom:0; left:0;
  width:46px;
  border-right:1px solid var(--line);
  display:flex; flex-direction:column; justify-content:space-between;
  padding:28px 0;
  font-family:var(--f-mono);
  font-size:10px;
  color:var(--text-faint);
  pointer-events:none;
}
.depth-gauge span{ display:flex; align-items:center; padding-left:10px; }
.depth-gauge span::before{ content:''; width:8px; height:1px; background:var(--line-strong); margin-right:6px; }

/* ---------- Header ---------- */
header.site{
  position:fixed; top:0; left:0; right:0; z-index:100;
  background:rgba(255,255,255,.86);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav-row{
  display:flex; align-items:center; justify-content:space-between;
  height:76px;
}
.brand{
  display:flex; align-items:center; gap:12px;
}
/* Clasa logo-ului — complet separată de restul imaginilor (galerie etc.)
   Modificați DOAR aceste 3 reguli ca să schimbați dimensiunea logo-ului. */
.logo{ height:30px; width:auto; display:block; }
.logo--footer{ height:24px; margin-bottom:12px; }
.logo--admin{ height:22px; }
.brand small{
  display:block; font-family:var(--f-mono); font-weight:400; font-size:9.5px;
  letter-spacing:.16em; color:var(--text-faint); text-transform:uppercase;
  padding-left:12px; border-left:1px solid var(--line-strong); line-height:1.4; max-width:110px;
}

nav.main-nav{ display:flex; gap:2px; }
nav.main-nav a{
  font-family:var(--f-mono); font-size:12.5px; text-transform:uppercase; letter-spacing:.06em;
  color:var(--text-dim); padding:10px 16px; border-radius:2px; transition:color .18s;
  position:relative;
}
nav.main-nav a:hover, nav.main-nav a.active{ color:var(--text); }
nav.main-nav a.active::after{
  content:''; position:absolute; left:16px; right:16px; bottom:4px; height:1px; background:var(--flare);
}
.nav-toggle{ display:none; background:none; border:1px solid var(--line-strong); color:var(--text); width:40px; height:40px; }

@media (max-width: 860px){
  nav.main-nav{
    position:fixed; top:76px; left:0; right:0; bottom:0;
    background:var(--bg); flex-direction:column; padding:20px var(--gutter);
    transform:translateY(-8px); opacity:0; pointer-events:none; transition:all .22s;
  }
  nav.main-nav.open{ opacity:1; transform:none; pointer-events:auto; }
  nav.main-nav a{ padding:16px 4px; border-bottom:1px solid var(--line); font-size:14px; }
  .nav-toggle{ display:block; }
}

/* ---------- Hero ---------- */
.hero{
  position:relative;
  min-height:100vh;
  display:flex; align-items:flex-end;
  padding:150px var(--gutter) 90px calc(46px + var(--gutter));
  overflow:hidden;
  background:
    radial-gradient(ellipse 900px 500px at 78% 12%, var(--flare-glow), transparent 60%),
    linear-gradient(180deg, #FFFFFF 0%, #FAFAFA 60%, #FFFFFF 100%);
}
.hero-topo{
  position:absolute; inset:0; opacity:.5; z-index:0;
  background-image:
    repeating-linear-gradient(180deg, transparent 0 39px, var(--line) 40px);
  mask-image:linear-gradient(180deg, transparent, black 30%, black 75%, transparent);
}
.hero-inner{ position:relative; z-index:2; max-width:900px; }
.hero h1{
  font-size:clamp(40px, 6.4vw, 92px);
  margin:20px 0 26px;
  color:var(--text);
}
.hero h1 em{ font-style:normal; color:var(--flare); }
.hero p.lede{
  font-size:clamp(15px, 1.6vw, 18px);
  color:var(--text-dim);
  max-width:560px;
  margin-bottom:38px;
}
.btn-row{ display:flex; gap:14px; flex-wrap:wrap; }
.btn{
  font-family:var(--f-mono); font-size:12.5px; text-transform:uppercase; letter-spacing:.08em;
  padding:15px 26px; border:1px solid var(--line-strong); display:inline-flex; align-items:center; gap:10px;
  transition:all .18s;
}
.btn-primary{ background:var(--flare); color:var(--on-flare); border-color:var(--flare); font-weight:600; }
.btn-primary:hover{ background:var(--flare-dim); border-color:var(--flare-dim); }
.btn-ghost{ color:var(--text); }
.btn-ghost:hover{ border-color:var(--flare); color:var(--flare); }

.hero-coords{
  position:absolute; right:var(--gutter); top:150px; z-index:2;
  font-family:var(--f-mono); font-size:11.5px; color:var(--text-faint);
  text-align:right; line-height:2; display:none;
}
@media (min-width: 760px){ .hero-coords{ display:block; } }

/* ---------- Sections ---------- */
section{ position:relative; padding:96px var(--gutter) 96px calc(46px + var(--gutter)); border-bottom:1px solid var(--line); }
.section-head{ max-width:640px; margin-bottom:56px; }
.section-head h2{ font-size:clamp(28px,3.6vw,44px); margin-top:16px; }
.section-head p{ color:var(--text-dim); margin-top:16px; font-size:15.5px; }

/* Field gallery — core-sample strip */
.gallery-strip{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(230px,1fr)); gap:1px;
  background:var(--line); border:1px solid var(--line);
}
.gallery-item{
  background:var(--bg-raised); aspect-ratio:4/5; position:relative; overflow:hidden;
}
.gallery-item img{ width:100%; height:100%; object-fit:cover; filter:grayscale(.25) contrast(1.05); transition:transform .5s ease, filter .5s ease; }
.gallery-item:hover img{ transform:scale(1.045); filter:grayscale(0) contrast(1.05); }
.gallery-placeholder{
  width:100%; height:100%;
  background:
    repeating-linear-gradient(135deg, var(--bg-raised-2) 0 2px, transparent 2px 14px);
  display:flex; align-items:flex-end; justify-content:flex-start;
}
.gallery-cap{
  position:absolute; left:0; right:0; bottom:0; padding:12px 14px;
  background:linear-gradient(0deg, rgba(0,0,0,.75), transparent);
  font-family:var(--f-mono); font-size:11px; letter-spacing:.04em; color:var(--text-dim);
  text-transform:uppercase;
}

/* About + stats */
.about-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:64px; align-items:start; }
@media (max-width:860px){ .about-grid{ grid-template-columns:1fr; } }
.about-grid h2{ font-size:clamp(26px,3.4vw,38px); margin-top:16px; }
.about-grid p{ color:var(--text-dim); margin-top:20px; max-width:52ch; font-size:15.5px; }

.stat-rail{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.stat-rail-inner{ display:grid; grid-template-columns:repeat(3,1fr); }
.stat{
  padding:28px 22px; border-left:1px solid var(--line);
}
.stat:first-child{ border-left:none; }
.stat .v{ font-family:var(--f-mono); font-size:clamp(24px,3vw,34px); color:var(--flare); }
.stat .l{ font-family:var(--f-mono); font-size:10.5px; text-transform:uppercase; letter-spacing:.08em; color:var(--text-faint); margin-top:8px; }
@media (max-width:640px){ .stat-rail-inner{ grid-template-columns:1fr; } .stat{ border-left:none; border-top:1px solid var(--line); } .stat:first-child{ border-top:none; } }

/* Report cards linking to report pages */
.report-links{ display:grid; grid-template-columns:repeat(auto-fit, minmax(260px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); }
.report-card{
  background:var(--bg-raised); padding:40px 34px; transition:background .18s;
}
.report-card:hover{ background:var(--bg-raised-2); }
.report-card .num{ font-family:var(--f-mono); font-size:12px; color:var(--text-faint); }
.report-card h3{ font-size:26px; margin:14px 0 12px; text-transform:none; letter-spacing:0; font-weight:700; }
.report-card p{ color:var(--text-dim); font-size:14.5px; margin-bottom:20px; }
.report-card .go{ font-family:var(--f-mono); font-size:12px; color:var(--flare); text-transform:uppercase; letter-spacing:.06em; }

/* ---------- Reports pages ---------- */
.page-head{
  padding:150px var(--gutter) 60px calc(46px + var(--gutter));
  border-bottom:1px solid var(--line);
}
.page-head h1{ font-size:clamp(32px,5vw,54px); margin-top:18px; }
.page-head p{ color:var(--text-dim); margin-top:16px; max-width:60ch; }

.report-groups{ padding:64px var(--gutter) 96px calc(46px + var(--gutter)); }
.year-group{ border-top:1px solid var(--line); }
.year-group:last-child{ border-bottom:1px solid var(--line); }
.year-toggle{
  width:100%; display:flex; align-items:center; justify-content:space-between;
  background:none; border:none; color:var(--text); cursor:pointer;
  padding:24px 0; text-align:left;
}
.year-toggle .yr{ font-family:var(--f-display); font-weight:700; font-size:28px; text-transform:uppercase; }
.year-toggle .meta{ font-family:var(--f-mono); font-size:11.5px; color:var(--text-faint); display:flex; align-items:center; gap:14px; }
.year-toggle .chevron{ transition:transform .2s; color:var(--flare); }
.year-toggle[aria-expanded="true"] .chevron{ transform:rotate(180deg); }

.year-body{ overflow:hidden; max-height:0; transition:max-height .28s ease; }
.year-body.open{ max-height:2000px; }
.report-row{
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  padding:16px 0 16px 4px; border-top:1px solid var(--line);
  font-size:14.5px;
}
.report-row .period{ font-family:var(--f-mono); font-size:11px; color:var(--flare); text-transform:uppercase; letter-spacing:.06em; min-width:130px; }
.report-row .title{ flex:1; color:var(--text); }
.report-row a.dl{ font-family:var(--f-mono); font-size:11.5px; color:var(--text-dim); border:1px solid var(--line-strong); padding:8px 14px; white-space:nowrap; transition:all .16s; }
.report-row a.dl:hover{ color:var(--flare); border-color:var(--flare); }
.empty-note{ color:var(--text-faint); font-family:var(--f-mono); font-size:13px; padding:40px 0; }

/* ---------- Contact ---------- */
.contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:64px; }
@media (max-width:860px){ .contact-grid{ grid-template-columns:1fr; } }
.contact-item{ padding:22px 0; border-top:1px solid var(--line); }
.contact-item:first-child{ border-top:none; }
.contact-item .l{ font-family:var(--f-mono); font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--text-faint); margin-bottom:8px; }
.contact-item .v{ font-size:17px; }
.contact-item a:hover{ color:var(--flare); }
.map-frame{ border:1px solid var(--line); aspect-ratio:4/3; overflow:hidden; }
.map-frame iframe{ width:100%; height:100%; border:0; filter:grayscale(.4) contrast(1.02); }

/* ---------- Footer ---------- */
footer.site{
  padding:56px var(--gutter) 40px calc(46px + var(--gutter));
  border-top:1px solid var(--line);
}
.footer-row{ display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:24px; }
.footer-brand{ font-family:var(--f-display); font-weight:800; text-transform:uppercase; font-size:18px; }
.footer-meta{ font-family:var(--f-mono); font-size:11.5px; color:var(--text-faint); }
.footer-links{ display:flex; gap:22px; }
.footer-links a{ font-family:var(--f-mono); font-size:11.5px; color:var(--text-dim); text-transform:uppercase; letter-spacing:.05em; }
.footer-links a:hover{ color:var(--flare); }

/* ---------- Reveal on scroll ---------- */
.reveal{ opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease; }
.reveal.visible{ opacity:1; transform:none; }

/* ---------- Utility ---------- */
.section-index{ font-family:var(--f-mono); font-size:11.5px; color:var(--text-faint); margin-bottom:6px; }