:root{--navy:#003e59;--ink:#062237;--gold:#e3a535;--cream:#fcfaf4;--mist:#f8f4e9;--line:#dbe6eb;--white:#fff;--ease-out:cubic-bezier(.23,1,.32,1);--ease-in-out:cubic-bezier(.77,0,.175,1);--press:120ms;--quick:180ms;--settle:240ms}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font:15px/1.65 Manrope,Arial,sans-serif;background:var(--cream)}a{color:inherit;text-decoration:none}.container{width:min(1160px,calc(100% - 40px));margin:auto}.header{height:82px;background:#fffc;backdrop-filter:blur(12px);position:sticky;top:0;z-index:10;border-bottom:1px solid #ffffff80}.nav{height:100%;display:flex;align-items:center;gap:26px}.brand{display:inline-flex;align-items:center;gap:10px;line-height:1.12;color:var(--navy);flex-shrink:0}.brand span{display:grid;place-items:center;background:var(--navy);color:#fff;font-weight:800;width:39px;height:39px;border-radius:12px;font-size:14px}.brand strong{font-size:11px;letter-spacing:.02em}.nav nav{display:flex;gap:22px;margin-left:auto;font-size:13px;font-weight:700}.nav nav a:hover,.text-button:hover{color:var(--gold)}.nav-actions{display:flex;align-items:center;gap:13px}.lang{display:flex;border:1px solid var(--line);border-radius:7px;padding:2px}.lang a,.lang button{border:0;background:transparent;color:var(--ink);font:700 10px Manrope,Arial,sans-serif;padding:4px 8px;cursor:pointer;border-radius:4px;line-height:1;transition:background-color var(--quick) ease,color var(--quick) ease}.lang a.active,.lang button.active{background:var(--navy);color:#fff}.phone{font-weight:700;font-size:12px;white-space:nowrap}.button{display:inline-flex;align-items:center;justify-content:center;background:var(--navy);color:#fff;border:1px solid var(--navy);padding:13px 20px;border-radius:8px;font:700 13px Manrope,Arial,sans-serif;cursor:pointer;transition:transform var(--press) var(--ease-out),background-color var(--quick) ease,border-color var(--quick) ease,box-shadow var(--quick) var(--ease-out)}@media (hover:hover) and (pointer:fine){.button:hover{background:#0a5267;transform:translateY(-1px)}}.button:active{transform:scale(.97)}.button.small{padding:10px 14px;font-size:11px}.menu{display:none}.hero{padding:85px 0 70px;overflow:hidden;background:linear-gradient(120deg,#fffaf1 0%,#f0f7f5 65%,#e2eee9 100%)}.hero-grid{display:grid;grid-template-columns:1.06fr .94fr;align-items:center;gap:55px}.eyebrow{color:#a1691b;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.17em;margin:0 0 13px}#services .eyebrow{font-size:16px;letter-spacing:.12em}.hero h1,.section-intro h1,h2{font-family:"Playfair Display",Georgia,serif;color:var(--navy);line-height:1.08;margin:0}.hero h1{font-size:clamp(43px,5vw,68px);letter-spacing:-.04em;max-width:650px}.hero h1 em{font-style:normal;color:#b77c22}.lead{font-size:17px;max-width:590px;margin:24px 0 28px}.hero-buttons{display:flex;gap:25px;align-items:center}.text-button{font-weight:800;font-size:13px}.text-button span{font-size:20px;margin-left:5px}.trust-row{display:flex;gap:13px;flex-wrap:wrap;margin-top:45px;font-size:11px}.trust-row span{background:#ffffffb8;border:1px solid #fff;padding:7px 10px;border-radius:20px}html[lang=ru] .trust-row{font-size:15px;gap:12px}html[lang=ru] .trust-row span{padding:10px 14px}.photo,.photo:after,.stats{background:var(--navy);color:#fff}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr)}.stats-grid>div{display:flex;gap:13px;align-items:center;padding:25px 20px;border-right:1px solid #ffffff29}.stats-grid>div:first-child{border-left:1px solid #ffffff29}.stats b{font:700 25px "Playfair Display";color:#f0be60}.stats b:empty,.stats span:empty{display:none}html[lang=ru] .stats b{font-family:Manrope,Arial,sans-serif;font-size:23px}html[lang=ru] .stats-grid>div:nth-child(2) b{font-size:16px}.stats span{font-size:10px;line-height:1.25;font-weight:700;text-transform:uppercase;letter-spacing:.07em}.stats-grid .stat-text{display:grid;gap:2px;min-width:0}.stats-grid .stat-text span{margin-left:0;padding-top:0;align-self:start}.section{padding:100px 0}.section-intro{max-width:640px;margin-bottom:45px}.section-intro h1,.section-intro h2,.choose h2,.about h2{font-size:clamp(32px,4vw,48px);letter-spacing:-.035em}.section-intro>p:last-child{margin:13px 0 0}.centered{text-align:center;margin-left:auto;margin-right:auto}.group-title{font:700 17px Manrope;color:var(--navy);margin:43px 0 18px}.service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}.service-card{background:#fff;border:1px solid #edf0ed;border-radius:12px;padding:22px;min-height:240px;box-shadow:0 8px 24px #0a363a08;display:flex;flex-direction:column;transition:transform var(--settle) var(--ease-out),box-shadow var(--settle) var(--ease-out)}@media (hover:hover) and (pointer:fine){.service-card:hover{transform:translateY(-4px);box-shadow:0 16px 28px #0a363a18}}.service-icon{font-size:21px;color:#b57619}.service-icon svg{display:block;width:1.15em;height:1.15em}.service-card h4{font-size:14px;line-height:1.3;margin:13px 0 8px;color:var(--navy)}.service-card p{font-size:11px;line-height:1.55;margin:0 0 15px}.ask{font-size:11px;color:#9c6517;font-weight:800;margin-top:auto;cursor:pointer}.tinted{background:var(--mist)}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:50px;position:relative}.step{position:relative}.step:not(:last-child):after{content:"";height:1px;background:#9fbcb7;position:absolute;width:75px;right:-63px;top:18px}.step span{display:grid;place-items:center;color:#fff;background:var(--navy);border:5px solid #fff;width:43px;height:43px;border-radius:50%;font-size:11px;font-weight:bold;box-shadow:0 0 0 1px #aec9c4}.step h3{color:var(--navy);font-size:16px;margin:18px 0 6px}.step p{font-size:13px;margin:0;max-width:260px}.choose{display:grid;grid-template-columns:.82fr 1.18fr;gap:80px}.choose-copy p:last-child{font-size:15px}.reasons{display:grid;grid-template-columns:1fr 1fr;gap:32px 45px}.reasons i{font-style:normal;color:#bd8027;font-size:22px}.reasons h3{font-size:14px;color:var(--navy);margin:5px 0}.reasons p{font-size:12px;margin:0}.about{background:#f7f4ed}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:105px;align-items:center}.about-photo{height:410px;position:relative}.about-photo p{position:absolute;background:#fff;bottom:0;left:0;padding:12px 16px;margin:0;font-size:10px;font-weight:bold;letter-spacing:.08em;z-index:1}.about-photo p span{font-size:9px;font-weight:500;letter-spacing:0}.about-copy>p:not(.eyebrow){font-size:14px}.about-copy .text-button{display:inline-block;margin-top:11px}.testimonials{background:#fff}.testimonial-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.testimonial{background:var(--cream);padding:22px;border-radius:10px}.testimonial .stars{color:#bd8027;letter-spacing:2px;font-size:12px}.testimonial blockquote{margin:10px 0 18px;font:15px/1.5 "Playfair Display";color:var(--navy)}.testimonial cite{font-style:normal;font-size:10px;font-weight:bold}.narrow{max-width:760px}.faq-list{border-top:1px solid #cbdad7}.faq{border-bottom:1px solid #cbdad7}.faq button{padding:17px 0;width:100%;border:0;background:transparent;text-align:left;font:700 14px Manrope;color:var(--navy);cursor:pointer;display:flex;justify-content:space-between}.faq button:after{content:"+";font-size:20px;font-weight:400;line-height:1;transition:transform var(--settle) var(--ease-out)}.faq.open button:after{transform:rotate(135deg)}.faq{display:grid;grid-template-rows:auto 0fr;transition:grid-template-rows var(--settle) var(--ease-out)}.faq.open{grid-template-rows:auto 1fr}.faq p{overflow:hidden;min-height:0;margin:0 30px 0 0;font-size:13px;opacity:0;transition:opacity var(--quick) ease,padding-bottom var(--settle) var(--ease-out)}.faq.open p{opacity:1;padding-bottom:17px}.contact{background:var(--navy);color:#fff}.contact h2{color:#fff}.contact .eyebrow{color:#edc46e}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:100px}.contact-copy>p:not(.eyebrow){max-width:440px}.contact .button{background:#df9e35;border-color:#df9e35}.contact-details{display:grid;gap:4px;margin-top:32px;font-size:12px}.contact-details a{font-weight:bold}.quote-form{display:grid;grid-template-columns:1fr 1fr;gap:12px;background:#fff;color:var(--ink);padding:25px;border-radius:12px}.quote-form label{font-size:10px;font-weight:bold}.quote-form label:nth-child(4),.quote-form label:nth-child(5),.quote-form button,.form-success{grid-column:1/-1}.quote-form input,.quote-form select,.quote-form textarea{width:100%;margin-top:4px;border:1px solid #dbe5e3;padding:9px;border-radius:5px;font:12px Manrope;background:#fff}.quote-form .button{background:var(--navy);border-color:var(--navy)}.form-success{color:#18735f;font-weight:bold;font-size:12px;margin:0}.form-note{grid-column:1/-1;color:#536675;font-size:11px;font-weight:600;margin:-4px 0 0}.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}.form-error{grid-column:1/-1;color:#a8341c;font-weight:bold;font-size:12px;margin:0}.quote-form button[disabled]{opacity:.6;cursor:progress}footer{background:#062d39;color:#d9e6e3;padding:48px 0 18px;font-size:11px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:35px}.footer-grid .brand{color:#fff}.footer-grid p{max-width:240px;font-size:10px}.footer-grid div:not(:first-child){display:grid;align-content:start;gap:6px}.footer-grid b{color:#eabe68;margin-bottom:4px}.copyright{border-top:1px solid #ffffff22;padding-top:16px;margin-top:32px;font-size:9px}.simple-page{padding:80px 0;min-height:90vh}.simple-page h1{font:45px "Playfair Display";color:var(--navy);margin-top:55px}.reveal{opacity:0;transform:translateY(14px);transition:opacity 400ms var(--ease-out),transform 400ms var(--ease-out)}.reveal.visible{opacity:1;transform:none}
@media(max-width:900px){.nav nav,.phone,.nav-actions .button{display:none}.menu{display:block;border:0;background:none;color:var(--navy);font-size:23px;margin-left:auto}.nav.open nav{display:flex;position:absolute;top:82px;left:0;right:0;background:#fff;flex-direction:column;padding:20px}.nav-actions{margin-left:0}.hero-grid,.about-grid,.contact-grid{grid-template-columns:1fr;gap:40px}.hero{padding-top:55px}.service-grid{grid-template-columns:repeat(2,1fr)}.choose{grid-template-columns:1fr;gap:35px}.about-grid{gap:35px}.contact-grid{gap:35px}}
@media(max-width:560px){.container{width:min(100% - 30px,1160px)}.header{height:70px}.nav.open nav{top:70px}.brand strong{font-size:9px}.hero h1{font-size:42px}.lead{font-size:15px}.photo{height:290px;width:230px;right:25px}.stats-grid{grid-template-columns:1fr 1fr}.stats-grid>div{border-bottom:1px solid #ffffff29;padding:17px 7px}.section{padding:65px 0}.service-grid,.testimonial-grid{grid-template-columns:1fr}.service-card{min-height:190px}.steps,.reasons{grid-template-columns:1fr;gap:22px}.step:not(:last-child):after{height:26px;width:1px;left:20px;top:49px}.about-photo{height:345px}.footer-grid{grid-template-columns:1fr 1fr}.quote-form{grid-template-columns:1fr}.quote-form label{grid-column:1/-1!important}}

/* Lovable-reference implementation */
body{font-family:Manrope,Arial,sans-serif;background:#fff;color:#536675}.header{height:92px;background:#fff;border-bottom:1px solid #dbe5e8;box-shadow:0 5px 17px #052e3a08}.nav{max-width:1260px;gap:30px}.brand span{width:43px;height:43px;border-radius:50%;font-size:22px;color:var(--gold);background:var(--navy)}.brand strong{font-size:15px;color:var(--navy);line-height:1.1}.brand small{display:block;text-transform:uppercase;font-size:9px;letter-spacing:.2em;margin-top:6px;color:#526879}.nav nav{font-size:14px;color:#394b58;gap:25px}.phone{color:var(--navy);font-size:12px}.lang{background:#f6f5ef;border-color:#d8e2e7;border-radius:20px;padding:3px}.lang a,.lang button{font-size:10px;padding:6px 9px;border-radius:17px}.button.small{border-radius:22px;background:var(--gold);border-color:var(--gold);color:#2d210f;padding:10px 17px}.hero{position:relative;padding:0;min-height:620px;display:flex;align-items:center;background:url("images/larnaca-hero.ad5c5d1f6ca1.jpg") center/cover}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#00364fe8 5%,#093e558f 54%,#08354e84 100%)}.hero-grid{display:block;position:relative;z-index:1}.hero-copy{width:min(720px,100%);padding:92px 0 114px}.hero-pill{display:inline-flex;align-items:center;gap:9px;padding:7px 14px;border:1px solid #ffffff77;border-radius:24px;background:#57717a9d;color:#fff;font-size:12px;font-weight:700}.hero h1{font-family:Manrope,Arial,sans-serif;font-weight:800;color:#fff;max-width:700px;font-size:clamp(42px,5.2vw,73px);line-height:1.16;letter-spacing:-.055em;margin-top:29px}.hero h1 em{color:#fff;font-style:normal}.lead{color:#fff;max-width:650px;font-size:17px;line-height:1.7;margin:23px 0 27px}.hero-buttons{gap:15px}.hero .button{border-radius:28px;padding:15px 26px;font-size:14px}.hero .hero .text-button{border:1px solid #fff8;border-radius:28px;padding:12px 23px;color:#fff}.trust-row{margin-top:47px;color:#fff;font-size:12px;gap:28px}.trust-row span{padding:0;background:transparent;border:0}.trust-row span:first-letter{color:var(--gold)}.stats{position:relative;z-index:2;background:transparent;margin-top:-57px}.stats-grid{grid-template-columns:repeat(4,1fr);gap:18px}.stats-grid>div,.stats-grid>div:first-child{background:#fff;border:4px solid var(--navy);border-radius:16px;padding:16px 17px;box-shadow:0 10px 20px #002f491f;color:var(--navy);border-left:4px solid var(--navy)}.stats-grid i{font-style:normal;display:grid;place-items:center;width:43px;height:43px;background:#e8f5fb;border-radius:50%;font-size:20px}.stats-grid i svg{display:block;width:1.15em;height:1.15em}.stats-grid b{font-family:Manrope;font-size:25px;color:var(--navy);margin-left:2px}.stats-grid span{font-size:11px;text-transform:none;letter-spacing:0;color:#587080;align-self:end;margin-left:-51px;padding-top:30px}.section{padding:100px 0}.section-intro{margin:0 auto 46px;text-align:center}.section-intro .eyebrow,.eyebrow{color:var(--gold);font-size:11px;letter-spacing:.22em}.section-intro h2,.choose h2,.about h2{font-family:Manrope,Arial,sans-serif;font-weight:800;color:var(--ink);font-size:clamp(30px,3.5vw,48px);letter-spacing:-.055em}.section-intro>p:last-child{font-size:15px;color:#5e7080}.service-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px;align-items:stretch}.service-card{min-height:300px;border:4px solid var(--navy);border-radius:16px;padding:22px;background:#fff;box-shadow:0 10px 20px #002f491f}.service-icon{display:grid;place-items:center;width:49px;height:49px;border-radius:50%;background:var(--navy);color:#fff;font-size:20px}.service-card h4{font-size:18px;line-height:1.25;min-height:2.5em;color:var(--navy);margin:26px 0 9px;text-wrap:balance}.service-card p{font-size:13px;line-height:1.65;color:#5b6c79}.ask{font-size:12px;color:var(--navy);padding-top:6px}.tinted{background:var(--navy);color:#fff}.tinted .section-intro h2{color:#fff}.tinted .eyebrow{color:var(--gold)}.steps{gap:18px}.step{background:#174f68;border:1px solid #537384;border-radius:20px;padding:25px 25px 27px}.step:not(:last-child):after{display:none}.step span{display:inline-flex;background:var(--gold);color:#36260e;border:0;width:auto;height:auto;border-radius:0;box-shadow:none;padding:0;font-size:13px;font-weight:800;letter-spacing:.15em}.step h3{color:#fff;font-size:18px;margin:28px 0 8px}.step p{color:#d9e6eb;font-size:13px;line-height:1.7}.choose{grid-template-columns:1.08fr 1fr;gap:50px}.choose-copy{padding-top:30px}.reasons{gap:16px}.reasons>div{padding:21px;border:1px solid #d8e4e8;border-radius:16px}.reasons i{font-size:20px;color:var(--gold)}.reasons h3{font-size:14px;margin:12px 0 6px}.reasons p{font-size:12px;line-height:1.65}.about{background:var(--cream)}.about-grid{grid-template-columns:390px 1fr;gap:72px}.about-photo{height:545px}.about-photo img{width:100%;height:100%;object-fit:cover;border-radius:26px;display:block}.photo-placeholder{width:100%;height:100%;border-radius:26px;background:linear-gradient(160deg,#eef5f3,#dce9e6);border:1px dashed #b8ccc8}.about-photo p{bottom:-22px;left:20px;width:calc(100% - 40px);border-radius:28px;padding:13px 20px;font-size:13px;color:var(--navy);box-shadow:0 7px 18px #001e3214}.about-copy>p:not(.eyebrow){font-size:14px;line-height:1.8;color:#556976}.about-tags{display:flex;gap:9px;flex-wrap:wrap;margin:22px 0}.about-tags span{border:1px solid #d6e3e8;border-radius:20px;padding:7px 13px;color:var(--navy);font-size:11px;font-weight:800;background:#fff}.talk{border-radius:24px;background:var(--gold);color:#2c220e;border-color:var(--gold);padding:13px 20px}.testimonials{background:#fff}.testimonial-grid{grid-template-columns:1fr 1fr;gap:17px}.testimonial{min-height:205px;border:1px solid #d8e4e8;border-radius:16px;padding:26px;background:#fff}.testimonial .stars{display:none}.testimonial:before{content:'❯❯';display:block;color:var(--gold);font-size:20px;letter-spacing:-8px;margin-bottom:14px}.testimonial blockquote{font-family:Manrope;font-size:14px;line-height:1.7;color:#334553}.testimonial cite{border-top:1px solid #dbe5e8;padding-top:14px;display:block;font-size:12px;color:var(--navy)}#faq.tinted{background:var(--mist);color:var(--ink)}#faq .section-intro h2{color:var(--ink);max-width:500px;margin:auto}.faq-list{border:0;max-width:740px;margin:auto}.faq{margin:12px 0;border:1px solid #d9e3e7;border-radius:18px;background:#fff;padding:0 20px}.faq button{font-size:13px;padding:16px 0}.faq p{font-size:12px;line-height:1.7}.contact{background:#fff;color:#536675}.contact h2{color:var(--ink)}.contact-grid{grid-template-columns:1.25fr .8fr;gap:28px}.contact-copy{grid-column:1/-1;text-align:center;max-width:740px;margin:auto}.contact-copy .button,.contact-copy .contact-details{display:none}.quote-form{background:#fff;border:1px solid #d8e4e8;border-radius:18px;box-shadow:0 8px 20px #00334c0d;padding:25px}.quote-form .button{width:max-content;border-radius:24px;background:var(--gold);border-color:var(--gold);color:#30240f}.footer-grid{max-width:1000px;grid-template-columns:1.4fr .8fr 1fr;gap:70px}.footer-grid>div:nth-child(3){display:none}footer .brand span{background:#285f76;color:var(--gold)}footer .brand strong{color:#fff}.footer-grid p{font-size:11px;line-height:1.8}.copyright{text-align:center}.simple-page{background:var(--cream)}
@media(max-width:900px){.header{height:73px}.nav.open nav{top:73px}.nav-actions{margin-left:auto}.hero-copy{padding:80px 0 95px}.stats{margin-top:-40px}.stats-grid{grid-template-columns:1fr 1fr}.service-grid{grid-template-columns:1fr 1fr}.about-grid{grid-template-columns:1fr;gap:44px}.about-photo{max-width:400px}.contact-grid{grid-template-columns:1fr}.contact:after{grid-column:1}.footer-grid{grid-template-columns:1fr 1fr;gap:35px}}
@media(max-width:560px){.nav-actions .lang{display:flex}.hero{min-height:580px;background-position:55% center}.hero-copy{padding:68px 0 65px}.hero h1{font-size:40px}.hero-pill{font-size:10px}.trust-row{gap:11px;margin-top:30px;font-size:10px}.stats-grid{gap:8px}.stats-grid>div{padding:12px}.stats-grid i{width:32px;height:32px;font-size:15px}.stats-grid b{font-size:18px}.stats-grid span{font-size:9px;margin-left:-37px;padding-top:23px}.service-grid,.testimonial-grid{grid-template-columns:1fr}.section{padding:68px 0}.choose{grid-template-columns:1fr}.about-photo{height:430px}.footer-grid{grid-template-columns:1fr}.contact:after{font-size:13px}.brand strong{font-size:11px}.brand small{font-size:7px}.hero .text-button{padding:11px 13px}.hero .button{padding:13px 16px}}

.biometric-note{max-width:760px;margin:38px auto 0;padding:15px 22px;border:1px dashed #d8e4e8;border-radius:16px;background:#fffdf5;color:#596b77;text-align:center;font-size:12px;line-height:1.7}.quote-form .consent{grid-column:1/-1;display:flex;align-items:flex-start;gap:9px;font-size:10px;line-height:1.55;font-weight:500;color:#536675}.quote-form .consent input{width:15px;height:15px;flex:0 0 auto;margin:2px 0 0}.quote-form .consent a{color:var(--navy);font-weight:800;text-decoration:underline}.policy{min-height:100vh;background:var(--cream);padding:70px 0}.policy-inner{max-width:820px}.policy .brand{margin-bottom:80px}.policy .eyebrow{margin-bottom:12px}.policy h1{font:800 clamp(36px,5vw,56px)/1.06 Manrope;color:var(--ink);letter-spacing:-.055em;margin:0}.policy .updated{font-size:12px;color:#687782;margin:13px 0 55px}.policy section{padding:25px 0;border-top:1px solid #dce6e7}.policy h2{font:800 19px Manrope;color:var(--navy);margin:0 0 9px}.policy p{font-size:14px;line-height:1.8;margin:8px 0}.policy a{color:var(--navy);font-weight:700;text-decoration:underline}

/* --- Guides ------------------------------------------------------------ */
.nav nav a.current{color:var(--gold)}
.guide-list{display:grid;gap:14px;margin-bottom:34px}
.guide-item{display:block;background:#fff;border:2px solid var(--navy);border-radius:14px;padding:20px 22px;transition:transform var(--settle) var(--ease-out),box-shadow var(--settle) var(--ease-out)}
@media (hover:hover) and (pointer:fine){.guide-item:hover{transform:translateY(-2px);box-shadow:0 10px 20px #002f491f}}.guide-item:active{transform:scale(.995)}
.guide-item h4{margin:0 0 6px;font-size:17px;color:var(--navy);line-height:1.3}
.guide-item p{margin:0 0 10px;font-size:13px;color:#5b6c79}
.guide-meta{font-size:11px;font-weight:700;letter-spacing:.04em;color:#7c93a0;text-transform:uppercase}
.guide-empty{background:#fff;border:1px dashed #b8ccc8;border-radius:14px;padding:26px;color:#5b6c79}
.guide{max-width:74ch}
.crumbs{font-size:12px;color:#7c93a0;margin-bottom:18px}
.crumbs a{color:var(--navy);font-weight:700}
.guide h1{font:700 clamp(30px,4vw,42px)/1.1 "Playfair Display",Georgia,serif;color:var(--navy);letter-spacing:-.02em;margin:0 0 12px}
.guide-standfirst{font-size:17px;color:#4a6572;margin:0 0 10px}
.guide-body{margin-top:28px;font-size:16px;line-height:1.75;color:#3d5361}
.guide-body h2{font:700 22px/1.25 Manrope,Arial,sans-serif;color:var(--navy);margin:34px 0 10px}
.guide-body h3{font-size:17px;color:var(--navy);margin:24px 0 8px}
.guide-body ul,.guide-body ol{padding-left:22px}
.guide-body li{margin-bottom:7px}
.guide-body table{border-collapse:collapse;width:100%;font-size:14px;margin:18px 0}
.guide-body th,.guide-body td{border:1px solid var(--line);padding:9px 12px;text-align:left}
.guide-body blockquote{border-left:4px solid var(--gold);background:#fdf7ec;margin:20px 0;padding:14px 18px;font-size:15px}
.guide-sources{margin-top:38px;border-top:2px solid var(--line);padding-top:20px}
.guide-sources h2{font-size:15px;color:var(--navy);margin:0 0 10px}
.guide-sources ul{margin:0;padding-left:20px;font-size:14px}
.guide-cta{margin-top:34px;background:var(--navy);color:#fff;border-radius:16px;padding:26px 28px}
.guide-cta h2{color:#fff;font:700 20px Manrope,Arial,sans-serif;margin:0 0 8px}
.guide-cta p{font-size:14px;margin:0 0 16px;color:#d7e6ea}
.guide-cta .button{background:var(--gold);border-color:var(--gold);color:#30240f}
.draft-flag{display:block;background:#fdf0e7;border:1px solid #e6b79a;color:#9a3412;border-radius:8px;padding:9px 13px;font-size:12px;font-weight:800;margin:0 0 14px}
.draft-flag.inline{display:inline-block;padding:2px 7px;font-size:10px;margin-left:6px;vertical-align:2px}
.home-articles{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin-bottom:22px}
.guide-pillar{display:block;font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);margin-bottom:8px}

/* --- Salary calculator -------------------------------------------------- */
.calc{display:grid;grid-template-columns:1fr 1.15fr;gap:22px;align-items:start;margin:8px 0 40px}
.calc-inputs{background:#fff;border:3px solid var(--navy);border-radius:16px;padding:22px;display:grid;gap:14px}
.calc-field{display:grid;gap:6px;font-size:12px;font-weight:800;color:var(--navy)}
.calc-field input{border:1px solid #cbdedb;border-radius:8px;padding:11px 12px;font:600 17px Manrope,Arial,sans-serif;background:#fff;color:var(--ink)}
.calc-field input:focus{outline:2px solid var(--gold);outline-offset:1px}
.calc-check{display:flex;gap:10px;align-items:flex-start;font-size:13px;line-height:1.4;color:#42606d;font-weight:600}
.calc-check input{width:17px;height:17px;flex:0 0 auto;margin-top:1px}
.calc-note{margin:0;font-size:12px;color:#9a3412;background:#fdf0e7;border-radius:8px;padding:9px 11px}
.calc-results{background:var(--navy);color:#fff;border-radius:16px;padding:24px}
.calc-headline{display:grid;gap:2px;padding-bottom:16px;border-bottom:1px solid #ffffff2e;margin-bottom:14px}
.calc-headline span{font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:#a9c8d2;font-weight:800}
.calc-headline strong{font:700 40px/1 "Playfair Display",Georgia,serif;color:#f0be60;letter-spacing:-.02em}
.calc-headline small{font-size:12px;color:#c4dbe2}
.calc-table{width:100%;border-collapse:collapse;font-size:13.5px}
.calc-table th{text-align:left;font-weight:600;color:#cbdfe6;padding:7px 0}
.calc-table td{text-align:right;font-variant-numeric:tabular-nums;font-weight:700;padding:7px 0}
.calc-table .calc-subtotal th,.calc-table .calc-subtotal td{border-top:1px solid #ffffff2e;padding-top:11px}
.calc-table .calc-total th,.calc-table .calc-total td{border-top:2px solid #f0be60;padding-top:11px;font-size:16px;color:#fff}

.calc-explain{border-top:2px solid var(--line);padding-top:26px}
.calc-explain h2{font:700 20px Manrope,Arial,sans-serif;color:var(--navy);margin:0 0 12px}
.calc-rates{width:100%;border-collapse:collapse;font-size:13.5px;margin-bottom:16px}
.calc-rates th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#7c93a0;padding:8px 10px;border-bottom:1px solid var(--line)}
.calc-rates td{padding:8px 10px;border-bottom:1px solid var(--line)}
.calc-rates td:last-child{text-align:right;font-variant-numeric:tabular-nums;font-weight:700;color:var(--navy)}
.calc-disclaimer{font-size:12.5px;color:#5b6c79;background:var(--mist);border-radius:10px;padding:13px 15px}
@media (max-width:860px){.calc{grid-template-columns:1fr}}

.calc-amount{display:flex;gap:8px}
.calc-amount input{flex:1;min-width:0}

.calc-note-info{color:#1d5b6e;background:#e8f5fb}
.split{display:flex;height:14px;border-radius:8px;overflow:hidden;margin:4px 0 10px;background:#ffffff22}
.split-part{display:block;height:100%}
.split-key{display:flex;flex-wrap:wrap;gap:12px;font-size:11px;color:#cbdfe6;margin-bottom:16px}
.split-key i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:5px}
.calc-table thead th{font-size:10px;text-transform:uppercase;letter-spacing:.09em;color:#a9c8d2;text-align:right;padding-bottom:6px}
.calc-table thead th:first-child{text-align:left}
.calc-detail{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin:34px 0 10px}
.calc-detail h2{font:700 18px Manrope,Arial,sans-serif;color:var(--navy);margin:0 0 4px}
.calc-sub{font-size:13px;color:#5b6c79;margin:0 0 12px}
.calc-rates td:nth-child(2),.calc-rates td:nth-child(3),.calc-rates td:nth-child(4){text-align:right;font-variant-numeric:tabular-nums}
.calc-rates th:nth-child(2),.calc-rates th:nth-child(3),.calc-rates th:nth-child(4){text-align:right}
.calc-rates tr.band-empty{color:#9fb2bc}
.calc-rates tr.calc-total td{font-weight:800;color:var(--navy);border-top:2px solid var(--navy)}
.calc-facts{list-style:none;margin:0 0 16px;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:8px;font-size:13px}
.calc-facts li{background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px 13px;font-variant-numeric:tabular-nums}
.calc-facts b{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:#7c93a0;margin-bottom:2px}
.calc-cta{display:flex;gap:20px;align-items:center;flex-wrap:wrap;margin-top:16px}
@media (max-width:860px){.calc-detail{grid-template-columns:1fr}}
.calc-card{border-color:var(--gold);background:linear-gradient(160deg,#fffdf8,#fdf6e8)}
.calc-card .guide-pillar{color:#a86f14}

.calc-group{border:1px solid var(--line);border-radius:12px;padding:14px 14px 4px;margin:0;display:grid;gap:12px;background:var(--mist)}
.calc-group legend{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.09em;color:#7c93a0;padding:0 6px}
.calc-field select{border:1px solid #cbdedb;border-radius:8px;padding:10px 11px;font:600 13px Manrope,Arial,sans-serif;background:#fff;color:var(--ink);width:100%}.calc-amount{display:flex;gap:8px;align-items:stretch}.calc-amount input{flex:1 1 auto;min-width:120px;width:auto}.calc-amount select{width:auto;flex:0 0 auto;padding:0 10px;font-size:13px;color:var(--navy)}
.calc-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:16px;padding-top:14px;border-top:1px solid #ffffff2e}
.calc-stats div{text-align:center}
.calc-stats b{display:block;font:700 20px Manrope,Arial,sans-serif;color:#f0be60;font-variant-numeric:tabular-nums}
.calc-stats span{font-size:10.5px;line-height:1.3;color:#bcd6de;display:block;margin-top:3px}
.calc-reform{background:#fff;border:3px solid var(--navy);border-radius:16px;padding:22px 24px;margin:30px 0}
.calc-reform h2{font:700 18px Manrope,Arial,sans-serif;color:var(--navy);margin:0 0 14px}
.reform-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:12px}
.reform-grid div{background:var(--mist);border-radius:11px;padding:13px 15px}
.reform-grid span{display:block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:#7c93a0;margin-bottom:4px}
.reform-grid b{font:700 22px Manrope,Arial,sans-serif;color:var(--navy);font-variant-numeric:tabular-nums}
.reform-grid .reform-diff{background:#eaf6f0;border:1px solid #b6ddc9}
.reform-grid .reform-diff b{color:#1f7a55}
.reform-grid small{display:block;font-size:11px;color:#5b6c79;margin-top:2px}
@media (max-width:700px){.calc-stats,.reform-grid{grid-template-columns:1fr}}

/* --- Interaction polish ------------------------------------------------ */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--gold);outline-offset:2px;border-radius:4px}
.nav nav a{transition:color var(--quick) ease}
.ask{transition:color var(--quick) ease,transform var(--press) var(--ease-out)}
.ask:active{transform:translateX(2px)}
.text-button{transition:color var(--quick) ease}
.text-button span{display:inline-block;transition:transform var(--settle) var(--ease-out)}
@media (hover:hover) and (pointer:fine){.text-button:hover span{transform:translateX(3px)}}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  .button:hover,.service-card:hover,.guide-item:hover{transform:none}
  .button:active,.guide-item:active,.ask:active{transform:none}
  .text-button:hover span{transform:none}
  .faq{transition:none}
  *{scroll-behavior:auto}
}

/* --- Entrance and interaction (design-eng pass 2) ---------------------- */

/* 1. Hero entrance. Rare/first-time tier: seen once per visit, so the delight
      budget applies. Purpose: explanation — it walks the eye down the page. */
.hero-copy > *{opacity:0;transform:translateY(12px);animation:rise 520ms var(--ease-out) forwards}
.hero-copy > :nth-child(1){animation-delay:60ms}
.hero-copy > :nth-child(2){animation-delay:130ms}
.hero-copy > :nth-child(3){animation-delay:200ms}
.hero-copy > :nth-child(4){animation-delay:270ms}
.hero-copy > :nth-child(5){animation-delay:340ms}
@keyframes rise{to{opacity:1;transform:none}}

/* 2. Header gains a shadow once you leave the top, so it stops floating
      ambiguously over the content. State indication. */
.header{transition:box-shadow var(--settle) var(--ease-out),background-color var(--settle) ease}
.header.scrolled{box-shadow:0 6px 22px #0a363a14;background:#fffefbf2}

/* 3. Mobile menu: it appeared instantly, which reads as a glitch. */
.nav nav{transform-origin:top center}
.nav.open nav{animation:menu-in 220ms var(--ease-out)}
@keyframes menu-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

/* 4. Service icon answers the card hover. Near-imperceptible by design. */
.service-icon{transition:transform var(--settle) var(--ease-out)}
@media (hover:hover) and (pointer:fine){.service-card:hover .service-icon{transform:scale(1.06)}}

/* 5. Calculator: the bar jumped between widths on every keystroke. */
.split-part{transition:width var(--settle) var(--ease-out)}

/* 6. Form success. Rare tier — you see it once, when it matters. */
.form-success{transform:scale(.97);opacity:0;transition:opacity var(--quick) var(--ease-out),transform var(--quick) var(--ease-out)}
.form-success:not([hidden]){transform:none;opacity:1}

/* 7. Article cards lift their title colour, not just the card. */
.guide-item h4{transition:color var(--quick) ease}
@media (hover:hover) and (pointer:fine){.guide-item:hover h4{color:#a86f14}}

@media (prefers-reduced-motion:reduce){
  .hero-copy > *{animation:none;opacity:1;transform:none}
  .nav.open nav{animation:none}
  .service-card:hover .service-icon{transform:none}
  .split-part{transition:none}
  .form-success{transform:none}
}

/* --- Contact form fields ------------------------------------------------ */
.quote-form input[type=text],.quote-form input:not([type]),.quote-form input[type=email],
.quote-form select,.quote-form textarea{
  border:2px solid var(--navy);border-radius:9px;padding:11px 12px;
  font:500 14px Manrope,Arial,sans-serif;color:var(--ink);
  transition:border-color var(--quick) ease,box-shadow var(--quick) var(--ease-out)}
.quote-form textarea{resize:vertical;min-height:96px}
.quote-form input:focus,.quote-form select:focus,.quote-form textarea:focus{
  outline:none;border-color:var(--gold);box-shadow:0 0 0 3px #d69a3526}
.quote-form .consent input[type=checkbox]{
  width:18px;height:18px;accent-color:var(--navy);border:2px solid var(--navy);border-radius:4px}
.quote-form label{color:var(--navy)}

/* Hero primary button sits on a busy photograph, so it reads lighter than the
   deep navy used elsewhere while keeping 7:1 contrast with its white label. */
.hero-buttons .button{background:#0e5f7a;border-color:#0e5f7a}
@media (hover:hover) and (pointer:fine){
  .hero-buttons .button:hover{background:#146a86;border-color:#146a86}
}

/* "See services" becomes a secondary pill matched to the primary button's
   size, one step lighter so the hierarchy still reads. */
.hero-buttons{gap:14px}
.hero-buttons .text-button{
  display:inline-flex;align-items:center;justify-content:center;
  /* matches .hero .button exactly: 28px pill, 15px 26px, 14px type */
  padding:15px 26px;border-radius:28px;
  background:#ffffffee;border:1px solid #ffffff;color:#0e5f7a;
  font:700 14px Manrope,Arial,sans-serif;
  box-shadow:0 2px 10px #07303f1a;
  transition:transform var(--press) var(--ease-out),background-color var(--quick) ease,
             box-shadow var(--quick) var(--ease-out),color var(--quick) ease}
.hero-buttons .text-button span{font-size:16px;margin-left:6px}
@media (hover:hover) and (pointer:fine){
  .hero-buttons .text-button:hover{background:#fff;color:#146a86;box-shadow:0 6px 16px #07303f24}
}
.hero-buttons .text-button:active{transform:scale(.97)}
@media (prefers-reduced-motion:reduce){.hero-buttons .text-button:active{transform:none}}

/* The services section renders two grids (documents, business) with a hidden
   group heading between them. display:none drops the heading's margins too, so
   the two grids met with no gap while cards inside each had 18px. This gives
   the seam the same 18px, so every card sits an equal distance from its
   neighbours in both directions. */
.service-grid ~ .service-grid{margin-top:18px}
.biometric-note{margin-top:32px}

/* Category headings were in the markup but hidden, so the twelve cards read as
   one undifferentiated block. Shown now, each category gets its own row. */
.group-title{
  display:flex;align-items:center;gap:20px;
  font:800 clamp(20px,2.4vw,28px) Manrope,Arial,sans-serif;text-transform:uppercase;letter-spacing:.04em;
  color:var(--navy);margin:56px 0 24px}
.group-title:first-of-type{margin-top:0}
.group-title:before,.group-title:after{content:"";flex:1;height:2px;background:#9db4bd;border-radius:2px}
.service-grid ~ .service-grid{margin-top:0}
@media (max-width:560px){.group-title{margin:38px 0 18px;font-size:19px;letter-spacing:.03em;gap:12px}}

/* --- Section shading ---------------------------------------------------- */
/* The page was white end to end, so nothing separated one section from the
   next. A soft tint on the page ground, with white reserved for the sections
   that carry cards, gives the scroll a rhythm without adding colour. */
body{background:#f4f8f9}

#services,.testimonials,.contact{background:#fff}
#articles.tinted{background:var(--cream);color:var(--ink)}
#articles.tinted .section-intro h2{color:var(--ink)}
#articles.tinted .eyebrow{color:#8a5a0d}
#how.tinted{background:var(--navy);color:#fff}
.about{background:#f7f4ed}
#faq.tinted{background:#eef4f6;color:var(--ink)}

/* Inner pages sit on the same tint, so their white cards read as raised. */
.simple-page,.guide,.calc-explain{background:transparent}

/* ========================================================================
   Redesign layer — lighter card-based treatment.
   Replaces the heavy navy-bordered look with thin borders, soft shadows and
   alternating cream / pale-blue sections, gold as the action colour.
   ===================================================================== */
:root{
  --nv:#123c5a; --nv-soft:#2c5f83; --gd:#e8a33d; --gd-deep:#955d0c;
  --ink2:#22384a; --muted:#5f7386;
  --page:#f7fafd; --blue:#edf4fc; --cream2:#fdf4e7; --mint:#e9f6f0;
  --edge:#e3ebf2; --shadow:0 4px 16px #10375614; --shadow-lg:0 12px 30px #1037561f;
}
body{background:var(--page);color:var(--muted)}

/* header */
.header{height:76px;background:#fffffff2;border-bottom:1px solid var(--edge);box-shadow:none}
.brand span{background:var(--nv);color:var(--gd);border-radius:11px;width:36px;height:36px;font-size:17px}
.brand strong{color:var(--nv);font-size:14px}
.brand small{color:#8397a8}
.nav nav a{color:#3d5568;font-weight:600;font-size:13.5px}
.nav nav a.current,.nav nav a:hover{color:var(--gd-deep)}
.lang{background:#f1f5f9;border:1px solid var(--edge);border-radius:18px;padding:2px}
.lang a{color:#5f7386;font-weight:700}
.lang a.active{background:var(--nv);color:#fff}
.phone{color:var(--muted);font-weight:600}
.button.small{background:var(--gd);border-color:var(--gd);color:#3a2a0c;border-radius:22px}

/* hero */
.hero{min-height:600px}
.hero-shade{background:linear-gradient(100deg,#0d3350f2 0%,#12405fcc 45%,#14486799 100%)}
.hero-pill{background:#ffffff26;border:1px solid #ffffff4d;border-radius:22px;font-size:11.5px;font-weight:700}
.hero h1{font-size:clamp(38px,4.6vw,60px);line-height:1.1;letter-spacing:-.03em}
.hero h1 em{color:var(--gd)}
.lead{font-size:16px;color:#dbe7f0;max-width:600px}
.hero-buttons .button{background:var(--gd);border-color:var(--gd);color:#3a2a0c;border-radius:26px;padding:14px 26px}
.hero-buttons .text-button{background:transparent;border:1px solid #ffffff8c;color:#fff;border-radius:26px;padding:14px 24px;box-shadow:none}
.trust-row{gap:26px;margin-top:38px;font-size:12px;color:#cfe0ec}
.trust-row span{background:none;border:0;padding:0;display:inline-flex;align-items:center;gap:7px;font-size:0}
.trust-row span:before{content:"✓";color:var(--gd);font-size:12px;font-weight:800}
.trust-row span b{font-size:12px;font-weight:600;color:#e7f0f6}

/* stats — one white card, not four bordered boxes */
.stats-grid{background:#fff;border-radius:18px;box-shadow:var(--shadow-lg);gap:0;overflow:hidden;padding:6px 0}
.stats-grid>div,.stats-grid>div:first-child{background:transparent;border:0;border-left:1px solid var(--edge);
  border-radius:0;box-shadow:none;padding:20px 22px}
.stats-grid>div:first-child{border-left:0}
.stats-grid i{background:var(--blue);color:var(--nv);width:38px;height:38px}
.stats-grid b{color:var(--nv);font-size:21px}
.stats-grid span{color:#7c8fa1;font-size:11px;margin-left:0;padding-top:0}
.stats-grid .stat-text{gap:1px}

/* section rhythm */
#services{background:var(--page)}
#articles.tinted{background:var(--cream2)}
#how.tinted{background:var(--blue);color:var(--ink2)}
#how.tinted .section-intro h2,#how .step h3{color:var(--nv)}
#how .step p{color:var(--muted)}
.about{background:var(--cream2)}
.testimonials{background:#fff}
#faq.tinted{background:var(--blue)}
.contact{background:var(--cream2)}
.section-intro h1,.section-intro h2,.choose h2,.about h2{color:var(--nv);font-size:clamp(27px,3vw,38px)}
.eyebrow,.section-intro .eyebrow{color:var(--gd-deep);font-size:11px;letter-spacing:.2em}

/* category headings — centred label, no rules */
.group-title{display:block;text-align:center;font:800 11.5px Manrope,Arial,sans-serif;
  letter-spacing:.18em;color:var(--nv-soft);margin:40px 0 20px}
.group-title:before,.group-title:after{display:none}

/* cards */
.service-card,.reasons>div,.testimonial,.faq,.guide-item,.step{
  border:1px solid var(--edge);border-radius:14px;background:#fff;box-shadow:var(--shadow)}
.service-card{min-height:0;padding:22px 22px 20px}
.service-icon{width:38px;height:38px;border-radius:10px;background:var(--blue);color:var(--nv);font-size:17px}
.service-card h4{font-size:15px;min-height:0;margin:16px 0 8px;color:var(--nv)}
.service-card p{font-size:12.5px;color:var(--muted);line-height:1.6}
.ask{color:var(--nv);font-size:12px;font-weight:700}
.service-grid{gap:16px}

/* articles */
.guide-item{background:#fffaf2;border-color:#f0e0c6}
.guide-pillar{color:var(--gd-deep);font-size:9.5px}
.guide-item h4{font-size:14.5px;color:var(--nv)}
.guide-item p{font-size:12.5px}
.guide-meta{font-size:9.5px;color:#94a5b3}

/* how it works */
.steps{gap:16px}
.step{padding:24px}
.step span{background:var(--blue);color:var(--nv);width:32px;height:32px;border-radius:50%;
  display:grid;place-items:center;font-size:12px;padding:0;letter-spacing:0}
.step h3{font-size:16px;margin:16px 0 7px}
.step p{font-size:12.5px;line-height:1.65}

/* about */
.about-photo{height:470px;max-width:360px}
.photo-placeholder,.about-photo img{border-radius:20px}
.about-photo p{border-radius:20px;box-shadow:var(--shadow)}
.about-tags span{background:#fff;border-color:var(--edge);font-weight:700;color:var(--nv)}
.talk{background:var(--gd);border-color:var(--gd);color:#3a2a0c;border-radius:24px}

/* testimonials */
.testimonial{background:var(--mint);border-color:#cfe8dc;min-height:0;padding:22px}
.testimonial:before{color:var(--gd)}
.testimonial blockquote{font-size:13px;color:#33505f}
.testimonial cite{border-top-color:#cfe8dc;color:var(--nv-soft)}

/* faq */
.faq{margin:10px 0;padding:0 18px;border-color:var(--edge)}
.faq button{color:var(--nv);font-size:13px}
.faq.open{background:#fff;border-color:#d9e6f2}

/* contact */
.quote-form{border-color:var(--edge);border-radius:16px;box-shadow:var(--shadow)}
.quote-form input,.quote-form select,.quote-form textarea{
  border:1px solid #d6e1ec;border-radius:9px;font-size:13px}
.quote-form input:focus,.quote-form select:focus,.quote-form textarea:focus{
  border-color:var(--gd);box-shadow:0 0 0 3px #e8a33d2e}
.quote-form label{color:var(--nv)}
.quote-form .button{background:var(--gd);border-color:var(--gd);color:#3a2a0c;border-radius:24px}
.contact h2{color:var(--nv)}

/* footer */
footer{background:var(--nv);color:#c8d8e4}
footer .brand span{background:#1d5578;color:var(--gd)}
.footer-grid b{color:#fff;font-weight:700}
.copyright{color:#8fa8ba}

/* --- Strict alternating bands ------------------------------------------
   Every content section alternates pale blue / white down the page.
   Written per section rather than with nth-child so the rhythm holds even
   if the articles block is empty and does not render. */
body{background:#fff}

#services{background:var(--blue)}
#articles.tinted{background:#fff}
#how.tinted{background:var(--blue)}
main > .section:nth-of-type(6){background:#fff}   /* why choose us */
.about{background:var(--blue)}
.testimonials{background:#fff}
#faq.tinted{background:var(--blue)}
.contact{background:#fff}

/* keep text legible now that the warm cream sections are gone */
#articles.tinted,#how.tinted,#faq.tinted,.about,.contact{color:var(--muted)}
#articles.tinted .section-intro h2,#how.tinted .section-intro h2,
#faq .section-intro h2,.about h2,.contact h2{color:var(--nv)}
.guide-item{background:#fff;border-color:var(--edge)}
.about-tags span{background:#fff}

/* inner pages: articles list, guides and the calculator sit on white with
   pale-blue panels, matching the homepage rhythm */
.guide-cta{background:var(--nv)}
.calc-inputs{background:var(--blue);border:1px solid var(--edge)}
.calc-results{background:var(--nv)}

/* ========================================================================
   Palette matched to the reference design.
   ===================================================================== */
:root{
  --nv:#123c56; --nv-soft:#3a6480; --gd:#e9a13c; --gd-deep:#946010;
  --muted:#5c7183; --ink2:#22384a;
  --blue:#eaf3fb; --cream2:#fdf3e7; --mint:#e8f6ef; --peach:#fdf2e4;
  --edge:#e6edf4; --page:#fff;
}
body{background:#fff;color:var(--muted)}

/* section bands, in the order the reference uses them */
#services{background:var(--blue)}
#articles.tinted{background:#fff}
#how.tinted{background:var(--blue)}
main > .section:nth-of-type(6){background:#fff}
.about{background:var(--cream2)}
.testimonials{background:#fff}
#faq.tinted{background:var(--blue)}
.contact{background:var(--cream2)}

/* article cards are peach on the white band */
.guide-item{background:var(--peach);border-color:#f3e1c8}
.guide-item h4,.guide-item p{color:var(--nv)}
.guide-item p{color:var(--muted)}
.guide-pillar{color:var(--gd-deep);letter-spacing:.14em}

/* accents */
.eyebrow,.section-intro .eyebrow,#services .eyebrow{color:var(--gd-deep);letter-spacing:.22em;font-size:11px}
.hero h1 em{color:var(--gd)}
.button,.hero-buttons .button,.quote-form .button,.talk,.button.small{
  background:var(--gd);border-color:var(--gd);color:#3a2a0c}
.trust-row span:before{color:var(--gd)}
.testimonial:before{color:var(--gd)}
.group-title{color:var(--nv-soft)}
.faq button:after{color:var(--gd)}

/* headings and cards */
.section-intro h1,.section-intro h2,.choose h2,.about h2,.contact h2,
.service-card h4,.step h3,.faq button,.quote-form label{color:var(--nv)}
.service-card,.step,.faq,.quote-form,.testimonial{border-color:var(--edge)}
.testimonial{background:var(--mint);border-color:#d3ebe0}
.stats-grid i,.service-icon{background:#eef4fb;color:var(--nv)}
footer{background:var(--nv)}
footer .brand span{background:#1e5573;color:var(--gd)}

/* ========================================================================
   Section entrances. Each band's contents rise in as it comes into view —
   staggered so a row reads as a sequence, and gone entirely for anyone who
   asked their system for reduced motion.
   ===================================================================== */
.section-intro,.stats-grid > div,.group-title{opacity:0;transform:translateY(16px);
  transition:opacity 500ms var(--ease-out),transform 500ms var(--ease-out)}
.section-intro.visible,.stats-grid > div.visible,.group-title.visible{opacity:1;transform:none}

.reveal{transform:translateY(18px)}
.service-card.visible,.guide-item.visible,.step.visible,.testimonial.visible{transform:none}

/* cards scale up very slightly as they arrive, so they feel placed rather
   than pasted */
.service-card,.guide-item,.step,.testimonial,.reasons > div{
  transform:translateY(18px) scale(.985)}
.service-card.visible,.guide-item.visible,.step.visible,.testimonial.visible,.reasons > div.visible{
  transform:none}

/* the FAQ rows come in one after another */
.faq{opacity:0;transform:translateY(12px);
  transition:opacity 400ms var(--ease-out),transform 400ms var(--ease-out),
             grid-template-rows var(--settle) var(--ease-out)}
.faq.visible{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  .section-intro,.stats-grid > div,.group-title,.faq,
  .service-card,.guide-item,.step,.testimonial,.reasons > div{
    opacity:1;transform:none;transition:none}
}

/* Ghost step numbers, as in the reference: large, faint, behind the content. */
.step{position:relative;overflow:hidden}
.step:after{content:attr(data-step);position:absolute;top:-6px;right:12px;
  font:800 66px/1 Manrope,Arial,sans-serif;color:#123c560f;pointer-events:none;user-select:none}
.step > *{position:relative;z-index:1}