/* Page-specific styles extracted from HTML */
*{margin:0;padding:0;box-sizing:border-box}

html{font-size:16px;scroll-behavior:smooth}
body{background:var(--color-bg-light);font-family:'Barlow',sans-serif;font-weight:300;-webkit-font-smoothing:antialiased}

/* NAV */
.logo-mark{width:32px;height:32px}
.logo-full{display:flex;align-items:center;gap:10px;text-decoration:none}
.logo-wordmark{font-family:'Plus Jakarta Sans',sans-serif;font-weight:600;font-size:1.05rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--color-text-primary)}
nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:1.4rem 3.5rem;background:var(--color-nav-bg);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.nav-right{display:flex;align-items:center;gap:1.25rem;position:relative}
.burger-wrap{position:relative}
.burger{display:flex;flex-direction:column;justify-content:center;gap:5px;width:36px;height:36px;cursor:pointer;padding:6px;border:1px solid transparent;transition:border-color 0.2s}
.burger:hover{border-color:var(--color-line)}
.burger span{display:block;height:1px;background:var(--color-text-primary)}
.burger span:nth-child(2){width:70%}
.burger-wrap .dropdown.open{opacity:1;pointer-events:auto;transform:translateY(0)}
.nav-cta{font-size:0.68rem;letter-spacing:0.18em;text-transform:uppercase;border:1px solid var(--color-text-primary);padding:0.5rem 1.4rem;text-decoration:none;color:var(--color-text-primary);transition:background 0.25s,color 0.25s;font-weight:400}
.nav-cta:hover{background:var(--color-text-primary);color:var(--color-bg-light)}

/* ── A1: MISSION HERO ── */
.a1{
  background:var(--color-text-primary);
  padding:10rem 3.5rem 6rem;
  min-height:55vh;
  display:flex;flex-direction:column;justify-content:flex-end;
  position:relative;overflow:hidden;
  border-bottom:1px solid rgba(253,253,252,0.08);
}
.a1-grid{position:absolute;inset:0;pointer-events:none}
.a1-eyebrow{font-size:0.62rem;letter-spacing:0.28em;text-transform:uppercase;color:var(--color-accent-gold);margin-bottom:2.5rem;font-weight:400}
.a1-title{
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:clamp(2.8rem,4.5vw,5rem);
  font-weight:700;line-height:1.05;
  letter-spacing:-0.03em;
  color:var(--color-bg-light);
  max-width:18ch;
  margin-bottom:2.5rem;
}
.a1-title em{font-style:normal;color:var(--color-accent-gold);font-weight:400}
.a1-body{
  font-size:1.35rem;line-height:1.9;color:rgba(253,253,252,0.55);
  max-width:58ch;font-weight:300;
}

/* ── A2: WHY KOOLING ── */
.a2{
  display:grid;grid-template-columns:1fr 1fr;
  border-bottom:1px solid var(--color-line);
}
.a2-left{
  padding:5rem 3.5rem;
  border-right:1px solid var(--color-line);
}
.a2-label{font-size:0.62rem;letter-spacing:0.25em;text-transform:uppercase;color:var(--color-text-secondary);margin-bottom:2rem;font-weight:400}
.a2-heading{
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:clamp(1.6rem,2.5vw,2.4rem);
  font-weight:700;line-height:1.15;
  letter-spacing:-0.025em;
  margin-bottom:1.8rem;
}
.a2-body{font-size:1.35rem;line-height:1.9;color:var(--color-text-secondary);font-weight:300;max-width:44ch}
.a2-right{
  padding:5rem 3.5rem;
  display:flex;flex-direction:column;gap:0;
}
.news-feed{display:flex;flex-direction:column;margin-top:1.5rem}
.news-item{
  display:grid;
  grid-template-columns:1fr;
  padding:1.4rem 0;
  border-bottom:1px solid var(--color-line);
  text-decoration:none;
  transition:background 0.2s;
}
.news-item:first-child{padding-top:0}
.news-item:last-child{border-bottom:none}
.news-item:hover .news-title{color:var(--color-accent-gold)}
.news-date{
  font-size:0.75rem;letter-spacing:0.12em;text-transform:uppercase;
  color:var(--color-text-secondary);font-weight:400;white-space:nowrap;
  padding-top:0.15rem;
}
.news-title{
  font-size:0.95rem;line-height:1.65;
  color:var(--color-text-primary);font-weight:300;
  transition:color 0.2s;
}
.news-more{
  display:flex;align-items:center;gap:0.7rem;
  padding:1.4rem 0 0;
  text-decoration:none;
  color:var(--color-text-secondary);
  font-size:0.75rem;letter-spacing:0.18em;text-transform:uppercase;font-weight:400;
  transition:color 0.2s;
}
.news-more:hover{color:var(--color-text-primary)}

/* ── A4: MAP + CONTACT ── */
.a4{
  display:grid;grid-template-columns:1.6fr 1fr;
  border-bottom:1px solid var(--color-line);
  min-height:520px;
}
.a4-map{
  position:relative;overflow:hidden;
  border-right:1px solid var(--color-line);
  min-height:520px;
}
.a4-map iframe{
  width:100%;height:100%;
  border:none;display:block;
  filter:grayscale(100%) contrast(1.1) brightness(0.92);
}
.a4-contact{
  padding:4rem 3.5rem;
  display:flex;flex-direction:column;justify-content:space-between;
}
.a4-label{font-size:0.75rem;letter-spacing:0.25em;text-transform:uppercase;color:var(--color-text-secondary);margin-bottom:2.5rem;font-weight:400}
.a4-address{
  font-size:0.95rem;line-height:1.9;color:var(--color-text-primary);
  font-weight:300;margin-bottom:2.5rem;
  padding-bottom:2.5rem;
  border-bottom:1px solid var(--color-line);
}
.contact-row{
  display:flex;align-items:baseline;gap:0;
  padding:0.7rem 0;
  border-bottom:1px solid var(--color-line);
}
.contact-row:last-of-type{border-bottom:none}
.contact-key{
  font-size:0.75rem;letter-spacing:0.18em;text-transform:uppercase;
  color:var(--color-text-secondary);font-weight:400;
  min-width:90px;
}
.contact-val{
  font-size:0.75rem;color:var(--color-text-primary);font-weight:300;
}
.contact-val a{color:var(--color-text-primary);text-decoration:none;transition:color 0.2s}
.contact-val a:hover{color:var(--color-accent-gold)}

/* ── A5: WORK WITH US CTA ── */
.a5{
  background:var(--color-text-primary);
  padding:6rem 3.5rem;
  display:flex;flex-direction:column;justify-content:center;
  border-bottom:1px solid rgba(253,253,252,0.08);
}
.a5-left{}
.a5-label{font-size:0.62rem;letter-spacing:0.28em;text-transform:uppercase;color:var(--color-accent-gold);margin-bottom:2rem;font-weight:400}
.a5-title{
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:clamp(1.8rem,3vw,2.8rem);
  font-weight:700;line-height:1.1;
  letter-spacing:-0.025em;
  margin-bottom:1.5rem;
  color:var(--color-bg-light);
}
.a5-body{font-size:1.35rem;line-height:1.85;color:rgba(253,253,252,0.5);font-weight:300;max-width:42ch;margin-bottom:2.5rem}
.btn-work{
  display:inline-block;align-self:flex-start;
  background:var(--color-accent-gold);color:var(--color-bg-light);
  font-size:0.68rem;letter-spacing:0.18em;text-transform:uppercase;
  padding:0.85rem 2.4rem;text-decoration:none;
  transition:opacity 0.25s;font-weight:400;cursor:pointer;
  border:none;font-family:'Barlow',sans-serif;
}
.btn-work:hover{opacity:0.82}
.a5-right{
  display:flex;flex-direction:column;gap:1.5rem;
  font-size:0.82rem;color:rgba(253,253,252,0.35);
  font-weight:300;line-height:1.8;
}
.a5-note{
  padding:1.5rem;
  border:1px solid rgba(253,253,252,0.08);
  font-size:0.8rem;line-height:1.8;color:rgba(253,253,252,0.4);
}
.a5-note strong{display:block;font-family:'Plus Jakarta Sans',sans-serif;font-size:0.75rem;font-weight:600;letter-spacing:0.08em;text-transform:uppercase;color:rgba(253,253,252,0.65);margin-bottom:0.5rem}

.leaflet-popup-content-wrapper{
  border-radius:0!important;
  border:1px solid rgba(12,11,9,0.15)!important;
  box-shadow:none!important;
  padding:0!important;
}
.leaflet-popup-content{
  margin:10px 14px!important;
  font-family:Barlow,sans-serif!important;
  font-weight:300!important;
  line-height:1.6!important;
}
.leaflet-popup-tip-container{display:none!important}
.leaflet-attribution-flag{display:none!important}
.leaflet-control-attribution{font-size:9px!important;opacity:0.4}

/* FOOTER */
footer{
  background:var(--color-bg-light);
  padding:2rem 3.5rem;
  display:flex;align-items:center;justify-content:space-between;
  border-top:1px solid var(--color-line-strong);
}
footer .logo-wordmark{color:var(--color-text-primary)}
footer svg circle,footer svg line:nth-child(2){stroke:var(--color-text-primary) !important}
.footer-right{display:flex;align-items:center;gap:2.5rem}.footer-copy{font-size:0.72rem;color:var(--color-text-secondary);letter-spacing:0.05em}
/* Logo: arrow paths use var(--color-bg-light) to stay visible on light bg */
footer .logo-full svg ellipse{fill:var(--color-text-primary)}.footer-links{display:flex;gap:2rem}
.footer-links a{font-size:0.68rem;letter-spacing:0.15em;text-transform:uppercase;color:var(--color-text-secondary);text-decoration:none;transition:color 0.2s}
.footer-links a:hover{color:var(--color-text-primary)}

/* MODAL */
.modal-overlay{
  position:fixed;inset:0;z-index:500;
  background:rgba(12,11,9,0.75);
  backdrop-filter:blur(4px);
  display:flex;align-items:center;justify-content:center;
  opacity:0;pointer-events:none;
  transition:opacity 0.25s ease;
}
.modal-overlay.open{opacity:1;pointer-events:auto}
.modal{
  background:var(--color-bg-light);
  width:100%;max-width:560px;
  margin:1.5rem;
  padding:3rem;
  position:relative;
}
.modal-close{
  position:absolute;top:1.5rem;right:1.5rem;
  width:32px;height:32px;cursor:pointer;
  display:flex;flex-direction:column;justify-content:center;gap:5px;
  padding:6px;border:1px solid transparent;transition:border-color 0.2s;
  background:none;
}
.modal-close:hover{border-color:var(--color-line)}
.modal-close::before,.modal-close::after{
  content:'';display:block;height:1px;background:var(--color-text-primary);
}
.modal-close::before{transform:rotate(45deg) translateY(3px)}
.modal-close::after{transform:rotate(-45deg) translateY(-3px)}
.modal-eyebrow{font-size:0.6rem;letter-spacing:0.25em;text-transform:uppercase;color:var(--color-text-secondary);margin-bottom:1.5rem;font-weight:400}
.modal-title{font-family:'Plus Jakarta Sans',sans-serif;font-size:1.5rem;font-weight:700;letter-spacing:-0.02em;margin-bottom:0.8rem}
.modal-sub{font-size:0.85rem;color:var(--color-text-secondary);line-height:1.7;margin-bottom:2.5rem;font-weight:300}
.form-group{margin-bottom:1.5rem}
.form-label{display:block;font-size:0.62rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--color-text-secondary);margin-bottom:0.6rem;font-weight:400}
.form-input,.form-textarea{
  width:100%;
  background:transparent;
  border:none;border-bottom:1px solid var(--color-line-strong);
  padding:0.6rem 0;
  font-family:'Barlow',sans-serif;font-size:0.9rem;font-weight:300;color:var(--color-text-primary);
  transition:border-color 0.2s;
  outline:none;
}
.form-input:focus,.form-textarea:focus{border-color:var(--color-text-primary)}
.form-textarea{resize:vertical;min-height:80px;line-height:1.7}
.form-select{appearance:none;-webkit-appearance:none;cursor:pointer;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238A8479' stroke-width='1.5' fill='none'/%3E%3C/svg%3E") no-repeat right 4px center;}
.form-file-wrap{
  border:1px dashed rgba(12,11,9,0.2);
  padding:1.2rem 1.5rem;
  display:flex;align-items:center;justify-content:space-between;
  cursor:pointer;transition:border-color 0.2s;
}
.form-file-wrap:hover{border-color:var(--color-text-primary)}
.form-file-wrap input{display:none}
.form-file-label{font-size:0.8rem;color:var(--color-text-secondary);font-weight:300}
.form-file-label span{font-size:0.62rem;letter-spacing:0.15em;text-transform:uppercase;color:var(--color-text-primary);font-weight:400;margin-left:1rem}
.form-file-name{font-size:0.78rem;color:var(--color-text-secondary);font-style:italic;margin-top:0.4rem}
.form-note{font-size:0.72rem;color:var(--color-text-secondary);font-weight:300;margin-top:0.4rem}
.btn-submit{
  width:100%;
  background:var(--color-bg-light);
  border:none;cursor:pointer;
  font-family:'Barlow',sans-serif;
  font-size:0.68rem;letter-spacing:0.18em;text-transform:uppercase;
  padding:1rem;font-weight:400;
  transition:opacity 0.25s;margin-top:0.5rem;
}
.btn-submit:hover{opacity:0.72}
.btn-submit:disabled{opacity:0.4;cursor:not-allowed}
.form-success{
  text-align:center;padding:2rem 0;
  display:none;
}
.form-success .success-icon{font-size:2rem;margin-bottom:1rem}
.form-success p{font-size:0.88rem;color:var(--color-text-secondary);line-height:1.8}
.form-success strong{font-family:'Plus Jakarta Sans',sans-serif;display:block;font-size:1rem;color:var(--color-text-primary);margin-bottom:0.5rem}

/* ═══════════════════════════════════════════════
   MOBILE — @media max-width: 768px
   ═══════════════════════════════════════════════ */
@media(max-width:768px){

  /* NAV */
  nav{padding:1rem 1.25rem}
  .nav-cta{display:none}

  /* A1: MISSION HERO */
  .a1{padding:7rem 1.25rem 3.5rem;min-height:auto}
  .a1-title{font-size:clamp(2.2rem,9vw,3rem)}
  .a1-body{font-size:1.05rem}

  /* A2: WHY KOOLING — stack columns */
  .a2{grid-template-columns:1fr;display:block}
  .a2-left{padding:3rem 1.25rem;border-right:none;border-bottom:1px solid var(--color-line)}
  .a2-right{padding:2.5rem 1.25rem}
  .a2-heading{font-size:clamp(1.4rem,6vw,2rem)}
  .a2-body{font-size:1rem;max-width:100%}

  /* A4: MAP + CONTACT */
  .a4{grid-template-columns:1fr;display:block;min-height:auto}
  .a4-map{min-height:240px;border-right:none;border-bottom:1px solid var(--color-line)}
  .a4-contact{padding:2.5rem 1.25rem}

  /* A5: WORK WITH US */
  .a5{padding:3.5rem 1.25rem}
  .a5-title{font-size:clamp(1.6rem,7vw,2.4rem)}
  .a5-body{font-size:1rem;max-width:100%}

  /* FOOTER */
  footer{flex-direction:column;align-items:flex-start;gap:1rem;padding:1.5rem 1.25rem}
  .footer-right{flex-direction:column;align-items:flex-start;gap:0.75rem}
  .footer-links{flex-wrap:wrap;gap:1rem}

  /* MODAL */
  .modal{padding:2rem 1.25rem;margin:1rem}
}
