/* style.css */

/* ===== Smooth scroll (makes the scroll button “work nicely”) ===== */
html { scroll-behavior: smooth; }

/* ========== INLINE WP-LIKE BASICS YOU COPIED (kept) ========== */
img:is([sizes=auto i],[sizes^="auto," i]){contain-intrinsic-size:3000px 1500px}

img.wp-smiley, img.emoji {
  display: inline !important;
  border: none !important;
  box-shadow: none !important;
  height: 1em !important;
  width: 1em !important;
  margin: 0 0.07em !important;
  vertical-align: -0.1em !important;
  background: none !important;
  padding: 0 !important;
}

:root{
  --wp-admin-border-width-focus:2px;

  /* Generator-aware image hooks */
  --header-image: url("assets/header.jpg");
  --hero-image: var(--header-image);

  /* Base dark palette */
  --bg: #001523;
  --text: rgba(255,255,255,.92);
  --muted: rgba(255,255,255,.72);
  --shadow: 0 16px 50px rgba(0,0,0,.55);

  /* Dynamic container / ui hooks */
  --panel-bg: linear-gradient(145deg, rgba(14,71,112,.30), rgba(0,12,22,.78));
  --panel-border: rgba(120,190,230,.30);
  --panel-shadow: 0 18px 52px rgba(0,0,0,.42);
  --site-title-bg: rgba(0,0,0,.24);
  --site-title-border: rgba(255,255,255,.18);
  --search-bg: rgba(0,0,0,.18);
  --scroll-start: rgba(6,147,227,.95);
  --scroll-end: rgba(6,147,227,.45);
}


.ce75e103{cursor:pointer}

.ce75e77{
  border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;
  position:absolute;width:1px;word-wrap:normal!important
}
.ce75e77:focus{
  background-color:#ddd;clip-path:none;color:#444;display:block;font-size:1em;height:auto;
  left:5px;line-height:normal;padding:15px 23px 14px;text-decoration:none;top:5px;width:auto;z-index:100000
}

.ce75e71>a,.ce75e71>figure>a{display:inline-block}
.ce75e71 img{box-sizing:border-box;height:auto;max-width:100%;vertical-align:bottom}
.ce75e71.ce75e89{text-align:center}
.ce75e71 figure{margin:0}
.ce75e71 :where(figcaption){margin-bottom:1em;margin-top:.5em}

.ce75e21{overflow-wrap:break-word}
.ce75e21 iframe{max-width:100%}
.ce75e38{position:relative}
.ce75e98 .ce75e68 .ce75e38:before{content:"";display:block;padding-top:56.25%}
.ce75e98 .ce75e68 iframe{bottom:0;height:100%;left:0;position:absolute;right:0;top:0;width:100%}

/* Background like original WP custom background */
body.ce75e26 { background-color: var(--bg); }
body.ce75e26 .ce75e24{ background: transparent; }
body.ce75e95, body.ce75e26.ce75e95 { background-position:center top; background-size:cover; background-repeat:no-repeat; }

#colophon{
  background-color:black;
  text-align:center;
  color:white;
  padding:20px;
}

/* ========== SITE BASE ========== */
*{box-sizing:border-box}
html,body{height:100%}

body{
  margin:0;
  font-family: Arial, Helvetica, sans-serif;
  color: var(--text);
  background: var(--bg);
}

a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline}

.site{min-height:100vh}

/* Wider container */
.ce75e20{
  width:100%;
  max-width: 1360px;
  margin:0 auto;
  padding:0 22px;
}

/* ===== HEADER (absolute over hero) ===== */
.ce75e28 .ce75e58{
  position:absolute;
  top:0;left:0;right:0;
  z-index:50;
  background:transparent;
}

.ce75e19 .ce75e20{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:22px 22px;
}

.site-title{
  margin:0;
  font-size:20px;
  font-weight:700;
  letter-spacing:.2px;
  color:#fff;
}
.site-title a{
  display:inline-flex;
  align-items:center;
  min-height:46px;
  padding:10px 16px;
  border-radius:999px;
  background:var(--site-title-bg);
  border:1px solid var(--site-title-border);
  box-shadow:0 12px 26px rgba(0,0,0,.18);
  backdrop-filter: blur(10px);
  text-shadow:0 2px 14px rgba(0,0,0,.35);
}
.site-title a:hover{
  text-decoration:none;
  transform:translateY(-1px);
}

.ce75e61{
  display:flex;
  align-items:center;
  gap:18px;
}

.ce75e74{display:flex;align-items:center}
.menu-inside-wrapper{display:flex;align-items:center;gap:18px}

.ce75e60 .menu{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  gap:22px;
  align-items:center;
}

.ce75e60 .menu a{
  color:#fff;
  font-size:13px;
  letter-spacing:.9px;
  text-transform:uppercase;
  font-weight:700;
  opacity:.92;
}
.ce75e60 .menu a:hover{opacity:1;text-decoration:none}

.menu-toggle-wrapper{display:none}

/* search */
.ce75e2{display:flex;align-items:center}
.ce75e91{
  display:flex;
  align-items:center;
  gap:10px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.20);
  background:var(--search-bg);
}
.ce75e47{
  border:0;
  outline:0;
  background:transparent;
  color:#fff;
  width:180px;
}
.ce75e47::placeholder{color:rgba(255,255,255,.7)}
.ce75e34{
  border:0;
  background:transparent;
  color:#fff;
  cursor:pointer;
  padding:0;
  display:flex;
  align-items:center;
}

/* icons */
.ce75e73{width:16px;height:16px;fill:currentColor}

/* ===== HERO / HEADER MEDIA (FULL-BLEED) ===== */
.ce75e24{
  position:relative;
  height: 100vh;
  min-height: 680px;
  overflow:hidden;
}

.ce75e24.ce75e39{
  height: 55vh;
  min-height: 420px;
}

.ce75e24::before{
  content:"";
  position:absolute;
  inset:0;
  background-image: var(--hero-image, var(--header-image));
  background-position:center top;
  background-repeat:no-repeat;
  background-size:cover;
  transform:scale(1.02);
  z-index:0;
}

/* hide header img element (we use background) */
#wp-custom-header{display:none}

.custom-header-overlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,.55) 60%, rgba(0,0,0,.75)),
    linear-gradient(135deg, var(--hero-overlay, rgba(255,255,255,.02)), rgba(0,0,0,0));
  z-index:1;
}
.custom-header-overlay{ pointer-events: none; }
.ce75e24 .ce75e20{
  height:100%;
  position:relative;
  z-index:2;
}

.ce75e25{
  position:relative;
  height:100%;
  z-index:2;
  display:flex;
  align-items:flex-end;
}

.ce75e101{
  width:100%;
  padding:0 0 54px;
  color:#fff;
}
.ce75e57{
  max-width:640px;
  margin-left:auto;
}

/* ===== Scroll button (now clickable + nicer) ===== */
/* optional: better anchor offset if you ever make header sticky */
#content{ scroll-margin-top: 80px; }

/* Scroll button: clickable + bluish */
.scroll-down{
  position:absolute;
  right:30px;
  bottom:26px;
  z-index:9999;              /* make sure it stays above everything */
  pointer-events:auto;       /* ensure click works */

  display:inline-flex;
  gap:10px;
  align-items:center;

  color:#fff;
  font-size:12px;
  letter-spacing:1px;
  text-transform:uppercase;

  padding:12px 16px;
  border-radius:999px;

  background: linear-gradient(135deg, var(--scroll-start), var(--scroll-end));
  border: 1px solid var(--panel-border);
  box-shadow: 0 14px 40px rgba(0,0,0,.24);

  opacity:1;
  transition: transform .15s ease, filter .15s ease, box-shadow .15s ease;
}
.scroll-down:hover{
  text-decoration:none;
  transform: translateY(-2px);
  filter: brightness(1.06);
  box-shadow: 0 18px 55px rgba(0,0,0,.30);
}
.scroll-down svg{ transition: transform .15s ease; }
.scroll-down:hover svg{ transform: translateX(4px); }

/* ===== CONTENT ===== */
.ce75e84.ce75e78{
  padding:40px 0 70px;
}

#content .ce75e20{
  display:grid;
  grid-template-columns: 1fr 320px;
  gap:32px;
}

/* Dark panels instead of white (your request) */
.ce75e31 article,
.ce75e56 .ce75e100{
  background: var(--panel-bg);
  border: 1px solid var(--panel-border);
  border-radius: 18px;
  box-shadow: var(--panel-shadow);
  backdrop-filter: blur(12px);
  padding:26px 26px 30px;
}

.ce75e90{
  margin:0 0 16px;
  font-size:32px;
  line-height:1.15;
  letter-spacing:-.2px;
  color:#fff;
}

.entry-content{
  font-size:18px;
  line-height:1.7;
  color: rgba(255,255,255,.86);
}

.entry-content p{margin:0 0 16px}
.entry-content h2{
  margin:26px 0 10px;
  font-size:22px;
  line-height:1.25;
  color:#fff;
}

/* Big post image */
.entry-content .ce75e71{
  margin: 18px -26px 18px;
}
.entry-content .ce75e71 img{
  width:100%;
  border-radius:0;
  display:block;
}

/* Sidebar */
.ce75e56 .ce75e100{
  padding:18px 18px;
  margin-bottom:22px;
}

.ce75e10{
  margin:0 0 12px;
  font-size:16px;
  letter-spacing:.4px;
  text-transform:uppercase;
  color: rgba(255,255,255,.85);
}

.ce75e100 ul{margin:0;padding-left:18px}
.ce75e100 li{margin:8px 0}
.ce75e100 a{color: rgba(255,255,255,.85)}
.ce75e100 a:hover{color:#fff}

/* Contact form */
.ce75e49 input,
.ce75e49 textarea{
  width:100%;
  padding:12px 12px;
  border:1px solid rgba(255,255,255,.18);
  background: rgba(0,0,0,.18);
  color: var(--text);
  border-radius:8px;
  font-size:16px;
}
.ce75e49 textarea{resize:vertical}

.btn{
  background: rgba(255,255,255,.12);
  color:#fff;
  border:1px solid rgba(255,255,255,.20);
  padding:12px 18px;
  border-radius:999px;
  font-weight:700;
  cursor:pointer;
}
.btn:hover{
  background: rgba(255,255,255,.18);
}

/* Responsive */
@media (max-width: 980px){
  #content .ce75e20{grid-template-columns:1fr}
  .ce75e47{width:120px}
  .ce75e24{min-height:520px}
  .ce75e24.ce75e39{min-height:320px}

  .entry-content .ce75e71{margin-left:0;margin-right:0}
  .entry-content .ce75e71 img{border-radius:10px}
}

/* ===== Mobile burger menu (responsive only) ===== */
#primary-menu-wrapper{
  position: relative;
}

@media (max-width: 980px){
  #primary-search-wrapper{
    display:none;
  }

  #primary-menu-wrapper .menu-toggle-wrapper{
    display:flex;
    align-items:center;
    justify-content:flex-end;
  }

  #primary-menu-wrapper .menu-toggle{
    position:relative;
    width:48px;
    height:48px;
    padding:0;
    border:1px solid rgba(255,255,255,.22);
    border-radius:12px;
    background:var(--search-bg);
    color:#fff;
    cursor:pointer;
  }

  #primary-menu-wrapper .menu-toggle svg,
  #primary-menu-wrapper .menu-toggle .menu-label{
    display:none;
  }

  #primary-menu-wrapper .menu-toggle::before,
  #primary-menu-wrapper .menu-toggle::after{
    content:"";
    position:absolute;
    left:13px;
    width:22px;
    height:2px;
    border-radius:999px;
    background:#fff;
    transition:transform .2s ease, top .2s ease, opacity .2s ease, box-shadow .2s ease;
  }

  #primary-menu-wrapper .menu-toggle::before{
    top:16px;
    box-shadow:0 7px 0 #fff, 0 14px 0 #fff;
  }

  #primary-menu-wrapper .menu-toggle::after{
    top:23px;
    opacity:0;
  }

  #primary-menu-wrapper.is-open .menu-toggle::before{
    top:23px;
    box-shadow:none;
    transform:rotate(45deg);
  }

  #primary-menu-wrapper.is-open .menu-toggle::after{
    opacity:1;
    transform:rotate(-45deg);
  }

  #primary-menu-wrapper .menu-inside-wrapper{
    display:none;
    position:absolute;
    top:calc(100% + 12px);
    right:0;
    min-width:240px;
    padding:16px;
    flex-direction:column;
    align-items:stretch;
    gap:14px;
    background:rgba(0,21,35,.96);
    border:1px solid rgba(255,255,255,.14);
    border-radius:12px;
    box-shadow:0 18px 40px rgba(0,0,0,.45);
    z-index:90;
  }

  #primary-menu-wrapper.is-open .menu-inside-wrapper{
    display:flex;
  }

  #primary-menu-wrapper .ce75e60,
  #primary-menu-wrapper .nav-menu{
    width:100%;
  }

  #primary-menu-wrapper .ce75e60 .menu{
    flex-direction:column;
    align-items:flex-start;
    gap:14px;
  }

  #primary-menu-wrapper .ce75e60 .menu li,
  #primary-menu-wrapper .ce75e60 .menu a{
    width:100%;
  }

  #primary-menu-wrapper .ce75e60 .menu a{
    display:block;
  }

  #primary-menu-wrapper .ce75e13,
  #primary-menu-wrapper .ce75e2,
  #primary-menu-wrapper .ce75e91{
    width:100%;
  }

  #primary-menu-wrapper .ce75e47{
    width:100%;
    min-width:0;
  }
}


/* Generator-friendly dynamic surface helpers */
.ce75e84.ce75e78{position:relative;z-index:3;}
.ce75e31 article,.ce75e56 .ce75e100,.ce75e91{transition:background .25s ease,border-color .25s ease,box-shadow .25s ease;}
.entry-content .ce75e71 img{box-shadow:0 18px 40px rgba(0,0,0,.22);}
.ce75e19 .ce75e20{position:relative;z-index:4;}


/* Generated theme override */
:root{
  --wf-accent:#447d81;
  --wf-panel-bg:linear-gradient(145deg,rgba(23,44,51,0.9),rgba(15,31,39,0.96));
  --wf-panel-border:rgba(102,148,152,0.32);
  --wf-panel-shadow:0 20px 56px rgba(7,13,13,0.34);
  --wf-site-title-bg:rgba(17,31,32,0.44);
  --wf-site-title-border:rgba(102,148,152,0.28);
  --wf-search-bg:rgba(22,40,41,0.42);
  --wf-scroll-start:rgba(68,125,129,0.96);
  --wf-scroll-end:rgba(98,146,149,0.58);
}
body{color:#354548;background-color:#eaf2f3 !important;}
body.ce75e26{background-color:#eaf2f3 !important;}
#page.site,.ce75e58{background:transparent !important;}
#main.ce75e20{background:#fff !important;border-color:#e7eeef !important;box-shadow:0 18px 42px rgba(68,125,129,0.12);}
#primary.ce75e84,#content,article.ce75e64.ce75e87{background:transparent !important;}
.ce75e43 a,.ce75e90,.ce75e10,.ce75e7,h1,h2,h3,h4{color:#18282c;}
a{color:#447d81;}
a:hover,.nav-menu li a:hover,.nav-menu li.ce75e83 a{color:#3a6a6e;}
.ce75e1,.ce75e50,.btn-link{background:#366366;color:#ffffff;}
.btn-link:hover,.ce75e50:hover{background:#447d81;}
.ce75e100{border-color:#e7eeef;background:#fbfcfd !important;box-shadow:0 12px 28px rgba(68,125,129,0.1);}
#colophon,.ce75e86{background:#27494b;color:#ffffff;}
.entry-content h2{border-left:4px solid #447d81;padding-left:12px;}
.entry-content .ce75e71{margin:24px 0 28px;}
.entry-content .ce75e71 figure{margin:0 auto;max-width:1024px;}
.entry-content .ce75e71 img{display:block;width:100%;max-width:1024px;height:auto;aspect-ratio:1024 / 683;object-fit:cover;border:4px solid #ffffff;box-shadow:0 8px 22px rgba(0,0,0,.08);}
.ce75e12{display:block;width:100%;max-width:100%;aspect-ratio:560 / 315;height:auto;min-height:240px;border:0;border-radius:8px;background:#000;}
.ce75e9 .ce75e12{margin:0 auto;}
.ce75e96{margin:12px 0 0;font-size:14px;}
.ce75e96 a{font-weight:700;text-decoration:underline;}
