/* InfoSec Infirmary — site styles. Brand system shared with the five tools. */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400..600&family=Figtree:wght@300..700&family=JetBrains+Mono:wght@400;500;700&display=swap');

:root{
  --deep:#0B6B51; --teal:#12A47D; --mint:#8AD6B6; --mint-bg:#E3F2EA;
  --amber:#C77A16; --clay:#B0562A; --ink:#16211F; --soft:#4A5A54;
  --hair:#D5DED9; --off:#F1F5F3; --white:#fff;
  --wrap:1080px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--off); color:var(--ink);
  font-family:'Figtree',system-ui,sans-serif; line-height:1.6; font-size:17px;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{font-family:'Fraunces',Georgia,serif; font-weight:500; letter-spacing:-.01em; line-height:1.12; margin:0;}
h1{font-size:clamp(2.1rem,5vw,3.3rem);}
h2{font-size:clamp(1.6rem,3.5vw,2.3rem);}
h3{font-size:1.2rem;}
p{margin:0 0 1rem;}
a{color:var(--deep); text-decoration:none;}
a:hover{text-decoration:underline;}
.wrap{max-width:var(--wrap); margin:0 auto; padding:0 24px;}
.lead{color:var(--soft); font-size:1.12rem;}
.eyebrow{
  font-family:'JetBrains Mono',monospace; font-size:.72rem; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase; color:var(--teal); margin:0 0 .6rem;
}

/* buttons */
.btn{
  display:inline-flex; align-items:center; gap:.5rem; cursor:pointer;
  font-family:'Figtree'; font-weight:600; font-size:1rem; line-height:1;
  padding:.85rem 1.5rem; border-radius:999px; border:2px solid transparent; transition:background .15s,color .15s;
}
.btn:hover{text-decoration:none;}
.btn-primary{background:var(--deep); color:var(--white);}
.btn-primary:hover{background:#095a44;}
.btn-ghost{background:transparent; color:var(--deep); border-color:var(--hair);}
.btn-ghost:hover{border-color:var(--deep);}
.btn-light{background:var(--white); color:var(--deep);}
.btn-light:hover{background:var(--mint-bg);}

/* nav */
.site-nav{position:sticky; top:0; z-index:50; background:rgba(241,245,243,.92); backdrop-filter:blur(8px); border-bottom:1px solid var(--hair);}
.site-nav .wrap{display:flex; align-items:center; gap:20px; height:68px;}
.brand{display:inline-flex; align-items:center; gap:10px; font-weight:700; color:var(--ink);}
.brand:hover{text-decoration:none;}
.brand .badge{width:34px; height:34px; border-radius:9px; background:var(--deep); display:inline-flex; align-items:center; justify-content:center; flex:none;}
.brand b{font-weight:700; font-size:1.05rem;}
.nav-links{display:flex; align-items:center; gap:26px; margin-left:auto;}
.nav-links a{color:var(--ink); font-weight:500; font-size:.98rem;}
.nav-links a:hover{color:var(--deep); text-decoration:none;}
.nav-links a.current{color:var(--deep);}
.nav-toggle{display:none; margin-left:auto; background:none; border:0; cursor:pointer; padding:8px; color:var(--ink);}

/* hero */
.hero{position:relative; overflow:hidden; background:var(--deep); color:var(--white);}
.hero::after{content:""; position:absolute; inset:0; background:radial-gradient(120% 90% at 85% 10%, rgba(138,214,182,.22), transparent 60%); pointer-events:none;}
.hero .wrap{position:relative; z-index:2; padding-top:88px; padding-bottom:96px; max-width:900px;}
.hero .kicker{font-family:'Fraunces',serif; font-style:italic; font-weight:400; color:var(--mint); font-size:1.15rem; margin-bottom:14px;}
.hero h1{color:var(--white); max-width:15ch;}
.hero p{color:rgba(255,255,255,.85); font-size:1.25rem; max-width:38ch; margin:18px 0 30px;}
.pulse-line{position:absolute; left:0; right:0; bottom:34px; z-index:1; width:100%; height:64px; opacity:.5;}
.pulse-line path{fill:none; stroke:var(--mint); stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round;}

/* generic band */
.band{padding:72px 0;}
.band-tint{background:var(--white); border-top:1px solid var(--hair); border-bottom:1px solid var(--hair);}
.band-narrow{max-width:720px;}
.section-head{max-width:640px; margin-bottom:36px;}
.section-head p{margin-bottom:0;}

/* tools / instruments list */
.tool-list{display:grid; gap:2px; background:var(--hair); border:1px solid var(--hair); border-radius:16px; overflow:hidden;}
.tool{background:var(--white); padding:24px 26px; display:grid; grid-template-columns:auto 1fr; gap:18px; align-items:start;}
.tool .ic{width:40px; height:40px; border-radius:11px; background:var(--mint-bg); display:inline-flex; align-items:center; justify-content:center; flex:none;}
.tool .ic svg{width:22px; height:22px;}
.tool h3{margin-bottom:2px;}
.tool .accent{font-family:'JetBrains Mono',monospace; font-size:.7rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--soft); margin-left:8px;}
.tool p{margin:0; color:var(--soft); font-size:.98rem;}
.tools-note{margin-top:20px; color:var(--soft); font-size:.95rem;}

/* services */
.service-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:20px;}
.service{background:var(--white); border:1px solid var(--hair); border-radius:16px; padding:26px 28px;}
.service .oneline{font-family:'Fraunces',serif; font-size:1.05rem; color:var(--deep); margin:2px 0 12px;}
.service h3{font-size:1.3rem;}
.service p{margin:0; color:var(--soft); font-size:.98rem;}

/* cta band */
.cta{background:var(--deep); color:var(--white); border-radius:22px; padding:48px 40px; text-align:center;}
.cta h2{color:var(--white); margin-bottom:10px;}
.cta p{color:rgba(255,255,255,.85); max-width:44ch; margin:0 auto 26px;}

/* contact form */
.form-card{background:var(--white); border:1px solid var(--hair); border-radius:18px; padding:32px;}
.field{margin-bottom:18px;}
.field label{display:block; font-weight:600; font-size:.92rem; margin-bottom:6px;}
.field input,.field textarea{
  width:100%; font-family:'Figtree'; font-size:1rem; padding:.75rem .9rem;
  border:1.5px solid var(--hair); border-radius:10px; background:var(--off); color:var(--ink);
}
.field input:focus,.field textarea:focus{outline:none; border-color:var(--teal);}
.field textarea{resize:vertical; min-height:130px;}
.hp{position:absolute; left:-5000px;}

/* footer */
.site-footer{background:var(--ink); color:rgba(255,255,255,.7); padding:52px 0 34px; margin-top:8px;}
.site-footer .wrap{display:grid; grid-template-columns:1.4fr 1fr; gap:28px;}
.site-footer .brand b, .site-footer .brand{color:var(--white);}
.site-footer .badge{background:var(--teal);}
.foot-tag{font-family:'Fraunces',serif; font-size:1.25rem; color:var(--white); margin:14px 0 6px; max-width:22ch;}
.foot-contact{font-family:'JetBrains Mono',monospace; font-size:.82rem; color:var(--mint);}
.foot-links{display:flex; flex-direction:column; gap:10px;}
.foot-links a{color:rgba(255,255,255,.75);}
.foot-links a:hover{color:var(--white);}
.foot-fine{grid-column:1/-1; border-top:1px solid rgba(255,255,255,.12); margin-top:26px; padding-top:18px; font-size:.82rem; color:rgba(255,255,255,.5);}

/* success page */
.success{min-height:60vh; display:flex; align-items:center;}
.success .ic{width:64px; height:64px; border-radius:16px; background:var(--mint-bg); display:inline-flex; align-items:center; justify-content:center; margin-bottom:20px;}

@media (prefers-reduced-motion:no-preference){
  .pulse-line path{stroke-dasharray:2200; stroke-dashoffset:2200; animation:draw 2.4s ease-out .2s forwards;}
  @keyframes draw{to{stroke-dashoffset:0;}}
}

@media (max-width:800px){
  .nav-links{position:fixed; inset:68px 0 auto 0; background:var(--off); border-bottom:1px solid var(--hair); flex-direction:column; align-items:stretch; gap:0; padding:8px 0; margin:0; display:none;}
  .nav-links.open{display:flex;}
  .nav-links a{padding:14px 24px; border-bottom:1px solid var(--hair);}
  .nav-links .btn{margin:12px 24px; justify-content:center;}
  .nav-toggle{display:inline-flex;}
  .service-grid{grid-template-columns:1fr;}
  .site-footer .wrap{grid-template-columns:1fr;}
  .hero .wrap{padding-top:60px; padding-bottom:72px;}
  .band{padding:56px 0;}
}