:root{
--bg:#f4f7fb;
--ink:#0f172a;
--muted:#475569;
--line:rgba(148,163,184,0.22);
--cyan:#22d3ee;
--blue:#2563eb;
--violet:#8b5cf6;
--panel:rgba(255,255,255,0.84);
--panel-strong:rgba(255,255,255,0.96);
--shadow:0 24px 80px rgba(15,23,42,0.08);
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }

body{
margin:0;
font-family:"Inter",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
background:
radial-gradient(circle at 10% 10%, rgba(34,211,238,0.08), transparent 28%),
radial-gradient(circle at 88% 4%, rgba(139,92,246,0.09), transparent 32%),
var(--bg);
color:var(--ink);
line-height:1.6;
}

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

h1,h2,h3,h4,p{
margin:0;
}

.site-header{
position:sticky;
top:0;
z-index:20;
border-bottom:1px solid var(--line);
background:rgba(255,255,255,0.86);
backdrop-filter:blur(12px);
-webkit-backdrop-filter:blur(12px);
}

.navbar,
.container,
.footer-panel{
max-width:1280px;
margin:0 auto;
padding-left:24px;
padding-right:24px;
}

.navbar{
min-height:66px;
display:grid;
grid-template-columns:1fr auto 1fr;
align-items:center;
gap:16px;
padding-top:8px;
padding-bottom:8px;
}

.brand-link{
display:inline-flex;
align-items:center;
min-width:0;
justify-self:start;
}

.brand-link img{
display:block;
width:290px;
height:auto;
flex:0 0 290px;
object-fit:contain;
object-position:center;
filter:contrast(1.12) saturate(1.08) brightness(1.02);
image-rendering:-webkit-optimize-contrast;
}

.nav-links{
display:flex;
align-items:center;
gap:24px;
flex-wrap:wrap;
justify-content:center;
justify-self:center;
}

.nav-item{
position:relative;
display:inline-flex;
align-items:center;
}

.nav-links > a,
.nav-item > a{
font-size:15px;
font-weight:700;
color:var(--ink);
padding:8px 0;
}

.nav-links > a:hover,
.nav-links > a.active,
.nav-item > a:hover,
.nav-item > a.active{
color:var(--blue);
}

.nav-dropdown > a::after{
content:"";
display:inline-block;
width:0;
height:0;
margin-left:8px;
border-left:4px solid transparent;
border-right:4px solid transparent;
border-top:5px solid currentColor;
vertical-align:middle;
}

.nav-submenu{
position:absolute;
top:calc(100% + 8px);
left:0;
min-width:220px;
display:grid;
gap:4px;
padding:8px;
border:1px solid var(--line);
border-radius:14px;
background:rgba(255,255,255,0.98);
box-shadow:0 16px 28px rgba(15,23,42,0.12);
opacity:0;
visibility:hidden;
transform:translateY(6px);
transition:opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease;
z-index:30;
}

.nav-submenu a{
padding:8px 10px;
border-radius:10px;
font-size:14px;
font-weight:700;
white-space:nowrap;
color:var(--ink);
}

.nav-submenu a:hover,
.nav-submenu a.active{
color:var(--blue);
background:rgba(37,99,235,0.08);
}

.nav-dropdown:hover .nav-submenu,
.nav-dropdown:focus-within .nav-submenu{
opacity:1;
visibility:visible;
transform:translateY(0);
}

.container{
padding-top:24px;
padding-bottom:32px;
}

.page-stack{
display:grid;
gap:24px;
}

.hero,
.section-panel,
.product-detail,
.cta-band,
.frame-shell{
position:relative;
overflow:hidden;
border:1px solid var(--line);
border-radius:28px;
background:var(--panel);
box-shadow:var(--shadow);
backdrop-filter:blur(12px);
-webkit-backdrop-filter:blur(12px);
}

.hero:before,
.section-panel:before,
.product-detail:before,
.cta-band:before,
.frame-shell:before{
content:"";
position:absolute;
inset:-20% auto auto -10%;
width:260px;
height:260px;
background:radial-gradient(circle, rgba(34,211,238,0.16), transparent 68%);
pointer-events:none;
}

.hero:after,
.section-panel:after,
.product-detail:after,
.cta-band:after,
.frame-shell:after{
content:"";
position:absolute;
inset:auto -8% -26% auto;
width:320px;
height:320px;
background:radial-gradient(circle, rgba(139,92,246,0.14), transparent 70%);
pointer-events:none;
}

.hero,
.section-panel,
.product-detail,
.cta-band{
padding:28px 30px;
}

.page-hero{
padding:34px;
}

.hero-grid,
.page-grid,
.product-detail-grid,
.contact-grid,
.cta-band{
position:relative;
z-index:1;
display:grid;
gap:24px;
align-items:start;
}

.hero-grid,
.page-grid{
grid-template-columns:1fr 1fr;
}

.hero-grid.hero-grid-single{
grid-template-columns:1fr;
}

.page-grid.page-grid-single{
grid-template-columns:1fr;
}

.product-detail-grid{
grid-template-columns:0.95fr 1.05fr;
align-items:center;
}

.contact-grid{
grid-template-columns:1.1fr 0.9fr;
}

.cta-band{
grid-template-columns:1.1fr 0.9fr;
align-items:center;
}

.hero-copy,
.page-copy,
.cta-copy{
display:grid;
align-content:start;
}

.eyebrow,
.mini-label,
.card-label,
.detail-label{
display:inline-flex;
align-items:center;
padding:6px 12px;
border-radius:999px;
border:1px solid rgba(37,99,235,0.12);
background:rgba(255,255,255,0.86);
font-size:12px;
font-weight:800;
letter-spacing:0.1em;
text-transform:uppercase;
color:var(--blue);
}

.eyebrow{
color:#0f766e;
}

.mini-label.normal-case{
text-transform:none;
letter-spacing:0.02em;
}

.hero h1,
.page-hero h1{
font-size:52px;
line-height:1.02;
letter-spacing:-0.05em;
max-width:13ch;
}

.page-hero h1{
max-width:none;
}

.home-hero h1{
max-width:none;
}

.home-hero .core-message{
max-width:880px;
}

.modules-hero .page-copy p{
max-width:860px;
}

.use-cases-hero .page-copy p{
max-width:860px;
}

.weekly-hero .page-copy p{
max-width:860px;
}

.core-message,
.page-copy p{
margin-top:14px;
max-width:720px;
font-size:20px;
color:var(--muted);
}

.hero-summary,
.card-footer,
.detail-footer{
display:flex;
flex-wrap:wrap;
gap:10px;
}

.hero-summary{
margin-top:20px;
}

.signal-chip,
.meta-chip{
padding:10px 14px;
border-radius:999px;
background:rgba(255,255,255,0.88);
border:1px solid var(--line);
font-size:13px;
font-weight:700;
}

.hero-board{
display:grid;
gap:16px;
}

.hero-stack,
.info-card{
position:relative;
z-index:1;
padding:22px;
border-radius:24px;
background:var(--panel-strong);
border:1px solid var(--line);
box-shadow:0 18px 40px rgba(15,23,42,0.07);
}

.hero-stack h3,
.info-card h3{
font-size:22px;
letter-spacing:-0.03em;
margin:10px 0 8px 0;
}

.hero-stack p,
.info-card p{
color:var(--muted);
font-size:15px;
}

.stack-list,
.detail-points,
.product-points,
.bullet-list{
margin:18px 0 0 0;
padding:0;
list-style:none;
display:grid;
gap:12px;
}

.stack-list li,
.detail-points li,
.product-points li,
.bullet-list li{
padding:14px 16px;
border-radius:18px;
border:1px solid var(--line);
background:#fff;
}

.stack-list strong,
.bullet-list strong{
display:block;
font-size:15px;
margin-bottom:4px;
}

.stack-list span,
.bullet-list span{
font-size:14px;
color:var(--muted);
}

.section-head{
position:relative;
z-index:1;
display:flex;
justify-content:space-between;
gap:18px;
align-items:flex-end;
margin-bottom:22px;
}

.section-title{
font-size:36px;
line-height:1.08;
letter-spacing:-0.04em;
}

.section-copy{
max-width:820px;
color:var(--muted);
font-size:17px;
}

.section-copy-secondary{
margin-top:8px;
max-width:760px;
font-size:15px;
}

.cards,
.solution-grid,
.insights-wrap,
.stat-grid{
position:relative;
z-index:1;
display:grid;
gap:18px;
}

.cards,
.solution-grid,
.stat-grid{
grid-template-columns:repeat(3, minmax(0, 1fr));
}

.insights-wrap{
grid-template-columns:repeat(2, minmax(0, 1fr));
gap:14px 18px;
}

.card-link{
display:block;
}

.card,
.solution-card,
.contact-card,
.contact-actions,
.stat-card{
position:relative;
overflow:hidden;
height:100%;
padding:22px;
border-radius:22px;
border:1px solid var(--line);
background:rgba(255,255,255,0.8);
box-shadow:0 18px 40px rgba(15,23,42,0.08);
}

.card{
transition:transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.card:hover,
.insight-item:hover{
transform:translateY(-4px);
border-color:rgba(37,99,235,0.28);
box-shadow:0 24px 48px rgba(15,23,42,0.12);
}

.card.product-1:before,
.card.product-2:before,
.card.product-3:before{
content:"";
position:absolute;
inset:auto -60px -80px auto;
width:180px;
height:180px;
border-radius:999px;
pointer-events:none;
}

.card.product-1:before{ background:radial-gradient(circle, rgba(34,211,238,0.18), transparent 70%); }
.card.product-2:before{ background:radial-gradient(circle, rgba(139,92,246,0.18), transparent 70%); }
.card.product-3:before{ background:radial-gradient(circle, rgba(37,99,235,0.14), transparent 70%); }

.card h3,
.solution-card h4,
.stat-card h4{
margin:0 0 10px 0;
font-size:28px;
line-height:1.1;
letter-spacing:-0.03em;
}

.solution-card h4,
.stat-card h4{
font-size:18px;
}

.card p,
.solution-card p,
.stat-card p,
.contact-card p,
.contact-actions p{
color:var(--muted);
font-size:15px;
}

.solution-card p,
.stat-card p{
font-size:14px;
}

.card-cta{
margin-top:18px;
display:inline-flex;
align-items:center;
gap:8px;
color:var(--blue);
font-size:14px;
font-weight:800;
}

.impact-banner,
.use-case-lead{
position:relative;
z-index:1;
margin-top:22px;
padding:20px 22px;
border-radius:22px;
border:1px solid var(--line);
background:rgba(255,255,255,0.78);
}

.impact-banner strong{
display:block;
margin-bottom:6px;
font-size:18px;
letter-spacing:-0.02em;
}

.use-case-lead{
margin-top:0;
margin-bottom:20px;
padding:16px 0 10px 0;
border:0;
border-bottom:1px solid rgba(37,99,235,0.12);
border-radius:0;
background:transparent;
box-shadow:none;
}

.use-case-lead h3{
margin-top:10px;
max-width:820px;
font-size:24px;
line-height:1.18;
letter-spacing:-0.035em;
color:var(--ink);
}

.use-case-lead p{
margin-top:8px;
max-width:760px;
color:#334155;
font-size:15px;
}

.product-visual{
overflow:hidden;
border-radius:22px;
border:1px solid var(--line);
background:#fff;
box-shadow:0 18px 40px rgba(15,23,42,0.08);
}

.product-visual img{
display:block;
width:100%;
height:auto;
}

.detail-copy{
margin:10px 0 16px 0;
color:var(--muted);
font-size:16px;
}

.insight-item{
display:flex;
align-items:flex-start;
justify-content:space-between;
gap:14px;
padding:16px 18px;
border-radius:18px;
border:1px solid var(--line);
background:rgba(255,255,255,0.78);
font-weight:700;
transition:transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.insight-item:hover{
color:var(--blue);
}

.latest-issue-block .card{
margin-top:14px;
}

.insight-arrow{
color:var(--muted);
flex:0 0 auto;
}

.email-link{
display:inline-flex;
margin-top:12px;
font-size:20px;
font-weight:800;
letter-spacing:-0.02em;
color:var(--blue);
}

.social-row{
display:flex;
align-items:center;
gap:12px;
margin-top:16px;
}

.icon-link{
display:inline-flex;
align-items:center;
justify-content:center;
width:40px;
height:40px;
border-radius:10px;
color:#fff;
}

.linkedin-icon{ background:#0A66C2; }
.github-icon{ background:#24292e; }

.icon-link svg{
width:18px;
height:18px;
fill:#fff;
}

.cta-copy h2{
font-size:34px;
line-height:1.06;
letter-spacing:-0.04em;
}

.cta-copy p{
margin-top:10px;
max-width:640px;
color:var(--muted);
font-size:16px;
}

.cta-actions{
position:relative;
z-index:1;
display:flex;
justify-content:flex-end;
gap:12px;
flex-wrap:wrap;
}

.btn{
display:inline-flex;
align-items:center;
justify-content:center;
padding:12px 16px;
border-radius:999px;
border:1px solid transparent;
font-weight:800;
font-size:14px;
}

.btn-primary{
background:var(--blue);
color:#fff;
box-shadow:0 14px 30px rgba(37,99,235,0.22);
}

.btn-secondary{
background:rgba(255,255,255,0.88);
border-color:var(--line);
}

.frame-shell{
padding:0;
}

.frame-head{
position:relative;
z-index:1;
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
padding:18px 22px;
border-bottom:1px solid var(--line);
}

.frame-head h1{
font-size:28px;
letter-spacing:-0.03em;
}

.frame-head p{
margin-top:4px;
color:var(--muted);
}

.pdf-link{
white-space:nowrap;
color:var(--blue);
font-weight:700;
}

iframe{
position:relative;
z-index:1;
display:block;
width:100%;
height:calc(100vh - 170px);
border:0;
background:#fff;
}

.footer{
padding:0 0 24px 0;
}

.footer-shell{
border-top:1px solid var(--line);
padding-top:20px;
display:grid;
grid-template-columns:1fr auto 1fr;
align-items:center;
gap:16px;
font-size:14px;
}

.footer-left{
display:flex;
align-items:center;
justify-self:start;
}

.footer-center{
justify-self:center;
}

.footer-right{
display:flex;
align-items:center;
gap:14px;
justify-self:end;
}

.footer-link,
.footer-text{
font-weight:700;
color:var(--ink);
}

.footer-link:hover{
color:var(--blue);
}

.footer-right .social-row{
margin-top:0;
}

.contact-center{
position:relative;
z-index:1;
display:grid;
justify-items:center;
text-align:center;
padding:60px 24px;
}

.contact-center h1{
margin-top:12px;
font-size:44px;
line-height:1.06;
letter-spacing:-0.04em;
}

.contact-center .email-link{
margin-top:16px;
}

@media(max-width:1180px){
.cards,
.solution-grid,
.contact-grid,
.product-detail-grid,
.hero-grid,
.page-grid,
.cta-band,
.stat-grid{
grid-template-columns:1fr;
}

.insights-wrap{
grid-template-columns:1fr;
}
}

@media(max-width:900px){
.navbar{
display:flex;
flex-direction:column;
align-items:flex-start;
padding-top:12px;
padding-bottom:12px;
}

.nav-links{
width:100%;
justify-content:flex-start;
gap:16px;
}

.nav-submenu{
display:none !important;
}

.section-head,
.frame-head{
flex-direction:column;
align-items:flex-start;
}

.hero h1,
.page-hero h1{
font-size:40px;
max-width:none;
}

.core-message,
.page-copy p{
font-size:18px;
}

iframe{
height:75vh;
}
}

@media(max-width:640px){
.navbar,
.container,
.footer-panel{
padding-left:16px;
padding-right:16px;
}

.hero,
.page-hero,
.section-panel,
.product-detail,
.cta-band{
padding:22px;
}

.nav-links{
gap:12px 16px;
}

.brand-link img{
width:220px;
flex-basis:220px;
}

.section-title{
font-size:30px;
}

.contact-center h1{
font-size:32px;
}

.footer-shell{
grid-template-columns:1fr;
justify-items:flex-start;
}

.footer-left,
.footer-center,
.footer-right{
justify-self:flex-start;
}

.card,
.solution-card,
.contact-card,
.contact-actions,
.hero-stack,
.info-card,
.stat-card{
padding:18px;
}

.use-case-lead{
padding:14px 0 8px 0;
}

.use-case-lead h3{
font-size:20px;
}
}