@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800&family=Inter:wght@400;500;600;700;800&display=swap');:root{--bg:#0a1118;--panel:#111e2a;--blue:#23a8e8;--text:#f5f8fb;--muted:#b2c1cd}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,Arial,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}.header{height:86px;background:#080e15ee;display:flex;align-items:center;justify-content:space-between;padding:0 5%;position:sticky;top:0;z-index:10;border-bottom:1px solid #24394a;backdrop-filter:blur(12px)}.brand{display:flex;align-items:center;gap:12px;font-size:20px;font-weight:800;letter-spacing:.04em}.brand img{width:86px;height:68px;object-fit:contain}.brand small{display:block;font-size:9px;letter-spacing:.18em;color:#a5c2d7;margin-top:5px}.header nav{display:flex;gap:28px}.header nav a{font-size:12px;font-weight:800;letter-spacing:.09em}.header nav a:hover,.text-link:hover{color:var(--blue)}.menu{display:none;background:none;border:0;color:white;font-size:28px}.hero{height:min(740px,78vh);min-height:530px;position:relative;overflow:hidden;background:#05090f}.slide{position:absolute;inset:0;background-size:cover;background-position:center 45%;opacity:0;transform:scale(1.035);transition:opacity 1.1s,transform 7s}.slide.active{opacity:1;transform:scale(1)}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#06101cf5 0%,#06101cce 37%,#06101c30 78%),linear-gradient(0deg,#07101bba,transparent 40%)}.hero-content{position:absolute;left:9%;top:50%;transform:translateY(-50%);max-width:680px;z-index:2}.eyebrow{color:#42c5ff;letter-spacing:.24em;font-size:12px;font-weight:800}.hero h1{font-family:'Barlow Condensed',Impact,sans-serif;font-style:italic;font-weight:800;font-size:clamp(48px,6.6vw,94px);line-height:.97;letter-spacing:.01em;margin:24px 0;text-shadow:0 4px 20px #0009}.hero-content>p:not(.eyebrow){font-size:17px;line-height:1.7;max-width:480px;color:#e2eaf1}.hero-actions{display:flex;gap:13px;flex-wrap:wrap;margin-top:32px}.btn{display:inline-flex;align-items:center;justify-content:center;border:1px solid #2ac0ff;background:#087cbb;color:white;padding:16px 24px;font-weight:800;font-size:12px;letter-spacing:.07em;transition:background .2s}.btn:hover{background:#16a9e9}.btn.ghost{background:#06101a99}.slide-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;border:1px solid #ffffff50;background:#08121d66;color:white;font-size:42px;width:48px;height:62px}.slide-arrow:hover{background:#137eb3}.prev{left:15px}.next{right:15px}.dots{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);display:flex;gap:9px;z-index:3}.dots button{border:1px solid white;background:#ffffff44;width:10px;height:10px;border-radius:50%;padding:0}.dots button.active{background:var(--blue);border-color:var(--blue)}.section{padding:92px max(6%,calc((100vw - 1250px)/2));scroll-margin-top:85px}.section h2{font-family:'Barlow Condensed',Impact,sans-serif;font-size:clamp(39px,5vw,65px);letter-spacing:.03em;margin:10px 0 22px}.lead{max-width:680px;color:var(--muted);line-height:1.75}.services{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:40px}.services article{background:linear-gradient(145deg,#162635,#0d1721);border:1px solid #294154;padding:30px 22px;min-height:225px}.services article span{color:var(--blue);font-weight:800;font-size:12px}.services h3{font-family:'Barlow Condensed';font-size:25px;margin:25px 0 8px}.services p{color:var(--muted);line-height:1.65;font-size:13px}.projects-section{background:#0d1823}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:20px}.section-heading p{color:var(--muted)}.filters{display:flex;gap:9px;flex-wrap:wrap;margin:20px 0 30px}.filters button{background:transparent;color:#bdcbd7;border:1px solid #3a4d5d;padding:10px 14px;font-size:11px;font-weight:800;letter-spacing:.07em}.filters button.active,.filters button:hover{background:#087dbb;color:white;border-color:#23a8e8}.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.project-card{position:relative;display:block;min-height:300px;background:#182635;border:1px solid #324555;text-align:left;padding:0;color:white;overflow:hidden}.project-card img{width:100%;height:310px;object-fit:cover;transition:transform .4s}.project-card:hover img{transform:scale(1.05)}.project-info{position:absolute;bottom:0;left:0;right:0;padding:50px 22px 20px;background:linear-gradient(transparent,#06101bf5)}.project-info small{font-size:10px;color:#63caff;font-weight:800;letter-spacing:.15em}.project-info h3{font-family:'Barlow Condensed';font-size:27px;margin:8px 0}.project-info span{font-size:10px;font-weight:800;letter-spacing:.1em}.disclaimer{font-size:12px;color:#8fa6b9;line-height:1.6;margin-top:26px}.about{display:grid;grid-template-columns:1fr 1fr;gap:8%;align-items:center}.about p:not(.eyebrow){color:var(--muted);line-height:1.85}.about-image img{width:100%;height:440px;object-fit:cover;border:1px solid #28465c}.text-link{display:inline-block;margin-top:22px;font-size:12px;font-weight:800;letter-spacing:.08em;color:#56c6ff}.contact{text-align:center;background:radial-gradient(ellipse at center,#173c55,#09131d 70%)}.contact>p:not(.eyebrow){color:var(--muted);line-height:1.7}.contact .btn{margin-top:20px}.contact-details{display:flex;justify-content:center;gap:35px;flex-wrap:wrap;margin-top:55px;font-size:13px;color:#d1e1ec}.contact-details a:hover{color:var(--blue)}footer{padding:26px 6%;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;color:#879dad;font-size:10px;letter-spacing:.09em;border-top:1px solid #273949}dialog{background:#101c27;color:white;border:1px solid #3a5b70;padding:0;max-width:760px;width:calc(100% - 32px);max-height:90vh;overflow:auto}dialog::backdrop{background:#000c}dialog>img{width:100%;max-height:470px;object-fit:contain;background:#07101b}.modal-body{padding:28px 34px 34px}.modal-body h2{font-family:'Barlow Condensed';font-size:40px;margin:8px 0}.modal-body p{line-height:1.7;color:#d1dce5}.modal-note{font-size:12px;border-top:1px solid #304556;padding-top:15px}.close{position:sticky;float:right;top:12px;margin:12px;background:#08121de6;color:white;border:1px solid #678;padding:10px 14px;z-index:2}@media(max-width:950px){.services{grid-template-columns:repeat(2,1fr)}.project-grid{grid-template-columns:repeat(2,1fr)}.header nav{gap:14px}.brand{font-size:16px}.brand img{width:65px}}@media(max-width:650px){.header{height:72px;padding:0 4%}.brand img{width:64px;height:54px}.brand{font-size:14px}.brand small{font-size:7px}.menu{display:block}.header nav{display:none;position:absolute;top:72px;left:0;right:0;background:#09121c;padding:24px;flex-direction:column;gap:22px}.header nav.open{display:flex}.hero{height:660px;min-height:0}.hero-shade{background:linear-gradient(0deg,#06101bf9 3%,#06101b99 58%,#06101b50)}.hero-content{left:8%;right:8%;top:auto;bottom:85px;transform:none}.hero h1{font-size:53px}.hero-content>p:not(.eyebrow){font-size:14px}.slide-arrow{top:40%;height:50px;width:35px;font-size:30px}.section{padding:65px 6%}.services,.project-grid,.about{grid-template-columns:1fr}.services article{min-height:0}.project-card img{height:320px}.section-heading{display:block}.about-image img{height:300px}.contact-details{gap:18px;flex-direction:column}.btn{padding:14px 18px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.slide{transition:none;transform:none}}

/* V3: larger company branding and precise right-edge slideshow crops */
.header{height:108px;padding:0 4.5%}
.brand{gap:17px;font-size:28px;letter-spacing:.025em}
.brand img{width:158px;height:94px;object-fit:contain}
.brand small{font-size:10px;letter-spacing:.13em}
.section{scroll-margin-top:108px}
@media(max-width:950px){.brand{font-size:21px}.brand img{width:120px;height:82px}.header{height:96px}}
@media(max-width:650px){.header{height:76px}.brand{font-size:16px;gap:8px}.brand img{width:90px;height:62px}.brand small{font-size:7px}.header nav{top:76px}}

/* V5 — enlarged desktop identity, navigation stays usable */
@media(min-width:1101px){
 .header{height:130px;padding:0 3.5%;gap:22px}
 .brand{width:52%;max-width:820px;flex:0 1 52%;gap:24px;font-size:clamp(34px,3.15vw,58px);line-height:1;white-space:nowrap;letter-spacing:.015em}
 .brand img{width:clamp(140px,11vw,200px);height:112px;flex-shrink:0}
 .brand small{font-size:clamp(12px,1.02vw,17px);letter-spacing:.09em;margin-top:12px;white-space:nowrap}
 .header nav{gap:clamp(12px,1.4vw,24px);flex-shrink:0}
 .header nav a{font-size:clamp(10px,.78vw,13px)}
}
@media(min-width:951px) and (max-width:1100px){
 .header{height:108px;padding:0 3%;gap:12px}
 .brand{font-size:26px;gap:12px}
 .brand img{width:112px;height:88px}
 .brand small{font-size:9px;letter-spacing:.08em}
 .header nav{gap:12px}
 .header nav a{font-size:10px}
}

/* V6: phone-only slideshow improvements. Desktop appearance is unchanged. */
@media (max-width:650px){
  .hero{height:610px;min-height:0;background:#06101b}
  /* Show the entire width of each project photo instead of cropping it to a portrait viewport.
     !important overrides the desktop background-position inline on individual slides. */
  .hero .slide{background-size:100% auto;background-repeat:no-repeat;background-position:center top !important;background-color:#06101b;transform:none}
  .hero-shade{background:linear-gradient(to bottom,rgba(4,11,19,.08) 0%,rgba(4,11,19,.18) 22%,rgba(4,11,19,.88) 48%,#06101b 78%)}
  .hero-content{left:7%;right:7%;bottom:65px;top:auto;transform:none}
  .hero .eyebrow{font-size:10px;line-height:1.5;letter-spacing:.16em;margin-bottom:13px}
  .hero h1{font-size:clamp(30px,8vw,39px);line-height:1.08;overflow-wrap:normal;margin-bottom:13px}
  .hero-content>p:not(.eyebrow){font-size:14px;line-height:1.5;max-width:95%}
  .hero-actions{gap:10px;margin-top:18px}
  .hero-actions .btn{font-size:12px;padding:12px 14px}
  .slide-arrow{top:25%;width:36px;height:48px;font-size:28px;background:rgba(4,11,19,.45)}
  .slide-arrow.prev{left:8px}.slide-arrow.next{right:8px}
  .dots{bottom:15px}
}
@media(max-width:380px){
  .hero{height:590px}
  .hero h1{font-size:30px}
  .hero-content{bottom:54px}
}