/* PURON static SEO pages (tools/seo/build.js copies this to site/assets/seo/seo.css). Same look as the main site. */
*,*::before,*::after{box-sizing:border-box;}
:root{--navy:#082f72; --navy-d:#061a45; --blue:#1d4ed8; --blue-2:#3b82f6; --ink:#171b26; --soft:#545f74; --line:#dde3ee; --paper:#f4f6fa; --green:#22c55e;}
html{-webkit-text-size-adjust:100%;}
body{margin:0; font:400 16px/1.65 Manrope, system-ui, sans-serif; color:var(--ink); background:#fff;}
img{max-width:100%; height:auto; display:block;}
a{color:var(--blue);}
h1,h2,h3{font-weight:800; letter-spacing:-.02em; line-height:1.15; color:var(--navy-d); margin:0 0 .5em;}
.w{width:min(1180px, 100% - 40px); margin:0 auto;}
svg{width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; flex:none;}

/* header */
.sh{position:sticky; top:0; z-index:50; background:linear-gradient(180deg, #0a2a6b, #082460); box-shadow:0 10px 30px -18px rgba(0,0,0,.6);}
.sh-in{display:flex; align-items:center; gap:18px; height:68px;}
.sh-logo{display:inline-flex; align-items:center; gap:10px; color:#fff; text-decoration:none; font-weight:800; font-size:19px; letter-spacing:.02em;}
.sh-logo img{width:34px; height:34px; border-radius:9px; background:#fff;}
.sh-nav{display:flex; gap:4px; margin-left:18px; flex:1; overflow-x:auto; scrollbar-width:none;}
.sh-nav::-webkit-scrollbar{display:none;}
.sh-nav a{color:rgba(255,255,255,.86); text-decoration:none; font-weight:600; font-size:14.5px; padding:8px 12px; border-radius:10px; white-space:nowrap;}
.sh-nav a:hover{background:rgba(255,255,255,.1); color:#fff;}
.sh-tel{display:inline-flex; align-items:center; gap:8px; color:#fff; text-decoration:none; font-weight:700; font-size:14.5px; padding:9px 14px; border-radius:999px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2); white-space:nowrap;}
.sh-tel svg{color:#6ee7b7;}
.crumbs{display:flex; flex-wrap:wrap; gap:8px; padding:16px 0 0; font-size:13px; color:var(--soft);}
.crumbs a{color:var(--soft); text-decoration:none;} .crumbs a:hover{color:var(--blue);} .crumbs b{color:var(--navy); font-weight:700;}

/* hero */
.hero{padding:22px 0 56px; background:radial-gradient(90% 70% at 100% 0%, rgba(59,130,246,.12), transparent 60%), linear-gradient(180deg, #f6f9ff, #fff);}
.hero-in{display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:56px; align-items:center;}
.eyebrow{display:inline-flex; align-items:center; gap:10px; font-size:12px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--blue);}
.eyebrow::before{content:""; width:22px; height:2px; background:currentColor; border-radius:2px;}
.hero h1{font-size:clamp(32px, 4.6vw, 54px); margin:14px 0 16px;}
.lead{font-size:18px; color:var(--soft); max-width:60ch; margin:0 0 22px;}
.chips{list-style:none; margin:0 0 26px; padding:0; display:flex; flex-wrap:wrap; gap:8px;}
.chips li{display:inline-flex; align-items:center; gap:8px; padding:8px 14px; border-radius:999px; background:#fff; border:1px solid var(--line); font-size:14px; font-weight:700; color:var(--navy); box-shadow:0 8px 20px -16px rgba(8,47,114,.6);}
.chips svg{color:var(--blue);}
.hero-btns, .cta-btns{display:flex; flex-wrap:wrap; gap:12px;}
.btn{display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:15px 24px; border-radius:14px; font-weight:800; font-size:15.5px; text-decoration:none; transition:transform .25s, box-shadow .25s, background .25s;}
.btn:hover{transform:translateY(-2px);}
.btn-p{color:#fff; background:linear-gradient(135deg, #2563eb, #1d4ed8 55%, #1e40af); box-shadow:0 16px 30px -14px rgba(29,78,216,.8);}
.btn-g{color:var(--navy); background:#fff; border:1px solid var(--line);}
.btn-w{width:100%; margin-top:18px;}
.hero-img{margin:0; position:relative;}
.hero-img img{width:100%; aspect-ratio:4/3.3; object-fit:cover; border-radius:28px; box-shadow:0 40px 80px -40px rgba(8,30,80,.7);}
.hero-img::after{content:""; position:absolute; inset:0; border-radius:28px; box-shadow:inset 0 0 0 1px rgba(255,255,255,.4);}

/* sections */
.sec{padding:56px 0;}
.sec-soft{background:var(--paper);}
.sec-h{font-size:clamp(24px, 2.8vw, 34px); margin-bottom:22px;}
.sec-p{color:var(--soft); margin:-8px 0 24px; max-width:70ch;}
.prose{max-width:78ch; font-size:17px;}
.prose p{margin:0 0 1.1em;} .prose h2{font-size:26px; margin:1.6em 0 .6em;} .prose ul{padding-left:1.2em;} .prose li{margin:.35em 0;}
.cards4{display:grid; grid-template-columns:repeat(4, 1fr); gap:16px;}
.card{position:relative; padding:24px 22px; border-radius:20px; background:#fff; border:1px solid var(--line); box-shadow:0 20px 44px -32px rgba(8,47,114,.55); transition:transform .3s, box-shadow .3s;}
.card:hover{transform:translateY(-4px); box-shadow:0 26px 50px -30px rgba(8,47,114,.6);}
.card-n{position:absolute; right:18px; top:12px; font-size:30px; font-weight:800; color:transparent; -webkit-text-stroke:1px #c7d4ea;}
.card h3{font-size:18px; margin:4px 0 8px;} .card p{margin:0; color:var(--soft); font-size:14.5px;}
.steps{list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(4, 1fr); gap:16px; counter-reset:s;}
.steps li{display:flex; flex-direction:column; gap:6px; padding:22px; border-radius:20px; background:#fff; border:1px solid var(--line);}
.steps-n{width:38px; height:38px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-weight:800; color:#fff; background:linear-gradient(135deg, #3b82f6, #1d4ed8); margin-bottom:6px;}
.steps b{font-size:17px; color:var(--navy-d);} .steps li > span:last-child{color:var(--soft); font-size:14.5px;}
.why{list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(3, 1fr); gap:14px;}
.why li{display:flex; gap:14px; align-items:flex-start; padding:18px 20px; border-radius:18px; background:#fff; border:1px solid var(--line);}
.why svg{width:26px; height:26px; color:var(--blue); margin-top:2px;}
.why b{display:block; color:var(--navy-d);} .why span{font-size:14px; color:var(--soft);}
.why .why-first{background:linear-gradient(120deg, #0b2f75, #1d4ed8); border:0; color:#fff;}
.why .why-first b{color:#fff;} .why .why-first span{color:rgba(255,255,255,.8);} .why .why-first svg{color:#6ee7b7;}

/* town block */
.town{display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:28px; align-items:start;}
.town-card{padding:24px; border-radius:22px; background:linear-gradient(160deg, #0d2f74, #081d4a); color:#fff; box-shadow:0 30px 60px -36px rgba(6,20,48,.9);}
.town-row{display:flex; justify-content:space-between; gap:12px; padding:11px 0; border-bottom:1px solid rgba(255,255,255,.12); font-size:15px;}
.town-row span{color:rgba(255,255,255,.75);} .town-row b{color:#fff;}
.town-h{font-size:19px;}
.town-all{margin:14px 0 0; font-weight:700;}
.links{list-style:none; padding:0; margin:0; display:grid; gap:8px;}
.links a{display:flex; align-items:center; justify-content:space-between; gap:10px; padding:12px 16px; border-radius:14px; background:#fff; border:1px solid var(--line); color:var(--navy); font-weight:700; text-decoration:none; font-size:15px; transition:border-color .2s, transform .2s;}
.links a::after{content:"→"; color:var(--blue);}
.links a:hover{border-color:#9fb8e6; transform:translateX(3px);}
.links-grid{grid-template-columns:repeat(3, 1fr);}
.links-sm a{padding:8px 12px; font-size:13.5px; font-weight:600; border-radius:10px;}
.regions{display:grid; grid-template-columns:repeat(3, 1fr); gap:22px;}
.region h3{font-size:17px; margin-bottom:10px;}

/* town hub service cards */
.svgrid{display:grid; grid-template-columns:repeat(3, 1fr); gap:16px;}
.svcard{display:flex; flex-direction:column; border-radius:20px; overflow:hidden; background:#fff; border:1px solid var(--line); text-decoration:none; transition:transform .3s, box-shadow .3s;}
.svcard:hover{transform:translateY(-4px); box-shadow:0 26px 50px -30px rgba(8,47,114,.6);}
.svcard img{width:100%; aspect-ratio:16/9; object-fit:cover;}
.svcard-t{display:flex; flex-direction:column; gap:4px; padding:16px 18px 18px;}
.svcard-t b{color:var(--navy-d); font-size:17px;} .svcard-t span{color:var(--soft); font-size:14px;}

/* articles */
.art{padding:28px 0 40px;}
.art h1{font-size:clamp(30px, 4vw, 46px); margin:14px 0 12px;}
.art-grid{display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:48px; margin-top:24px; align-items:start;}
.art-side{position:sticky; top:90px; padding:22px; border-radius:20px; background:var(--paper);}
.art-side h3{font-size:16px; margin:0 0 12px;} .art-side .links{margin-bottom:22px;}
.art-side .links a{font-size:14px; padding:10px 12px;}
.art-cta{margin-top:28px;}
.artlist{display:grid; grid-template-columns:repeat(3, 1fr); gap:16px; margin-top:26px;}
.artcard{display:flex; flex-direction:column; gap:8px; padding:22px; border-radius:20px; border:1px solid var(--line); background:#fff; text-decoration:none; transition:transform .3s, box-shadow .3s;}
.artcard:hover{transform:translateY(-4px); box-shadow:0 26px 50px -30px rgba(8,47,114,.6);}
.artcard b{color:var(--navy-d); font-size:18px; line-height:1.3;} .artcard span{color:var(--soft); font-size:14.5px;} .artcard em{font-style:normal; font-weight:800; color:var(--blue); margin-top:auto;}
.azlist{display:grid; grid-template-columns:repeat(4, 1fr); gap:18px; margin-bottom:40px;}
.az{padding:16px 18px; border-radius:16px; border:1px solid var(--line); background:#fff;}
.az h3{font-size:17px; margin:0 0 8px;} .az h3 a{color:var(--navy-d); text-decoration:none;}
.az ul{list-style:none; margin:0; padding:0; font-size:13.5px; line-height:1.9;} .az ul a{color:var(--soft); text-decoration:none;} .az ul a:hover{color:var(--blue);}
.art .sec-h{margin-top:40px;}

/* CTA + footer */
.cta{margin:20px auto 64px;}
.cta-in{display:flex; align-items:center; justify-content:space-between; gap:28px; padding:36px 40px; border-radius:28px; color:#fff; background:radial-gradient(120% 120% at 100% 0%, rgba(59,130,246,.5), transparent 55%), linear-gradient(135deg, #0b2f75, #081d4a);}
.cta h2{color:#fff; font-size:clamp(22px, 2.6vw, 30px);} .cta p{margin:0; color:rgba(255,255,255,.8); max-width:60ch;}
.cta .btn-g{background:rgba(255,255,255,.1); color:#fff; border-color:rgba(255,255,255,.25);}
.sf{background:#071a45; color:rgba(255,255,255,.7); padding:56px 0 26px; font-size:14px;}
.sf-grid{display:grid; grid-template-columns:1.3fr 1fr 1fr 1.2fr; gap:32px;}
.sf p{max-width:34ch; margin:14px 0;}
.sf h5{margin:0 0 14px; color:#fff; font-size:12px; letter-spacing:.14em; text-transform:uppercase;}
.sf ul{list-style:none; margin:0; padding:0; line-height:2;}
.sf a{color:rgba(255,255,255,.8); text-decoration:none;} .sf a:hover{color:#fff;}
.sf-social{display:flex; gap:10px;} .sf-social img{width:28px; height:28px;}
.sf-bottom{display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; margin-top:36px; padding-top:20px; border-top:1px solid rgba(255,255,255,.1); font-size:12.5px;}

/* responsive */
@media (max-width:1080px){
  .sh-nav{display:none;}
  .sh-tel{margin-left:auto;}
  .hero-in{grid-template-columns:1fr; gap:30px;}
  .cards4, .steps{grid-template-columns:1fr 1fr;}
  .why, .links-grid, .svgrid, .artlist, .regions{grid-template-columns:1fr 1fr;}
  .azlist{grid-template-columns:1fr 1fr 1fr;}
  .art-grid{grid-template-columns:1fr;} .art-side{position:static;}
  .sf-grid{grid-template-columns:1fr 1fr;}
}
@media (max-width:640px){
  .w{width:calc(100% - 32px);}
  .sh-in{height:60px;} .sh-tel span{display:none;} .sh-tel{padding:10px;}
  .hero{padding-bottom:40px;} .lead{font-size:16.5px;}
  .hero-btns .btn, .cta-btns .btn{flex:1 1 100%;}
  .cards4, .steps, .why, .links-grid, .svgrid, .artlist, .regions, .town, .sf-grid{grid-template-columns:1fr;}
  .azlist{grid-template-columns:1fr 1fr;}
  .sec{padding:42px 0;}
  .cta-in{flex-direction:column; align-items:stretch; padding:28px 22px;}
  .prose{font-size:16px;}
}
@media (prefers-reduced-motion: reduce){ .btn, .card, .links a, .svcard, .artcard{transition:none;} }

/* LV | RU switch in the header (2026-10-07): the same page in the other language */
.sh-lang{display:inline-flex; gap:2px; padding:3px; border-radius:999px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.22); margin-left:auto;}
.sh-lang a{min-width:38px; padding:6px 10px; border-radius:999px; text-align:center; font-size:13px; font-weight:800; letter-spacing:.04em; color:rgba(255,255,255,.75); text-decoration:none;}
.sh-lang a:hover{color:#fff;}
.sh-lang a.on{background:#fff; color:var(--navy);}
.sh-in .sh-lang + .sh-tel{margin-left:10px;}
@media (min-width:1081px){ .sh-nav{flex:1 1 auto;} .sh-lang{margin-left:12px;} }
@media (max-width:640px){ .sh-lang a{min-width:34px; padding:6px 8px;} }
