@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&display=swap');

:root{
--color-primary:#2d578b;
--color-primary-rgb:45,87,139;
--color-primary-hover:#24466f;
--color-secondary:#89bebf;
--color-accent:#cfe876;
--color-text-primary:#1d2a4e;
--color-text-secondary:#6c757d;
--color-bg-white:#ffffff;
--color-bg-light:#f8f9fa;
--color-bg-dark:#404040;
--border-radius:0.75rem;
--border-radius-lg:1rem;
--border-radius-pill:50rem;
--font-family:"Montserrat",sans-serif;
--container-max:1140px;
--header-height:5rem;
--ease-out-expo:cubic-bezier(0.16,1,0.3,1);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

html{
scroll-behavior:smooth;
background:var(--color-bg-white);
color:var(--color-text-primary);
font-family:var(--font-family);
-webkit-font-smoothing:antialiased;
font-size:16px;
}

body{
line-height:1.6;
min-height:100vh;
overflow-x:hidden;
background:var(--color-bg-white);
}

.container{
width:100%;
max-width:var(--container-max);
margin:0 auto;
padding:0 clamp(1rem,5vw,2rem);
position:relative;
}

.container-fluid{width:100%;padding:0}

header{
position:fixed;
inset:0 0 auto 0;
z-index:1000;
height:var(--header-height);
background:var(--color-bg-white);
box-shadow:0 0.125rem 0.25rem rgba(0,0,0,0.075);
border-bottom:1px solid rgba(0,0,0,0.1);
transition:all 0.3s ease;
}

header.scrolled{box-shadow:0 0.5rem 1rem rgba(0,0,0,0.15)}

header .container{
display:flex;
justify-content:space-between;
align-items:center;
height:100%;
}

.logo{display:flex;align-items:center;transition:transform 0.3s}
.logo:hover{transform:scale(1.05)}
.logo img{height:2.5rem;width:auto}

.main-nav{display:flex;align-items:center;gap:2rem}
.main-nav ul{display:flex;list-style:none;gap:1.5rem;margin:0;padding:0}
.main-nav a{
color:var(--color-text-primary);
text-decoration:none;
font-weight:500;
font-size:0.9rem;
position:relative;
padding:0.5rem 0;
transition:color 0.3s;
text-transform:none;
}

.main-nav a::after{
content:'';
position:absolute;
bottom:0;
left:0;
width:0;
height:2px;
background:var(--color-primary);
transition:width 0.3s;
}

.main-nav a:hover,.main-nav a.active{color:var(--color-primary)}
.main-nav a:hover::after,.main-nav a.active::after{width:100%}
.main-nav .btn-primary,.main-nav .btn-primary:hover,.main-nav .btn-primary:visited{color:#fff}
.main-nav .btn-primary::after{display:none}

.btn{
display:inline-flex;
align-items:center;
justify-content:center;
gap:0.5rem;
padding:0.75rem 1.5rem;
border-radius:var(--border-radius-pill);
font-weight:600;
font-size:0.875rem;
text-decoration:none;
border:2px solid transparent;
cursor:pointer;
transition:all 0.3s;
font-family:var(--font-family);
}

.btn-primary{
background:var(--color-primary);
color:#fff;
border-color:var(--color-primary);
}

.btn-primary:hover{
background:var(--color-primary-hover);
transform:translateY(-2px);
box-shadow:0 4px 12px rgba(45,87,139,0.3);
}

.btn-secondary{
border-color:var(--color-primary);
color:var(--color-primary);
background:#fff;
}

.btn-secondary:hover{
background:var(--color-primary);
color:#fff;
}

.btn-green{
background:var(--color-accent);
color:var(--color-text-primary);
border-color:#abbc62;
}

.btn-green:hover{
filter:brightness(1.05);
transform:translateY(-2px);
}

.gradient-text{
background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
background-clip:text;
}

.card{
background:var(--color-bg-white);
border:1px solid rgba(0,0,0,0.1);
border-radius:var(--border-radius);
padding:2rem;
box-shadow:0 0.125rem 0.25rem rgba(0,0,0,0.075);
transition:all 0.3s;
}

.card:hover{
transform:translateY(-5px);
box-shadow:0 1rem 3rem rgba(0,0,0,0.175);
}

.article-card{
background-image:linear-gradient(180deg,#fff,#e3f2f3);
padding:2rem;
height:100%;
border:3px solid #dedede;
border-radius:var(--border-radius);
}

.article-card .icon{
background-color:var(--color-accent);
padding:1.25rem;
aspect-ratio:1;
display:inline-flex;
justify-content:center;
align-items:center;
border-radius:50%;
width:120px;
}

.article-card .icon img{width:100%;height:auto}

.grid{display:grid;gap:2rem}
.grid-2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.grid-3{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}

@media (min-width:992px){
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
}

main{padding-top:var(--header-height)}

.hero{
display:flex;
align-items:center;
position:relative;
padding:6rem 0;
}

.hero-consulting{
position:relative;
overflow:hidden;
padding-top:6rem;
padding-bottom:5rem;
margin-bottom:0;
min-height:min(70vh,760px);
}

.hero-consulting-bg{
position:absolute;
inset:0;
}

.hero-consulting-bg img{
width:100%;
height:100%;
object-fit:cover;
}

.hero-consulting-bg::after{
content:'';
position:absolute;
inset:0;
background:linear-gradient(106deg,rgba(24,31,43,0.88) 40%,rgba(24,31,43,0.28) 100%);
}

.hero-consulting .container{z-index:1}
.hero-consulting-grid{align-items:center;gap:3rem}
.hero-copy{color:#fff;text-shadow:0 3px 12px rgba(18,24,35,0.45)}
.hero-copy h1{
font-size:clamp(2.25rem,4vw,3.5rem);
line-height:1.15;
margin-bottom:1.5rem;
color:#fff;
}
.hero-copy p{
font-size:1.1rem;
color:rgba(255,255,255,0.92);
margin-bottom:1rem;
max-width:38rem;
}
.hero-highlight{margin:1.5rem 0 2rem;font-weight:700}
.hero-buttons{display:flex;gap:1rem;flex-wrap:wrap;margin-top:2rem}
.hero-code-wrap{display:flex;justify-content:center;align-items:center}

section{padding:5rem 0;position:relative}

.section-header{
text-align:center;
max-width:800px;
margin:0 auto 3rem;
}

.section-header h2{
font-size:clamp(2rem,4vw,2.5rem);
margin-bottom:1rem;
font-weight:700;
color:var(--color-text-primary);
}

.section-header p{color:var(--color-text-secondary);font-size:1.125rem}

.badge{
display:inline-flex;
align-items:center;
padding:0.375rem 0.875rem;
border-radius:50rem;
font-size:0.75rem;
font-weight:600;
text-transform:uppercase;
letter-spacing:1px;
background:var(--color-primary);
color:#fff;
margin:0.25rem;
}

.link-arrow{
display:inline-flex;
align-items:center;
gap:0.5rem;
color:var(--color-primary);
text-decoration:none;
font-weight:600;
transition:all 0.3s;
font-size:0.9rem;
}

.hero-copy .link-arrow{color:#fff}
.link-arrow:hover{gap:1rem}

.page-header{
padding:6rem 0 3rem;
text-align:center;
background:linear-gradient(rgba(45,87,139,0.9),rgba(29,42,78,0.95)),url('../../img/header.jpg');
background-size:cover;
background-position:center;
color:#fff;
border-bottom:none;
margin-bottom:2rem;
}

.page-header h1{
font-size:clamp(2rem,5vw,3rem);
margin-bottom:1rem;
font-weight:700;
color:#fff;
}

.lead{color:rgba(255,255,255,0.9);font-size:1.125rem;line-height:1.6}

.consulting-intro{
background:var(--color-bg-light);
padding:5rem 0;
}

.consulting-intro-grid{align-items:center;gap:4rem}
.quote-image{
width:100%;
max-width:340px;
display:block;
margin:0 auto;
border-radius:var(--border-radius);
box-shadow:0 0.5rem 1rem rgba(0,0,0,0.15);
}
.quote-card{
background:linear-gradient(102deg,#17284f 24.76%,#2c5588 111.71%);
color:#fff;
padding:1.25rem 1.5rem;
margin:-3rem 0 0 auto;
width:min(90%,22rem);
position:relative;
z-index:1;
}
.quote-card blockquote{
position:relative;
font-size:1.1rem;
font-weight:700;
padding-top:2.5rem;
margin-bottom:0.5rem;
}
.quote-card blockquote::before{
content:'"';
position:absolute;
top:-1.5rem;
left:-0.25rem;
font-size:6rem;
line-height:1;
color:var(--color-accent);
}
.quote-card p{margin:0;text-align:right}

.image-callouts{
background:var(--color-bg-dark);
padding:0;
}
.image-callouts-grid{gap:0}
.image-callout{
position:relative;
min-height:26rem;
overflow:hidden;
}
.image-callout img{
position:absolute;
inset:0;
width:100%;
height:100%;
object-fit:cover;
}
.image-callout-overlay{
position:relative;
z-index:1;
display:flex;
flex-direction:column;
justify-content:flex-end;
min-height:26rem;
padding:3rem 2rem;
color:#fff;
text-shadow:0 3px 12px rgba(29,42,78,0.9);
}
.image-callout-overlay::before{
content:'';
position:absolute;
inset:0;
background:rgba(29,42,78,0.45);
z-index:-1;
}
.image-callout h2{
font-size:clamp(1.5rem,2.5vw,2rem);
max-width:34rem;
margin-bottom:1rem;
color:#fff;
}
.image-callout a{color:#fff;text-decoration:none;font-weight:600}
.image-callout a:hover{text-decoration:underline}

.conviction-section{padding:5rem 0}
.conviction-headline h2{
color:#b8bec7;
font-size:clamp(2.5rem,6vw,4.75rem);
line-height:1;
text-transform:uppercase;
margin-bottom:2rem;
font-weight:700;
white-space:nowrap;
}
.conviction-headline h2 span{
background:none;
-webkit-text-fill-color:currentColor;
}

.conviction-grid{align-items:start;gap:3rem}
.conviction-statement h3{
font-size:clamp(1.75rem,3vw,2.5rem);
line-height:1.15;
color:var(--color-text-primary);
}

.team-profile{
display:grid;
grid-template-columns:300px 1fr;
gap:4rem;
align-items:start;
padding:4rem 0;
}

@media (max-width:768px){
.team-profile,.contact-grid,.consulting-intro-grid,.conviction-grid{grid-template-columns:1fr;gap:2rem}
.quote-card{width:100%;margin:1.5rem 0 0}
.image-callout,.image-callout-overlay{min-height:20rem}
.hero-consulting{padding-top:5rem;padding-bottom:4rem}
.hero-buttons{flex-direction:column;align-items:flex-start}
.hero-buttons .btn{width:100%}
.conviction-headline h2{white-space:normal;font-size:clamp(2.25rem,10vw,3.5rem)}
}

.team-profile-image img{
width:100%;
border-radius:var(--border-radius);
box-shadow:0 0.5rem 1rem rgba(0,0,0,0.15);
object-fit:cover;
aspect-ratio:3/4;
}

.tagline{
display:block;
color:var(--color-primary);
font-size:0.9rem;
margin-top:0.5rem;
font-weight:600;
text-transform:uppercase;
letter-spacing:1px;
}

.expertise-list{
list-style:none;
display:grid;
gap:0.75rem;
padding:0;
}

.expertise-list li{
display:flex;
align-items:center;
gap:1rem;
color:var(--color-text-secondary);
padding:1rem;
background:var(--color-bg-light);
border-radius:var(--border-radius);
border-left:4px solid var(--color-primary);
transition:all 0.3s;
}

.expertise-list li:hover{
transform:translateX(5px);
background:#e9ecef;
}

.contact-grid{
display:grid;
grid-template-columns:1fr 1.5fr;
gap:4rem;
align-items:start;
padding:4rem 0;
}

.form-control{
width:100%;
padding:0.75rem 1rem;
background:#fff;
border:1px solid #dee2e6;
border-radius:var(--border-radius);
color:var(--color-text-primary);
font-family:var(--font-family);
font-size:1rem;
transition:all 0.3s;
outline:none;
}

.form-control:focus{
border-color:var(--color-primary);
box-shadow:0 0 0 0.25rem rgba(45,87,139,0.25);
}

textarea.form-control{resize:vertical;min-height:120px}

.form-check{
display:flex;
align-items:flex-start;
gap:0.75rem;
margin:1rem 0;
}

.form-check input{width:1.25rem;height:1.25rem;accent-color:var(--color-primary)}
.form-check label{color:var(--color-text-secondary);font-size:0.875rem}
.form-check a{color:var(--color-primary);text-decoration:none}

.footer-grid{
display:grid;
grid-template-columns:2fr repeat(3,1fr);
gap:3rem;
padding:4rem 0;
border-top:1px solid rgba(0,0,0,0.1);
margin-top:4rem;
background:var(--color-bg-light);
}

@media (max-width:768px){.footer-grid{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.footer-grid{grid-template-columns:1fr;text-align:center}}

.footer-grid h4{
color:var(--color-text-primary);
font-size:0.875rem;
margin-bottom:1.5rem;
text-transform:uppercase;
letter-spacing:1px;
font-weight:700;
}

.footer-grid a{
display:block;
color:var(--color-text-secondary);
text-decoration:none;
margin-bottom:0.75rem;
transition:color 0.3s;
font-size:0.9rem;
}

.footer-grid a:hover{color:var(--color-primary)}

.social-links{display:flex;gap:1rem;margin-top:1rem}
@media (max-width:480px){.social-links{justify-content:center}}

.social-links a{
width:2.5rem;
height:2.5rem;
border-radius:50%;
background:var(--color-primary);
color:#fff;
display:grid;
place-items:center;
text-decoration:none;
transition:all 0.3s;
}

.social-links a:hover{
transform:translateY(-3px);
background:var(--color-primary-hover);
box-shadow:0 4px 12px rgba(45,87,139,0.3);
}

.footer-bottom{
padding:2rem 0;
text-align:center;
color:var(--color-text-secondary);
font-size:0.875rem;
border-top:1px solid rgba(0,0,0,0.1);
margin-top:2rem;
}

.hamburger{
display:none;
flex-direction:column;
justify-content:center;
width:2rem;
height:2rem;
background:transparent;
border:none;
cursor:pointer;
gap:6px;
padding:0;
z-index:1001;
}

.hamburger span{
width:100%;
height:2px;
background:var(--color-text-primary);
border-radius:2px;
transition:all 0.3s;
}

@media (max-width:900px){
.hamburger{display:flex}
.main-nav{
position:fixed;
inset:0;
background:var(--color-bg-white);
flex-direction:column;
padding:calc(var(--header-height) + 2rem) 2rem 2rem;
align-items:center;
gap:2rem;
opacity:0;
visibility:hidden;
transform:translateY(-20px);
transition:all 0.3s ease;
box-shadow:0 0.5rem 1rem rgba(0,0,0,0.15);
}
.main-nav.open{opacity:1;visibility:visible;transform:translateY(0)}
.main-nav ul{flex-direction:column;align-items:center;gap:1.5rem;width:100%}
.main-nav a{font-size:1.1rem}
}

.feature-icon{
width:3.5rem;
height:3.5rem;
border-radius:50%;
background:var(--color-primary);
display:grid;
place-items:center;
font-size:1.25rem;
color:#fff;
transition:all 0.3s;
margin-bottom:1.25rem;
}

.article-card:hover .feature-icon{
transform:scale(1.1);
background:var(--color-secondary);
}

.resp-card{
display:flex;
gap:1.5rem;
align-items:flex-start;
background:#fff;
border:1px solid rgba(0,0,0,0.1);
border-radius:var(--border-radius);
padding:1.5rem;
box-shadow:0 0.125rem 0.25rem rgba(0,0,0,0.075);
transition:all 0.3s;
}

.resp-card:hover{
transform:translateX(10px);
border-color:var(--color-primary);
box-shadow:0 0.5rem 1rem rgba(0,0,0,0.1);
}

.resp-icon{
width:3rem;
height:3rem;
border-radius:50%;
background:var(--color-primary);
color:#fff;
display:grid;
place-items:center;
font-size:1.25rem;
flex-shrink:0;
}

.resp-card h3{font-size:1.25rem;font-weight:700;margin-bottom:0.5rem;color:var(--color-text-primary)}
.resp-card p{color:var(--color-text-secondary);font-size:0.9375rem;line-height:1.6}

.responsibility-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(350px,1fr));
gap:1.5rem;
}

.cta-section{
padding:4rem;
text-align:center;
background:linear-gradient(rgba(45,87,139,0.88),rgba(29,42,78,0.9)),url('../../img/header.jpg');
background-size:cover;
background-position:center;
border-radius:var(--border-radius-lg);
color:#fff;
margin:4rem 0;
position:relative;
overflow:hidden;
}

.cta-section h2{color:#fff;margin-bottom:1rem;font-size:clamp(1.5rem,3vw,2.5rem)}
.cta-section p{color:rgba(255,255,255,0.9);font-size:1.125rem;margin-bottom:2rem}

.text-center{text-align:center}
.text-secondary{color:var(--color-text-secondary)}
.mb-4{margin-bottom:1.5rem}
.mt-4{margin-top:1.5rem}
.p-4{padding:1.5rem}

.reveal{
opacity:0;
transform:translateY(30px);
transition:opacity 0.6s ease,transform 0.6s ease;
}

.reveal.active{opacity:1;transform:translateY(0)}

::-webkit-scrollbar{width:8px}
::-webkit-scrollbar-track{background:var(--color-bg-light)}
::-webkit-scrollbar-thumb{background:#ced4da;border-radius:4px}
::-webkit-scrollbar-thumb:hover{background:var(--color-secondary)}

::selection{
background:var(--color-primary);
color:#fff;
}

.top-link{
background:var(--color-primary);
color:#fff;
width:3rem;
aspect-ratio:1;
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
position:fixed;
bottom:20px;
right:20px;
z-index:20;
opacity:0;
visibility:hidden;
transition:all 0.5s;
font-size:1rem;
}

.top-link.show{visibility:visible;opacity:1}

.code-window{
background:linear-gradient(180deg,rgba(238,244,247,0.18),rgba(221,229,238,0.12));
border-radius:calc(var(--border-radius-lg) + 0.25rem);
overflow:hidden;
box-shadow:0 16px 40px rgba(7,12,20,0.18);
width:100%;
max-width:480px;
font-family:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
animation:float 8s ease-in-out infinite;
position:relative;
border:1px solid rgba(255,255,255,0.18);
backdrop-filter:blur(8px);
-webkit-backdrop-filter:blur(8px);
}

.code-window::before{
content:'';
position:absolute;
inset:0;
background:linear-gradient(180deg,rgba(255,255,255,0.08),transparent 28%,rgba(45,87,139,0.05));
pointer-events:none;
}

.code-header{
background:rgba(218,228,236,0.14);
padding:0.75rem 1rem;
display:flex;
align-items:center;
gap:0.75rem;
border-bottom:1px solid rgba(255,255,255,0.1);
}

.code-dots{display:flex;gap:0.5rem}
.code-dots span{
width:0.65rem;
height:0.65rem;
border-radius:50%;
background:rgba(255,255,255,0.45);
transition:transform 0.2s,background-color 0.2s;
}
.code-dots span:nth-child(1){background:rgba(255,255,255,0.35)}
.code-dots span:nth-child(2){background:rgba(137,190,191,0.55)}
.code-dots span:nth-child(3){background:rgba(207,232,118,0.55)}
.code-window:hover .code-dots span{transform:scale(1.08)}

.code-filename{
color:rgba(255,255,255,0.72);
font-size:0.78rem;
flex:1;
text-align:center;
margin-right:2rem;
font-family:var(--font-family);
font-weight:500;
letter-spacing:0.02em;
}

.code-content{
padding:1.35rem 1.5rem;
font-size:0.9rem;
line-height:1.7;
color:rgba(242,247,250,0.92);
background:linear-gradient(180deg,rgba(22,34,49,0.62),rgba(15,24,37,0.76));
}

.code-content .line{display:flex;gap:1rem;align-items:center}
.line-number{color:rgba(255,255,255,0.28);user-select:none;min-width:1.5rem;text-align:right;font-size:0.85rem}
.keyword{color:#b5d7ff;font-weight:600}
.type{color:#b6ece6;font-weight:600}
.function{color:#d8e7a6;font-weight:600}
.string{color:#f2c9c0}
.self{color:#9fc1eb}
.indent{margin-left:1.5rem;display:inline}

.terminal-cursor{
display:inline-block;
width:0.45rem;
height:1.1em;
background:rgba(207,232,118,0.8);
animation:blink 1s step-end infinite;
vertical-align:middle;
margin-left:2px;
border-radius:1px;
}

.access-gate{
position:fixed;
inset:0;
display:grid;
place-items:center;
padding:1.5rem;
background:linear-gradient(rgba(29,42,78,0.9),rgba(45,87,139,0.9)),url('../../img/header.jpg');
background-size:cover;
background-position:center;
z-index:9999;
}

.access-gate-card{
width:min(100%,28rem);
background:rgba(255,255,255,0.96);
border:1px solid rgba(29,42,78,0.08);
border-radius:var(--border-radius-lg);
box-shadow:0 1rem 3rem rgba(0,0,0,0.2);
padding:2rem;
text-align:center;
}

.access-gate-logo{
display:block;
margin:0 auto 1.5rem;
width:auto;
height:2.5rem;
}

.access-gate-card h1{
font-size:clamp(1.75rem,4vw,2.25rem);
line-height:1.2;
margin-bottom:0.75rem;
}

.access-gate-card p{
color:var(--color-text-secondary);
margin-bottom:1.5rem;
}

.access-gate-form{
display:grid;
gap:1rem;
text-align:left;
}

.access-gate-form label{
font-size:0.875rem;
font-weight:600;
color:var(--color-text-primary);
}

.access-gate-form .btn{width:100%}

.access-gate-error{
min-height:1.5rem;
margin:0;
font-size:0.875rem;
color:#b42318;
text-align:center;
}

@keyframes blink{
0%,100%{opacity:1}
50%{opacity:0}
}

@keyframes float{
0%,100%{transform:translateY(0)}
50%{transform:translateY(-6px)}
}

@media (max-width:768px){
.code-window{margin:0 auto;max-width:100%}
.code-content{font-size:0.8rem;padding:1rem}
}