:root{--green:#254c31;--green2:#376844;--lime:#a8bf55;--gold:#d7b95e;--ink:#17231b;--muted:#6e786f;--cream:#f5f6ef;--line:#e4e8df;--brown:#3b3029;--white:#fff;--shadow:0 24px 70px rgba(22,42,27,.12)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:'DM Sans',sans-serif;background:#fff}h1,h2,h3,h4,b,strong{font-family:Manrope,sans-serif}h1,h2,h3,p{margin-top:0}a{color:inherit;text-decoration:none}.container{width:min(1180px,calc(100% - 48px));margin:auto}.topline{background:#203c28;color:#dce7d8;font-size:11px;letter-spacing:.03em}.topinner{height:35px;display:flex;align-items:center;justify-content:space-between}.topinner a{color:#fff}.header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:blur(16px);border-bottom:1px solid rgba(20,40,24,.08)}.nav{height:82px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:10px;color:var(--green)}.brandmark{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:transparent;color:#fff;font:800 22px Manrope;position:relative}
.brandmark img{width:100%;height:100%;object-fit:contain;display:block;filter:drop-shadow(0 2px 6px rgba(22,42,27,.18))}
.brandmark-lg{width:66px;height:66px}
.modal-orbit img{width:96px;height:96px;object-fit:contain;display:block;border-radius:50%;background:#fff;padding:12px;box-shadow:0 0 0 5px rgba(215,185,94,.35),0 14px 34px rgba(0,0,0,.3)}
.admin-brand .ab-logo{width:30px;height:30px;object-fit:contain;vertical-align:-7px;margin-right:2px}.brandmark span{color:var(--gold);font-size:11px;position:absolute;right:6px;top:4px}.brand b{display:block;font-size:19px;letter-spacing:-.7px}.brand small{display:block;font-size:9px;letter-spacing:3px;color:#9d853e;font-weight:700;margin-top:1px}.mainnav{display:flex;align-items:center;gap:27px;font-size:12px;font-weight:700}.mainnav a:hover{color:var(--green2)}.nav-cta{background:var(--green);color:white!important;padding:14px 20px!important;border-radius:4px}.nav-cta span{color:var(--gold);margin-left:9px}.dropdown{display:none;position:absolute;top:100%;left:-18px;min-width:205px;background:#fff;box-shadow:var(--shadow);border:1px solid var(--line);padding:10px;border-radius:8px}.dropdown a{display:block;padding:11px 12px;border-radius:5px;font-size:12px}.dropdown a:hover{background:var(--cream)}.navdrop:hover .dropdown,.navdrop:focus-within .dropdown{display:block}.service-menu{max-height:420px;overflow:auto;min-width:260px}.menu-toggle{display:none;border:0;background:none;font-size:24px}.hero{background:linear-gradient(115deg,#f4f6ef 0%,#f8f8f2 58%,#e9eee4 100%);position:relative;overflow:hidden;padding:72px 0 0}.hero-glow{position:absolute;width:600px;height:600px;border-radius:50%;background:radial-gradient(circle,rgba(169,192,86,.16),transparent 70%);right:-150px;top:-200px}.hero-grid{position:relative;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:65px;min-height:525px}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:800;color:#718345;display:inline-flex;align-items:center;gap:9px}.eyebrow i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--gold)}.hero h1{font-size:clamp(48px,5.4vw,73px);line-height:1.04;letter-spacing:-4px;margin:25px 0 22px;max-width:650px}.hero h1 em,h2 em{font-style:normal;color:var(--green2)}.hero-copy>p{font-size:16px;line-height:1.8;color:#647067;max-width:500px}.hero-actions{display:flex;gap:12px;margin-top:31px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;justify-content:center;gap:22px;border:0;border-radius:4px;padding:15px 21px;font-size:12px;font-weight:800;cursor:pointer;transition:.2s}.btn:hover{transform:translateY(-2px)}.btn-primary{background:var(--green);color:white;box-shadow:0 8px 18px rgba(37,76,49,.15)}.btn-primary span{color:var(--gold)}.btn-ghost{border:1px solid #cbd4c7;background:transparent;color:var(--green)}.btn-light{background:#fff;color:var(--green);margin-top:18px}.hero-proof{display:flex;align-items:center;gap:13px;margin-top:38px;font-size:11px;color:#788078}.hero-proof strong{color:#304235}.proof-avatars{display:flex}.proof-avatars b{width:29px;height:29px;border-radius:50%;display:grid;place-items:center;background:#dce5d3;border:2px solid #f4f6ef;margin-left:-5px;font-size:8px;color:var(--green)}.hero-visual{position:relative;max-width:480px;justify-self:end;width:100%;padding:0 22px 35px 0}.image-frame{height:485px;border-radius:180px 180px 9px 9px;overflow:hidden;position:relative;background:#dce4d9;box-shadow:var(--shadow)}.image-frame:after{content:'';position:absolute;inset:45% 0 0;background:linear-gradient(transparent,rgba(21,40,25,.18))}.image-frame img{width:100%;height:100%;object-fit:cover;object-position:center 20%}.image-tag{position:absolute;bottom:25px;left:25px;z-index:2;color:white;font-size:11px;font-weight:700}.pulse{display:inline-block;width:7px;height:7px;border-radius:50%;background:#c6db75;margin-right:7px;box-shadow:0 0 0 5px #ffffff30}.floating-card{position:absolute;bottom:70px;left:-48px;z-index:3;background:#fff;padding:17px 21px;display:flex;gap:12px;align-items:center;border-radius:6px;box-shadow:var(--shadow)}.float-icon{width:36px;height:36px;display:grid;place-items:center;background:#eff3e7;color:var(--green);font-size:22px;border-radius:50%}.floating-card b,.floating-card small{display:block}.floating-card b{font-size:12px}.floating-card small{font-size:10px;color:var(--muted);margin-top:3px}.hero-ring{position:absolute;width:110px;height:110px;border:1px solid #b6c69e;border-radius:50%;right:-25px;top:10px;z-index:-1}.hero-bottom{height:64px;border-top:1px solid #dfe5d9;display:flex;align-items:center;justify-content:space-between;font-size:9px;letter-spacing:2px;font-weight:800;color:#829078}.section{padding:100px 0}.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:100px}.section h2,.feature-band h2{font-size:clamp(34px,4vw,49px);line-height:1.13;letter-spacing:-2px;margin:18px 0}.intro-grid p{color:var(--muted);line-height:1.8;font-size:14px}.intro-grid .lead{font-size:18px;color:#3b493d}.text-link{font-size:12px;font-weight:800;color:var(--green);display:inline-block;margin-top:13px}.text-link span{color:#b39443}.services-section{background:var(--cream)}.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:35px}.section-head h2{margin-bottom:0}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.service-card{background:white;border:1px solid #e6e9e1;padding:27px;min-height:230px;position:relative;transition:.25s;display:block}.service-card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#c7d2bb}.service-icon{width:43px;height:43px;background:#edf2e6;color:var(--green);border-radius:50%;display:grid;place-items:center;font-size:20px}.service-number{position:absolute;right:25px;top:29px;color:#b6c0b1;font-size:10px;letter-spacing:1px}.service-card h3{font-size:17px;margin:22px 0 9px}.service-card p{font-size:12px;color:var(--muted);line-height:1.7;max-width:290px}.card-arrow{position:absolute;right:25px;bottom:22px;color:#9e8749}.feature-band{background:var(--green);color:#fff;padding:85px 0;position:relative;overflow:hidden}.feature-band:after{content:'K';position:absolute;right:7%;top:-170px;font:800 500px Manrope;color:#ffffff08}.feature-grid{display:grid;grid-template-columns:1fr 1fr;gap:120px;position:relative;z-index:1}.feature-band .eyebrow{color:#c8d59a}.feature-band h2{color:#fff}.feature-band h2 em{color:#c9d68e}.feature-band p{color:#d4ded3;max-width:430px;line-height:1.8;font-size:14px}.feature-points>div{display:flex;align-items:center;gap:24px;padding:20px 0;border-bottom:1px solid #ffffff25}.feature-points>b,.feature-points>div>b{font:700 12px Manrope;color:#d9c16c}.feature-points strong,.feature-points small{display:block}.feature-points strong{font:700 16px Manrope}.feature-points small{font-size:12px;color:#c4d1c3;margin-top:5px}.stats-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:30px;align-items:center}.stats-grid h2{font-size:37px}.stats-grid p{font-size:13px;color:var(--muted);line-height:1.7}.stat{border-left:1px solid var(--line);padding-left:25px}.stat strong{display:block;font:800 38px Manrope;color:var(--green)}.stat span{font-size:11px;color:var(--muted);line-height:1.5}.newsletter{padding-top:15px}.newsletter-box{background:#f1f4eb;border:1px solid #e3e9dc;padding:44px 50px;display:flex;justify-content:space-between;align-items:center;gap:40px}.newsletter-box h2{font-size:34px;margin:12px 0}.newsletter-box p{font-size:13px;color:var(--muted);margin:0}.newsletter form{display:flex;gap:8px;width:48%}.newsletter input,.contact-form input,.contact-form textarea,.modal-form input,.login-card input,.edit-form input,.edit-form textarea{border:1px solid #dce2d7;background:white;padding:14px 15px;font:12px 'DM Sans';outline:none;border-radius:3px;width:100%}.newsletter input:focus,.contact-form input:focus,.contact-form textarea:focus,.modal-form input:focus{border-color:var(--green)}.footer{background:#17271c;color:#e8eee6;padding:70px 0 0}.footergrid{display:grid;grid-template-columns:1.5fr 1fr 1.3fr 1.3fr;gap:60px;padding-bottom:55px}.brand-light{color:white}.footer .muted{font-size:12px;line-height:1.8;color:#aab8aa;max-width:270px;margin-top:22px}.footer h4{font-size:12px;margin-bottom:20px;color:#d8c477}.footergrid>div>a:not(.brand){display:block;font-size:11px;color:#b7c4b8;margin:12px 0}.footergrid p{font-size:11px;color:#b7c4b8;line-height:1.8}.socials{display:flex;gap:8px}.socials span{width:28px;height:28px;border:1px solid #536657;border-radius:50%;display:grid;place-items:center;font-size:10px}.footbottom{border-top:1px solid #ffffff20;padding:20px 0;display:flex;justify-content:space-between;font-size:10px;color:#9eac9f}.footbottom a{color:#d7dfd4}.page-hero{background:linear-gradient(110deg,#f2f5ec,#fafaf6);padding:85px 0 78px}.page-hero h1{font-size:clamp(42px,5vw,62px);letter-spacing:-3px;margin:18px 0 13px}.page-hero p{font-size:16px;color:var(--muted);max-width:680px;line-height:1.7}.page-content{min-height:400px}.split-content{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.split-content h2,.service-detail h2,.contact-grid h2{font-size:42px;letter-spacing:-2px;line-height:1.15}.split-content p,.service-detail p,.contact-grid p{font-size:14px;color:var(--muted);line-height:1.9}.content-photo{width:100%;height:390px;object-fit:cover;border-radius:5px}.values-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-top:60px}.values-grid article{background:var(--cream);padding:27px;border-top:2px solid var(--gold)}.values-grid b{font:800 12px Manrope;color:var(--green)}.values-grid p{font-size:12px;color:var(--muted);line-height:1.8;margin:13px 0 0}.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.team-card{border:1px solid var(--line);padding:15px}.team-card img,.team-placeholder{width:100%;height:210px;object-fit:cover;background:#e9eee3}.team-placeholder,.project-placeholder{display:grid;place-items:center;color:var(--green);font:800 24px Manrope}.team-card h3{font-size:15px;margin:15px 0 5px}.team-card p,.team-card small{font-size:11px;color:var(--muted)}.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.project-card{border:1px solid var(--line)}.project-card img,.project-placeholder{width:100%;height:210px;object-fit:cover;background:#edf1e8}.project-card>div:last-child{padding:22px}.project-card small{font-size:10px;color:#8b9b6c}.project-card h3{font-size:17px;margin:9px 0}.project-card p,.article-list p{font-size:12px;color:var(--muted);line-height:1.7}.article-list article{max-width:760px;border-bottom:1px solid var(--line);padding:25px 0}.article-list h2{font-size:25px;margin:12px 0}.contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:100px}.contact-detail{padding:14px 0;border-bottom:1px solid var(--line);font-size:12px;display:flex;flex-direction:column;gap:6px}.contact-detail b{color:var(--green)}.contact-detail span,.contact-detail a{color:var(--muted)}.contact-form,.login-card{display:flex;flex-direction:column;gap:10px}.contact-form label,.login-card label,.modal-form label,.edit-form label{font-size:11px;font-weight:700;margin-top:7px}.contact-form textarea{resize:vertical}.service-detail{display:grid;grid-template-columns:1.2fr .8fr;gap:90px}.service-detail aside{background:var(--cream);padding:35px}.service-detail li{font-size:12px;color:var(--muted);padding:10px 0;border-bottom:1px solid #e1e6dc}.empty-state{text-align:center;padding:70px 20px;background:var(--cream)}.flash-wrap{padding-top:12px}.flash{padding:12px 16px;margin:5px 0;font-size:12px;border-radius:4px;background:#eef4e9}.flash.error{background:#fae9e7;color:#963d32}.login-wrap{min-height:620px;background:var(--cream);display:grid;place-items:center;padding:60px 20px}.login-card{background:white;width:min(420px,100%);padding:40px;box-shadow:var(--shadow)}.login-card .brandmark{margin-bottom:25px}.login-card h1{font-size:30px;margin:12px 0 5px}.login-card p,.login-card>a{font-size:12px;color:var(--muted)}.admin-shell{display:grid;grid-template-columns:240px 1fr;min-height:850px;background:#f5f7f2}.admin-side{background:#1e3927;color:#dce7d9;padding:30px 17px;display:flex;flex-direction:column;gap:5px}.admin-brand{font:800 17px Manrope;padding:0 13px 30px}.admin-brand span{color:var(--gold)}.admin-brand small{display:block;font:700 8px 'DM Sans';letter-spacing:2px;color:#aab99f;padding-left:29px}.admin-side>a{padding:13px;border-radius:4px;font-size:12px;color:#c5d2c4}.admin-side>a:hover,.admin-side>a.active{background:#ffffff17;color:white}.admin-main{padding:45px;min-width:0}.admin-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.admin-top h1{font-size:32px;margin:10px 0 5px}.admin-top p{font-size:12px;color:var(--muted)}.admin-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:22px}.admin-stats>div,.admin-panel{background:#fff;border:1px solid var(--line);padding:22px}.admin-stats small,.admin-stats strong{display:block}.admin-stats small{font-size:10px;color:var(--muted)}.admin-stats strong{font:800 29px Manrope;color:var(--green);margin-top:8px}.admin-columns{display:grid;grid-template-columns:1fr 1fr;gap:18px}.admin-panel h2{font-size:17px;margin-bottom:18px}.admin-panel p,.admin-panel small{font-size:11px;color:var(--muted);line-height:1.7}.enquiry-row,.record-item{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid var(--line)}.enquiry-row b,.enquiry-row small,.record-item b,.record-item small{display:block}.enquiry-row b,.record-item b{font-size:12px}.enquiry-row small,.record-item small{font-size:10px;color:var(--muted);margin-top:5px;max-width:480px}.status{font-size:9px;padding:6px 9px;background:#edf3e7;color:var(--green);border-radius:20px}.security-note{margin-top:18px;background:#fbf8ec}.admin-panel input[type=file]{display:block;margin:20px 0}.admin-panel .btn{margin-top:10px}.edit-form{display:flex;flex-direction:column;gap:8px}.edit-form h2{margin-bottom:10px}.edit-form .check-label{display:flex;gap:8px;align-items:center}.edit-form .check-label input{width:auto}.record-list{max-height:700px;overflow:auto}.record-item form{margin:0}.delete-btn{border:0;background:#f9e9e7;color:#9b443a;padding:8px 10px;border-radius:3px;font-size:10px;cursor:pointer}.btn-small{padding:8px 10px;font-size:10px}.subscribe-modal{position:fixed;inset:0;background:#101b13b8;z-index:100;display:none;place-items:center;padding:20px}.subscribe-modal.show{display:grid}.modal-card{background:white;width:min(790px,100%);display:grid;grid-template-columns:1fr 1fr;position:relative;box-shadow:0 30px 100px #0005;border-radius:8px;overflow:hidden}.modal-close{position:absolute;right:15px;top:10px;z-index:2;border:0;background:#fff8;font-size:27px;cursor:pointer}.modal-art{background:var(--green);color:white;padding:55px 38px;position:relative;overflow:hidden}.modal-art:after{content:'';position:absolute;width:280px;height:280px;border:1px solid #ffffff35;border-radius:50%;right:-110px;bottom:-100px;box-shadow:0 0 0 30px #ffffff0b,0 0 0 60px #ffffff08}.modal-art .eyebrow{color:#d7dcae}.modal-art h2{font-size:39px;line-height:1.1;margin:30px 0 15px;letter-spacing:-2px}.modal-art p{font-size:12px;color:#d3ded1;line-height:1.8}.modal-brand{display:flex;align-items:center;gap:10px}.modal-brand img{width:36px;height:36px;object-fit:contain;filter:drop-shadow(0 2px 8px rgba(0,0,0,.3))}.modal-brand span{font:800 10px Manrope;letter-spacing:.14em;color:#d7dcae}.modal-orbit{display:flex;justify-content:center;margin-top:40px}.modal-orbit span{color:var(--gold)}.modal-form{padding:65px 35px 35px;display:flex;flex-direction:column;gap:13px}.modal-form small{font-size:9px;color:var(--muted);line-height:1.6}.chat-launch{position:fixed;right:24px;bottom:22px;z-index:60;background:var(--green);color:white;border:0;border-radius:30px;padding:14px 19px;box-shadow:var(--shadow);font-weight:800;cursor:pointer}.chat-launch span{font-size:11px;margin-left:6px}.chatbox{display:none;position:fixed;z-index:61;right:24px;bottom:85px;width:min(350px,calc(100vw - 30px));height:430px;background:white;box-shadow:var(--shadow);border-radius:9px;overflow:hidden;border:1px solid var(--line)}.chatbox.open{display:flex;flex-direction:column}.chathead{background:var(--green);color:white;padding:17px 20px;display:flex;justify-content:space-between}.chathead b,.chathead small{display:block}.chathead small{font-size:10px;color:#c7d4c4;margin-top:3px}.chathead button{background:none;border:0;color:white;font-size:24px;cursor:pointer}.chatmessages{padding:18px;flex:1;overflow:auto;background:#f7f8f4}.botmsg,.usermsg{max-width:88%;font-size:11px;line-height:1.6;padding:11px 13px;border-radius:8px;margin:7px 0;background:#e8eee3}.usermsg{margin-left:auto;background:var(--green);color:white}.chatbox form{display:flex;padding:12px;border-top:1px solid var(--line)}.chatbox input{flex:1;border:0;outline:0;font:12px 'DM Sans'}.chatbox form button{border:0;background:var(--green);color:white;border-radius:50%;width:30px;height:30px}
@media(max-width:1000px){.mainnav{gap:14px}.hero-grid{gap:25px}.hero h1{font-size:56px}.footergrid{gap:25px}.stats-grid{grid-template-columns:repeat(2,1fr)}.admin-stats{grid-template-columns:repeat(3,1fr)}}@media(max-width:760px){.container{width:min(100% - 32px,600px)}.topinner{justify-content:center}.topinner span:first-child{display:none}.nav{height:70px}.menu-toggle{display:block}.mainnav{display:none;position:absolute;top:70px;left:0;right:0;background:white;padding:15px 24px 25px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch;gap:4px}.mainnav.open{display:flex}.dropdown{position:static;box-shadow:none;border:0;padding-left:18px}.navdrop:hover .dropdown{display:block}.hero{padding-top:45px}.hero-grid{grid-template-columns:1fr;gap:35px}.hero h1{font-size:49px;letter-spacing:-2.8px}.hero-visual{justify-self:center;width:85%;max-width:390px}.image-frame{height:420px}.floating-card{left:-25px}.hero-bottom{font-size:8px;letter-spacing:1px}.section{padding:70px 0}.intro-grid,.feature-grid,.split-content,.contact-grid,.service-detail{grid-template-columns:1fr;gap:30px}.service-grid{grid-template-columns:1fr 1fr}.section-head{align-items:start;gap:20px;flex-direction:column}.feature-grid{gap:40px}.stats-grid{grid-template-columns:1fr 1fr}.newsletter-box{padding:30px;display:block}.newsletter form{width:100%;margin-top:25px;flex-direction:column}.footergrid{grid-template-columns:1fr 1fr;gap:30px}.team-grid{grid-template-columns:1fr 1fr}.project-grid{grid-template-columns:1fr 1fr}.values-grid{grid-template-columns:1fr}.admin-shell{grid-template-columns:1fr}.admin-side{padding:12px;display:grid;grid-template-columns:repeat(3,1fr)}.admin-brand{grid-column:1/-1;padding-bottom:10px}.admin-side>a{font-size:10px;padding:10px}.admin-main{padding:25px 16px}.admin-columns{grid-template-columns:1fr}.admin-stats{grid-template-columns:repeat(2,1fr)}.modal-card{grid-template-columns:1fr}.modal-art{padding:32px}.modal-art h2{font-size:30px;margin:15px 0}.modal-orbit{margin-top:18px}.modal-orbit img{width:62px;height:62px;padding:8px;box-shadow:0 0 0 4px rgba(215,185,94,.3)}.modal-form{padding:28px}.page-hero{padding:60px 0}.footbottom{gap:10px;flex-direction:column}.contact-grid{gap:45px}}@media(max-width:430px){.service-grid,.project-grid,.team-grid{grid-template-columns:1fr}.hero h1{font-size:43px}.hero-bottom span:nth-child(3),.hero-bottom span:nth-child(4){display:none}.footergrid{grid-template-columns:1fr}.admin-top{align-items:flex-start;gap:15px;flex-direction:column}}
/* ===== Upgraded team cards & admin image upload ===== */
.team-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:30px}
.team-card{position:relative;background:#fff;border:1px solid var(--line);border-radius:20px;padding:0 22px 26px;text-align:center;box-shadow:0 14px 40px rgba(22,42,27,.08);overflow:hidden;transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease}
.team-card::before{content:"";position:absolute;top:0;left:0;right:0;height:96px;background:linear-gradient(135deg,var(--green),var(--green2) 55%,var(--lime));border-radius:20px 20px 0 0}
.team-card:hover{transform:translateY(-8px);box-shadow:0 30px 70px rgba(22,42,27,.18);border-color:#cfd9c4}
.team-photo-frame{position:relative;z-index:1;width:168px;height:168px;margin:34px auto 18px;padding:7px;border-radius:50%;background:conic-gradient(from 200deg,var(--gold),var(--lime) 35%,var(--green2) 70%,var(--gold));box-shadow:0 18px 34px rgba(22,42,27,.22);transition:transform .4s ease}
.team-card:hover .team-photo-frame{transform:scale(1.05) rotate(2deg)}
.team-photo-frame img,.team-photo-frame .team-placeholder{width:100%;height:100%;border-radius:50%;object-fit:cover;border:5px solid #fff;background:#e9eee3}
.team-photo-frame .team-placeholder{display:grid;place-items:center;color:var(--green);font:800 34px Manrope}
.team-card h3{font-size:19px;color:var(--ink);margin:6px 0 8px}
.team-role{display:inline-block;margin:0 0 12px;padding:6px 16px;border-radius:20px;background:#edf3e7;color:var(--green);font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.team-card small{display:block;max-width:280px;margin:0 auto;font-size:12px;line-height:1.7;color:var(--muted)}
.image-upload-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:8px 0 4px}
.image-upload-row input[type=file]{flex:1;min-width:180px;margin:0;font-size:11px}
.upload-hint{font-size:11px;color:var(--muted);line-height:1.6;margin:2px 0 10px}
.image-preview img{width:110px;height:110px;border-radius:14px;object-fit:cover;border:3px solid var(--line);box-shadow:0 10px 24px rgba(22,42,27,.15);margin-bottom:6px}
@media(max-width:600px){.team-grid{grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:20px}.team-photo-frame{width:140px;height:140px;margin-top:26px}}
@media(max-width:430px){.team-grid{grid-template-columns:1fr}}
/* ===== Insights posting system ===== */
.insight-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:26px}
.insight-card{background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:0 14px 40px rgba(22,42,27,.07);display:flex;flex-direction:column;transition:transform .3s ease,box-shadow .3s ease}
.insight-card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.insight-img img{width:100%;height:215px;object-fit:cover;display:block}
.insight-body{padding:20px 24px 24px;display:flex;flex-direction:column;gap:12px;flex:1}
.insight-meta{display:flex;align-items:center;gap:14px;font-size:11px;color:var(--muted);font-weight:700}
.badge{padding:5px 13px;border-radius:20px;font-size:9px;letter-spacing:.08em;text-transform:uppercase;font-weight:800;white-space:nowrap}
.badge-green{background:#edf3e7;color:var(--green)}
.badge-gold{background:#faf3dd;color:#8b6c1f}
.insight-card h2{font-size:21px;letter-spacing:-.6px;line-height:1.25;margin:0}
.insight-card h2 a:hover{color:var(--green2)}
.insight-card p,.insight-card blockquote{font-size:13px;color:var(--muted);line-height:1.75;margin:0}
.insight-card blockquote{border-left:3px solid var(--gold);padding:4px 0 4px 16px;font-style:italic;color:#4a5648}
.insight-card footer{font-size:11px;color:var(--green)}
.insight-card .text-link{margin-top:auto}
.insight-card.testimonial{background:linear-gradient(160deg,#fbf8ec,#fff 55%)}
.insight-detail{max-width:840px}
.insight-hero-img{border-radius:18px;overflow:hidden;box-shadow:var(--shadow);margin-bottom:38px}
.insight-hero-img img{width:100%;max-height:460px;object-fit:cover;display:block}
.insight-body-text p{font-size:15.5px;line-height:2;color:#3b493d;margin:0 0 22px;letter-spacing:.005em}
.insight-body-text p:first-of-type{font-size:19px;line-height:1.75;color:var(--ink);font-weight:500;margin-bottom:28px}
.insight-body-text p:first-of-type::first-letter{font:800 52px/36px Manrope;color:var(--green);float:left;padding:8px 12px 0 0}
.insight-detail .big-quote+hr,.insight-body-text::after{content:"";display:block;width:70px;height:3px;background:linear-gradient(90deg,var(--gold),var(--lime));border-radius:3px;margin:34px auto 0}
.post-footer{display:flex;justify-content:space-between;align-items:center;gap:26px;flex-wrap:wrap;margin-top:38px;padding:24px 28px;background:linear-gradient(135deg,#f4f7f0,#fbf8ec);border:1px solid var(--line);border-radius:16px}
.author-card{display:flex;align-items:center;gap:16px}
.author-card .avatar,.author-card .avatar-photo{width:58px;height:58px;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center;font:800 20px Manrope}
.author-card .avatar-photo{object-fit:cover;padding:0;border:3px solid #fff;box-shadow:0 0 0 2px var(--gold),0 10px 22px rgba(22,42,27,.16)}
.author-card .avatar-logo{background:transparent;border:3px solid #fff;box-shadow:0 0 0 2px var(--gold),0 10px 22px rgba(22,42,27,.16)}
.author-card .avatar-logo img{width:100%;height:100%;object-fit:contain;border-radius:50%;display:block}
.author-id small{display:block;font:800 9px Manrope;letter-spacing:.16em;color:#9d853e;margin-bottom:4px}
.author-id b{display:block;font-size:16px;color:var(--ink)}
.author-id span{display:block;font-size:11px;color:var(--muted);margin-top:3px}
.share-row{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.share-row>span{font-size:10px;font-weight:800;letter-spacing:.1em;color:var(--green);text-transform:uppercase;margin-right:6px}
.share-btn{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#fff;border:1px solid var(--line);color:var(--green);transition:transform .2s ease,background .2s ease,color .2s ease,border-color .2s ease}
.share-btn svg{width:17px;height:17px;fill:currentColor}
.share-btn:hover{transform:translateY(-3px) scale(1.05);color:#fff;border-color:transparent;box-shadow:0 10px 22px rgba(22,42,27,.22)}
.share-fb:hover{background:#1877f2}.share-x:hover{background:#111}.share-li:hover{background:#0a66c2}.share-wa:hover{background:#25d366}.share-mail:hover{background:var(--green)}
@media(max-width:760px){.post-footer{flex-direction:column;align-items:flex-start;gap:20px}}
.big-quote{background:var(--cream);border-left:4px solid var(--gold);border-radius:0 14px 14px 0;padding:30px 34px;margin:0 0 8px}
.big-quote p{font-size:17px;line-height:1.9;color:#3b493d;font-style:italic;margin:0 0 14px}
.big-quote p:last-child{margin-bottom:0}
.big-quote::before{content:"\201C";display:block;font:800 64px/1 Manrope;color:var(--gold);margin-bottom:-14px}
.hero-quote{font-style:italic;color:#4a5648!important;max-width:720px!important}
.hero-quote b{font-style:normal;color:var(--green)}
.insight-actions{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:44px;padding-top:24px;border-top:1px solid var(--line)}
.edit-form select{border:1px solid #dce2d7;background:white;padding:14px 15px;font:12px 'DM Sans';outline:none;border-radius:3px;width:100%}
.edit-form select:focus{border-color:var(--green)}
@media(max-width:760px){.insight-grid{grid-template-columns:1fr}.insight-actions{flex-direction:column;align-items:flex-start}}

/* Professional project case studies */
.case-study{display:grid;grid-template-columns:1fr 300px;gap:50px;align-items:start}
.case-img{border-radius:18px;overflow:hidden;box-shadow:var(--shadow);margin-bottom:34px}
.case-img img{width:100%;max-height:480px;object-fit:cover;display:block}
.case-heading{margin:0 0 20px}
.case-tags{margin-top:26px}
.case-visit{margin-top:22px;display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 20px;box-shadow:var(--shadow)}
.case-visit span{font:800 10px Manrope;letter-spacing:.14em;text-transform:uppercase;color:#9d853e}
.case-visit a{font-weight:700;font-size:14px;color:var(--green2);word-break:break-all}
.spec-card{background:var(--cream);border:1px solid var(--line);border-radius:16px;padding:26px;position:sticky;top:100px}
.spec-card h4{margin:0 0 12px;font:800 12px Manrope;letter-spacing:.12em;color:var(--green)}
.spec-row{padding:12px 0;border-bottom:1px solid #e1e6dc}
.spec-row small{display:block;font:800 9px Manrope;letter-spacing:.14em;color:#9d853e;margin-bottom:4px}
.spec-row b{font-size:13px;color:var(--ink);font-weight:700;word-break:break-word}
.spec-row a{color:var(--green2);font-size:13px;font-weight:700}
.spec-status.ok{color:#25603c}
.spec-status.live{color:#b07c1f}
.spec-cta{margin-top:20px;display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.tag-chips{display:flex;flex-wrap:wrap;gap:7px}
.tag-chips span{font-size:9px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:5px 11px;border-radius:20px;background:#edf3e7;color:#5c7248;border:1px solid #dfe8d4}
.project-case .insight-img{position:relative;overflow:hidden}
.project-fallback{height:210px;display:grid;place-items:center;background:linear-gradient(135deg,var(--green),var(--green2));color:rgba(255,255,255,.85);font:800 13px Manrope;letter-spacing:.2em}
.case-overlay{position:absolute;left:0;right:0;bottom:0;padding:14px 20px;background:linear-gradient(transparent,rgba(37,76,49,.92));color:#fff;font:800 10px Manrope;letter-spacing:.14em;text-transform:uppercase;opacity:0;transition:.25s;pointer-events:none}
.project-case:hover .case-overlay{opacity:1}
@media(max-width:900px){.case-study{grid-template-columns:1fr}.spec-card{position:static}}
@media(max-width:600px){.post-footer{flex-direction:column}.share-row span{margin-right:0}}
.client-tag{font-weight:700}
.client-tag a{color:var(--green2);border-bottom:1px solid rgba(55,104,68,.35);padding-bottom:1px}
.client-tag a:hover{color:#9d853e;border-bottom-color:#9d853e}
.author-card .author-id span a{color:var(--green2);font-weight:700}
.author-card .author-id span a:hover{text-decoration:underline}

/* Professional services pages & labeled gallery */
.service-hero-icon{display:inline-grid;place-items:center;width:54px;height:54px;border-radius:14px;background:linear-gradient(135deg,var(--gold),var(--lime));color:var(--green);font-size:26px;vertical-align:middle;margin-right:12px;box-shadow:var(--shadow)}
.service-card{position:relative;overflow:hidden}
.service-photo{position:relative;height:170px;margin:-26px -26px 18px;overflow:hidden}
.service-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.service-card:hover .service-photo img{transform:scale(1.06)}
.service-photo .case-overlay{opacity:1;background:linear-gradient(transparent 40%,rgba(37,76,49,.85))}
.price-tag{display:inline-block;margin:4px 0 0;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#9d853e;background:#f7efd9;border:1px solid #e8dcbc;border-radius:20px;padding:5px 12px}
.feature-panel{margin-top:34px;background:linear-gradient(135deg,#f3f6ee,#faf7ec);border:1px solid var(--line);border-radius:16px;padding:28px 30px}
.feature-panel h3{margin:0 0 16px;font:800 12px Manrope;letter-spacing:.14em;color:var(--green)}
.feature-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px 26px}
.feature-list li{position:relative;padding:8px 0 8px 30px;font-size:14px;font-weight:600;color:var(--ink);border-bottom:1px dashed #dfe5d6}
.feature-list li::before{content:'✓';position:absolute;left:0;top:7px;width:20px;height:20px;border-radius:50%;background:var(--green);color:var(--lime);font:800 12px Manrope;display:grid;place-items:center}
.muted-note{color:#6c757a;font-size:14px;font-style:italic}
.service-gallery-wrap{margin-top:38px}
.gallery-heading{display:flex;align-items:center;gap:10px;font:800 12px Manrope;letter-spacing:.14em;color:var(--green);text-transform:uppercase}
.service-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px}
.gallery-item{position:relative;margin:0;border-radius:14px;overflow:hidden;box-shadow:var(--shadow);aspect-ratio:4/3;background:var(--cream)}
.gallery-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.gallery-item:hover img{transform:scale(1.05)}
.gallery-item figcaption{position:absolute;left:0;right:0;bottom:0;padding:26px 16px 12px;background:linear-gradient(transparent,rgba(37,76,49,.94));color:#fff;font:700 12px Manrope;letter-spacing:.04em}
.gallery-item figcaption::before{content:'●';color:var(--gold);margin-right:8px;font-size:9px}
@media(max-width:700px){.feature-list{grid-template-columns:1fr}.service-hero-icon{width:42px;height:42px;font-size:20px}}
.gallery-admin{padding:0 14px 14px;border-bottom:1px solid var(--line);background:#fbfcf9}
.gallery-admin details summary{cursor:pointer;font:700 12px Manrope;color:var(--green2);padding:10px 0}
.ga-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin:10px 0}
.ga-item{background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px;text-align:center;box-shadow:0 1px 3px rgba(0,0,0,.05)}
.ga-item img{width:100%;height:90px;object-fit:cover;border-radius:6px;display:block}
.ga-item span{display:block;font-size:11px;font-weight:700;color:var(--ink);margin:6px 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ga-empty{grid-column:1/-1;color:#8b948b;font-size:12px;margin:4px 0}
.ga-form{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.ga-form input[type=file]{flex:1 1 180px;font-size:11px;padding:8px;border:1px solid #dce2d7;border-radius:6px;background:#fff}
.ga-form input[name=label]{flex:1 1 200px;padding:8px 10px;font:13px 'DM Sans';border:1px solid #dce2d7;border-radius:6px}
.ga-form .btn-small{padding:8px 14px;font-size:12px}

/* Welcome banner & CEO message — About page */
.welcome-banner{position:relative;overflow:hidden;background:linear-gradient(135deg,var(--green),var(--green2) 55%,#4a7d58);border-radius:22px;padding:46px 44px;color:#fff;margin-bottom:46px;box-shadow:var(--shadow)}
.welcome-banner::before{content:'✦';position:absolute;right:-30px;top:-40px;font-size:220px;color:rgba(168,191,85,.14);line-height:1}
.welcome-banner .eyebrow{color:var(--gold)}
.welcome-banner h2{margin:10px 0 12px;color:#fff;font-size:34px}
.welcome-banner h2 em{color:var(--lime);font-style:italic}
.welcome-banner p{max-width:640px;color:rgba(255,255,255,.85);font-size:15px;line-height:1.75;margin:0}
.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:32px}
.stat{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(3px);border-radius:14px;padding:16px 10px;text-align:center}
.stat b{display:block;font:800 26px Manrope;color:var(--gold)}
.stat small{display:block;margin-top:4px;font:800 9px Manrope;letter-spacing:.14em;color:rgba(255,255,255,.75)}
.ceo-section{display:grid;grid-template-columns:250px 1fr;gap:44px;align-items:start;background:var(--cream);border:1px solid var(--line);border-radius:22px;padding:40px;margin-bottom:46px;box-shadow:var(--shadow)}
.ceo-portrait{text-align:center;position:sticky;top:100px}
.ceo-portrait img{width:200px;height:200px;object-fit:cover;border-radius:50%;border:4px solid #fff;box-shadow:0 0 0 3px var(--gold),0 14px 30px rgba(37,76,49,.22)}
.ceo-portrait .team-placeholder{width:200px;height:200px;margin:0 auto;border-radius:50%;display:grid;place-items:center;background:var(--green2);color:var(--lime);font:800 34px Manrope}
.ceo-nameplate{margin-top:16px}
.ceo-nameplate b{display:block;font:800 15px Manrope;color:var(--green)}
.ceo-nameplate span{display:block;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#9d853e;margin-top:3px}
.ceo-letter{background:#fff;border:1px solid var(--line);border-radius:18px;padding:36px 40px;box-shadow:0 10px 28px rgba(31,45,34,.07);position:relative}
.ceo-letter::before{content:'“';position:absolute;top:6px;right:26px;font:800 92px Georgia;color:#eef2e6;line-height:1}
.ceo-letter h3{margin:8px 0 18px;font-size:24px;color:var(--green);position:relative}
.ceo-letter-body{position:relative}
.ceo-letter-body p{font:15.5px/1.85 'DM Sans';color:var(--ink);margin:0 0 16px}
.ceo-letter-body p:first-of-type::first-letter{font:800 44px Playfair Display,Georgia,serif;color:var(--green2);float:left;line-height:.85;padding:5px 9px 0 0}
.ceo-sign{margin-top:24px;position:relative}
.ceo-sign .sign-line{display:block;width:130px;height:2px;background:linear-gradient(90deg,var(--gold),var(--lime));border-radius:2px;margin-bottom:12px}
.ceo-sign b{display:block;font:italic 700 22px Georgia,serif;color:var(--green)}
.ceo-sign small{display:block;font:800 10px Manrope;letter-spacing:.14em;text-transform:uppercase;color:#9d853e;margin-top:4px}
@media(max-width:900px){.ceo-section{grid-template-columns:1fr;padding:26px}.ceo-portrait{position:static}.stats-row{grid-template-columns:repeat(2,1fr)}.welcome-banner{padding:32px 24px}.welcome-banner h2{font-size:26px}}

/* Company Profile page */
.profile-hero{background:radial-gradient(circle at 85% 20%,rgba(168,191,85,.22),transparent 45%),radial-gradient(circle at 10% 90%,rgba(215,185,94,.18),transparent 40%),linear-gradient(140deg,var(--green),#1b3a25 60%,var(--green2));color:#fff;padding:84px 0 74px}
.ph-inner{display:grid;grid-template-columns:1fr 260px;gap:56px;align-items:center}
.profile-hero .eyebrow{color:var(--gold)}
.profile-hero h1{color:#fff;font-size:52px;margin:12px 0 16px}
.profile-hero h1 em{color:var(--lime);font-style:italic}
.profile-hero p{color:rgba(255,255,255,.85);max-width:560px;font-size:16px;line-height:1.75}
.ph-chips{display:flex;flex-wrap:wrap;gap:9px;margin:22px 0 26px}
.ph-chips span{font:700 11px Manrope;letter-spacing:.06em;padding:7px 14px;border-radius:30px;border:1px solid rgba(255,255,255,.3);color:#eef3e6;background:rgba(255,255,255,.06)}
.ph-actions{display:flex;gap:14px;flex-wrap:wrap}
.btn-ghost.light{border-color:rgba(255,255,255,.45);color:#fff}
.btn-ghost.light:hover{background:rgba(255,255,255,.12)}
.ph-badge{justify-self:center;width:230px;height:280px;border-radius:18px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(4px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;padding:20px}
.ph-badge img{width:110px;height:110px;object-fit:contain;display:block;filter:drop-shadow(0 10px 26px rgba(0,0,0,.45))}
.ph-badge b{display:grid;place-items:center;width:74px;height:74px;border-radius:50%;background:linear-gradient(135deg,var(--gold),var(--lime));color:var(--green);font:800 30px Manrope;box-shadow:0 0 0 4px rgba(215,185,94,.35)}
.ph-badge span{font:800 15px Manrope;letter-spacing:.18em;color:#fff;line-height:1.5}
.ph-badge small{font:700 9px Manrope;letter-spacing:.14em;color:var(--gold)}
.fact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.fact-card{background:#fff;border:1px solid var(--line);border-left:4px solid var(--gold);border-radius:14px;padding:24px;box-shadow:var(--shadow);transition:.25s}
.fact-card:hover{transform:translateY(-4px);border-left-color:var(--lime)}
.fact-card small{font:800 9px Manrope;letter-spacing:.16em;color:#9d853e}
.fact-card b{display:block;font:800 30px Manrope;color:var(--green);margin:8px 0 6px}
.fact-card p{margin:0;font-size:13px;color:#5d6a5f;line-height:1.6}
.profile-about-band{background:var(--cream);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.pa-points{display:flex;flex-direction:column;gap:16px;margin-top:26px}
.pa-points>div{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 18px;box-shadow:0 2px 8px rgba(31,45,34,.05)}
.pa-points b{color:var(--gold);font-size:20px;line-height:1.2}
.pa-points span{font-size:13.5px;color:#525c52;line-height:1.55}
.pa-points strong{color:var(--green)}
.pa-visual{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-content:center}
.pa-ring{aspect-ratio:1;border-radius:50%;background:conic-gradient(from 210deg,var(--green),var(--green2),var(--lime),var(--gold),var(--green));padding:6px;box-shadow:var(--shadow)}
.pa-in{width:100%;height:100%;border-radius:50%;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;text-align:center;padding:10px}
.pa-in b{font:800 27px Manrope;color:var(--green);line-height:1;letter-spacing:-.01em}
.pa-in small{font:800 10px Manrope;letter-spacing:.08em;color:#41502f;line-height:1.35;text-transform:uppercase}
.pa-ring.alt{transform:translateY(22px)}
.skills-band{background:linear-gradient(160deg,#16281c,var(--green) 70%);color:#fff}
.section-head.light h2{color:#fff}
.muted-light{color:rgba(255,255,255,.7);font-size:14.5px;max-width:560px;line-height:1.7}
.skills-layout{display:grid;grid-template-columns:1fr 330px;gap:44px;align-items:start;margin-top:34px}
.skill-group{margin-bottom:30px}
.skill-group h3{font:800 11px Manrope;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin:0 0 14px;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.15)}
.sb-row{display:grid;grid-template-columns:170px 1fr;gap:16px;align-items:center;margin:11px 0}
.sb-label{font:600 13px Manrope;color:#e8eee2;display:flex;align-items:center;gap:8px}
.sb-icon{width:22px;text-align:center;font-size:15px}
.sb-track{position:relative;height:14px;border-radius:10px;background:rgba(255,255,255,.1);overflow:hidden}
.sb-fill{position:relative;height:100%;width:0;border-radius:10px;background:linear-gradient(90deg,var(--green2),var(--lime) 70%,var(--gold))}
.sb-pct{position:absolute;right:8px;top:50%;transform:translateY(-50%);font:800 8.5px Manrope;color:#122016;letter-spacing:.04em}
.chart-card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:16px;padding:24px}
.chart-card h3{font:800 11px Manrope;letter-spacing:.16em;color:var(--lime);margin:0 0 20px}
.vchart{display:flex;align-items:flex-end;gap:14px;height:210px;padding-bottom:6px}
.vc-col{flex:1;display:flex;flex-direction:column;align-items:center;height:100%;justify-content:flex-end;gap:6px;min-width:0}
.vc-bar{width:100%;max-width:42px;height:0;border-radius:8px 8px 3px 3px;background:linear-gradient(180deg,var(--lime),var(--green2));position:relative;display:flex;align-items:flex-start;justify-content:center}
.vc-bar span{position:absolute;top:-20px;font:800 10px Manrope;color:var(--gold)}
.vc-col small{font:700 9px Manrope;color:rgba(255,255,255,.75);text-align:center;line-height:1.3;max-height:26px;overflow:hidden}
.vc-col em{font:700 8.5px Manrope;color:var(--lime);font-style:normal;letter-spacing:.06em}
.chart-note{margin:16px 0 0;font-size:11px;color:rgba(255,255,255,.55);line-height:1.5}
.capability-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:16px;margin-top:30px}
.cap-card{position:relative;display:flex;flex-direction:column;gap:8px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px;box-shadow:var(--shadow);transition:.22s;overflow:hidden}
.cap-card:hover{transform:translateY(-4px);border-color:var(--lime)}
.cap-icon{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;font-size:20px;background:linear-gradient(135deg,var(--cream),#e7ecdd);border:1px solid var(--line)}
.cap-card b{font:700 14px Manrope;color:var(--green)}
.cap-card small{font-size:12px;color:#5d6a5f;line-height:1.55}
.cap-arrow{position:absolute;right:16px;top:16px;color:var(--gold);font-weight:800;opacity:0;transition:.22s}
.cap-card:hover .cap-arrow{opacity:1}
.process-band{background:var(--cream);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.process-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-top:30px}
.process-steps article{background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px 18px;position:relative;box-shadow:0 2px 8px rgba(31,45,34,.05)}
.process-steps b{font:800 26px Manrope;color:#dfe6d6;display:block}
.process-steps h3{margin:6px 0 8px;font:800 14px Manrope;color:var(--green)}
.process-steps p{margin:0;font-size:12.5px;color:#5d6a5f;line-height:1.6}
.process-steps article:not(:last-child)::after{content:'→';position:absolute;right:-14px;top:50%;transform:translateY(-50%);color:var(--gold);font-weight:800;z-index:2}
.profile-cta{display:flex;align-items:center;justify-content:space-between;gap:30px;background:linear-gradient(135deg,var(--green),var(--green2));border-radius:22px;padding:44px 48px;color:#fff;box-shadow:var(--shadow)}
.profile-cta h2{color:#fff;margin:8px 0 10px}
.profile-cta h2 em{color:var(--lime);font-style:italic}
.profile-cta .eyebrow{color:var(--gold)}
.profile-cta p{color:rgba(255,255,255,.8);margin:0;font-size:14px}
@media(max-width:1000px){.skills-layout{grid-template-columns:1fr}.fact-grid{grid-template-columns:repeat(2,1fr)}.process-steps{grid-template-columns:1fr 1fr}.process-steps article::after{display:none}}
@media(max-width:760px){.ph-inner{grid-template-columns:1fr}.profile-hero h1{font-size:36px}.pa-visual{grid-template-columns:1fr 1fr}.sb-row{grid-template-columns:130px 1fr}.fact-grid{grid-template-columns:1fr}.profile-cta{flex-direction:column;text-align:center}}

/* ===== Company Profile — deep upgrade (quick-nav, leadership, mission, industries) ===== */
.profile-nav{position:sticky;top:82px;z-index:30;background:rgba(255,255,255,.97);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);box-shadow:0 6px 18px rgba(22,42,27,.05)}
.pn-inner{display:flex;align-items:center;gap:18px;overflow-x:auto;scrollbar-width:none;padding:11px 0}
.pn-inner::-webkit-scrollbar{display:none}
.pn-label{font:800 9px Manrope;letter-spacing:.16em;color:#9d853e;white-space:nowrap;flex:none}
.pn-links{display:flex;gap:7px;flex:none}
.pn-links a{font:700 12px Manrope;color:#5d6a5f;white-space:nowrap;padding:8px 15px;border-radius:30px;border:1px solid transparent;transition:.2s}
.pn-links a:hover{background:var(--cream);color:var(--green)}
.pn-links a.is-active{background:var(--green);color:#fff;box-shadow:0 6px 14px rgba(37,76,49,.22)}
.fc-ico{display:grid;place-items:center;width:46px;height:46px;border-radius:12px;font-size:22px;background:linear-gradient(135deg,var(--cream),#e7ecdd);border:1px solid var(--line);margin-bottom:14px}
.leader-band{padding-top:0}
.mv-band{background:linear-gradient(180deg,#fff,var(--cream))}
.mv-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:34px}
.mv-card{position:relative;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:18px;padding:34px 34px 32px;box-shadow:var(--shadow)}
.mv-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:5px;background:linear-gradient(180deg,var(--gold),var(--lime))}
.mv-card.alt::before{background:linear-gradient(180deg,var(--green),var(--green2))}
.mv-ico{display:grid;place-items:center;width:58px;height:58px;border-radius:15px;font-size:26px;background:linear-gradient(135deg,var(--cream),#e7ecdd);border:1px solid var(--line);margin-bottom:16px}
.mv-card h3{font:800 22px Manrope;color:var(--green);margin:0 0 12px;letter-spacing:-.5px}
.mv-card p{margin:0;font-size:14.5px;color:#525c52;line-height:1.85}
.mv-band .values-grid{grid-template-columns:repeat(4,1fr);gap:18px;margin-top:0}
.mv-band .values-grid article{background:#fff;border:1px solid var(--line);border-top:3px solid var(--gold);border-radius:14px;padding:24px;box-shadow:0 6px 18px rgba(31,45,34,.06);transition:.25s}
.mv-band .values-grid article:hover{transform:translateY(-4px);border-top-color:var(--lime);box-shadow:var(--shadow)}
.mv-band .values-grid b{display:block;font:800 14px Manrope;color:var(--green);margin-bottom:10px}
.mv-band .values-grid p{font-size:12.5px;line-height:1.7;color:#5d6a5f;margin:0}
.industries-band{background:var(--cream);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.industries-band .section-head p{margin:14px 0 0}
.industry-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:30px}
.ind-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:26px 20px;text-align:center;box-shadow:0 4px 14px rgba(31,45,34,.05);transition:.25s}
.ind-card:hover{transform:translateY(-4px);border-color:var(--lime);box-shadow:var(--shadow)}
.ind-ico{display:block;font-size:30px;margin-bottom:12px;line-height:1}
.ind-card b{font:700 14px Manrope;color:var(--green);display:block}
.ind-rule{display:block;width:34px;height:3px;border-radius:3px;background:linear-gradient(90deg,var(--gold),var(--lime));margin:12px auto 0}
.ps-ico{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;font-size:20px;background:#fff;border:1px solid var(--line);box-shadow:0 4px 12px rgba(31,45,34,.06);margin-bottom:12px}
.cta-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.profile-cta .btn-ghost.light{border-color:rgba(255,255,255,.45);color:#fff}
.cta-seal{flex:none;text-align:center}
.cta-seal img{width:104px;height:104px;object-fit:contain;border-radius:50%;background:#fff;padding:15px;box-shadow:0 0 0 4px rgba(215,185,94,.4),0 14px 30px rgba(0,0,0,.28)}
.cta-seal small{display:block;margin-top:14px;font:800 9px Manrope;letter-spacing:.14em;color:var(--gold)}
.to-top{position:fixed;left:24px;bottom:22px;z-index:55;background:var(--green);color:#fff;border:0;border-radius:30px;padding:11px 17px;font:800 11px Manrope;box-shadow:var(--shadow);opacity:.92;transition:.2s}
.to-top:hover{transform:translateY(-2px);opacity:1}
@media(max-width:1000px){.mv-grid{grid-template-columns:1fr}.mv-band .values-grid,.industry-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.profile-nav{top:70px}.pn-links a{font-size:11px;padding:7px 12px}.mv-band .values-grid,.industry-grid{grid-template-columns:1fr}.mv-card{padding:26px}.profile-cta .cta-actions{justify-content:center}.cta-seal{order:-1}}

/* ===== Careers — job postings system ===== */
.roles-count{font:800 11px Manrope;letter-spacing:.14em;color:#9d853e;text-transform:uppercase;padding-bottom:8px}
.jobs-list{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.jobs-list.other-jobs{grid-template-columns:repeat(3,1fr)}
.job-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:26px 28px;box-shadow:var(--shadow);display:flex;flex-direction:column;align-items:flex-start;gap:12px;transition:.25s;position:relative;overflow:hidden}
.job-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--gold),var(--lime));transform:scaleY(0);transition:.25s;transform-origin:top}
.job-card:hover{transform:translateY(-4px);border-color:#c7d2bb}
.job-card:hover::before{transform:scaleY(1)}
.job-top{display:flex;gap:8px;flex-wrap:wrap}
.badge-plain{background:#eef2e8;color:#41502f}
.badge-closing{background:#fdf3d7;color:#8a6d1f}
.badge-closed{background:#f9e9e7;color:#9b443a}
.job-card h3{margin:0;font:800 21px Manrope;letter-spacing:-.4px}
.job-card h3 a:hover{color:var(--green2)}
.job-meta{display:flex;flex-wrap:wrap;gap:6px 18px;font:600 12px 'DM Sans';color:var(--muted)}
.job-card p{margin:0;font-size:13.5px;color:#525c52;line-height:1.7;flex:1}
.job-apply{margin-top:4px}
.job-card.compact{padding:20px 22px}
.job-card.compact h3{font-size:16.5px}
.no-jobs{text-align:center;background:var(--cream);border:1px dashed #c7d2bb;border-radius:20px;padding:70px 30px}
.no-jobs h2{margin:10px 0 12px;font-size:32px}
.no-jobs p{max-width:460px;margin:0 auto 24px;color:var(--muted);font-size:14px;line-height:1.7}
.perks-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:30px}
.perks-grid article{background:#fff;border:1px solid var(--line);border-radius:14px;padding:24px;box-shadow:0 2px 8px rgba(31,45,34,.05);transition:.22s}
.perks-grid article:hover{transform:translateY(-4px);border-color:var(--lime)}
.perks-grid b{font-size:26px;display:block;margin-bottom:10px}
.perks-grid h3{margin:0 0 8px;font:800 15px Manrope;color:var(--green)}
.perks-grid p{margin:0;font-size:12.5px;color:#5d6a5f;line-height:1.65}
.apply-steps{grid-template-columns:repeat(3,1fr)}
.back-link{display:inline-block;font:800 11px Manrope;letter-spacing:.1em;color:#718345;margin-bottom:16px}
.back-link:hover{color:var(--green)}
.job-badges{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:14px}
.job-hero-meta{display:flex;flex-wrap:wrap;gap:8px 24px;font:600 13px 'DM Sans';color:var(--muted);margin-top:12px}
.apply-box{display:flex;align-items:center;justify-content:space-between;gap:26px;background:linear-gradient(135deg,var(--cream),#eef2e3);border:1px solid var(--line);border-radius:16px;padding:28px 32px;margin:34px 0 10px}
.apply-box h3{margin:6px 0 8px;font:800 20px Manrope;color:var(--green)}
.apply-box p{margin:0;font-size:13px;color:#5d6a5f;line-height:1.65;max-width:460px}
.feature-list.req>li::before{content:'•';background:transparent;color:var(--gold);font-size:20px;border:0;box-shadow:none}
.spec-status.closed{background:#f9e9e7;color:#9b443a}
.job-flyer{width:100%;height:200px;border-radius:12px;overflow:hidden;border:1px solid var(--line);background:#edf1e8}
.job-flyer img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block;transition:.3s}
.job-card:hover .job-flyer img{transform:scale(1.03)}
.job-card{align-items:stretch}
.job-flyer-full{margin-bottom:26px;border-radius:14px;overflow:hidden}
.job-flyer-full img{width:100%;display:block;border-radius:14px}
.apply-btns{display:flex;flex-direction:column;gap:10px;align-items:stretch}
.pdf-upload-row{display:flex;align-items:center;gap:12px;margin:6px 0}
.pdf-upload-row input[type=file]{margin:0;padding:9px;font-size:11px}
.pdf-state{font-size:11px;color:var(--muted)}
.pdf-state a{color:var(--green);font-weight:700;text-decoration:underline}

/* Contact — live office map */
.map-band{padding:20px 0 100px}
.map-band .section-head{margin-bottom:26px}
.map-band .section-head p{font-size:14px;color:var(--muted);line-height:1.7;max-width:520px;margin-top:10px}
.map-frame{position:relative;height:460px;border-radius:20px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow)}
.map-frame iframe{width:100%;height:100%;border:0;display:block}
.map-frame::after{content:'';position:absolute;inset:0;border-radius:20px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.6);pointer-events:none}
@media(max-width:760px){.map-frame{height:340px}.map-band{padding-bottom:70px}}
@media(max-width:900px){.jobs-list,.jobs-list.other-jobs,.perks-grid,.apply-steps{grid-template-columns:1fr}.apply-box{flex-direction:column;text-align:center}}

/* Company Profile — official document downloads */
.btn-gold{background:var(--gold);color:#2a2410!important;box-shadow:0 8px 18px rgba(215,185,94,.3)}
.downloads-band{background:linear-gradient(180deg,#f7f4e8,#f5f6ef);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:70px 0}
.downloads-band .section-head{margin-bottom:30px}
.downloads-band .section-head p{font-size:14px;color:var(--muted);line-height:1.7;max-width:560px;margin-top:10px}
.docs-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}
.doc-card{position:relative;background:#fff;border:1px solid var(--line);border-radius:16px;padding:34px 28px 26px;text-align:center;box-shadow:var(--shadow);transition:transform .3s ease,box-shadow .3s ease}
.doc-card:hover{transform:translateY(-5px)}
.doc-card::before{content:'';position:absolute;left:0;right:0;top:0;height:4px;border-radius:16px 16px 0 0;background:linear-gradient(90deg,var(--gold),var(--lime))}
.doc-icon{width:64px;height:64px;margin:0 auto 14px;border-radius:50%;background:#f6f1dd;display:grid;place-items:center;font-size:30px}
.doc-card b{display:block;font:800 19px Manrope;color:var(--green);letter-spacing:-.4px}
.doc-card p{font-size:12.5px;color:var(--muted);line-height:1.7;margin:10px 0 18px;min-height:44px}
.doc-card .btn{width:100%}
.doc-card small{display:block;font-size:9.5px;letter-spacing:.12em;color:#9d853e;font-weight:800;margin-top:14px}
@media(max-width:760px){.downloads-band{padding:50px 0}.ph-actions .btn-gold{margin-top:10px}}

/* ===== Solutions marketplace ===== */
.store-badge b{font-size:44px}
.store-filter{display:flex;flex-wrap:wrap;gap:10px;margin:6px 0 26px}
.sf-pill{border:1px solid var(--line);background:#fff;color:var(--muted);font:700 12.5px Manrope;padding:9px 18px;border-radius:999px;cursor:pointer;transition:.2s}
.sf-pill:hover{border-color:var(--green2);color:var(--green)}
.sf-pill.active{background:var(--green);border-color:var(--green);color:#fff}
.product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:22px}
.rel-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.product-card{background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--shadow);transition:transform .25s,box-shadow .25s}
.product-card:hover{transform:translateY(-5px);box-shadow:0 18px 40px rgba(20,40,25,.13)}
.pc-media{position:relative;height:178px;background:linear-gradient(135deg,#eef2e2,#f7f4e8);display:grid;place-items:center;overflow:hidden}
.pc-media img{width:100%;height:100%;object-fit:cover}
.pc-ph{font-size:54px;filter:drop-shadow(0 8px 16px rgba(37,76,49,.18))}
.pc-cat{position:absolute;top:12px;left:12px;background:#ffffffee;color:var(--green);font:800 9.5px Manrope;letter-spacing:.14em;text-transform:uppercase;padding:6px 11px;border-radius:999px;box-shadow:0 4px 12px rgba(0,0,0,.08)}
.pc-fmt{position:absolute;top:12px;right:12px;background:var(--green);color:#fff;font:800 10px Manrope;letter-spacing:.08em;padding:6px 10px;border-radius:8px}
.pc-body{padding:20px;display:flex;flex-direction:column;gap:10px;flex:1}
.pc-body h3{font:800 18.5px Manrope;color:var(--green);letter-spacing:-.4px}
.pc-body p{font-size:13.5px;color:var(--muted);line-height:1.65;flex:1}
.pc-meta{display:flex;align-items:baseline;gap:10px}
.pc-price{font:800 22px Manrope;color:var(--green)}
.pc-meta small{font-size:11px;color:#9d853e;font-weight:700}
.pc-cta{margin-top:4px}
.store-empty{text-align:center;padding:70px 20px;border:1.5px dashed var(--line);border-radius:20px;background:#fbfaf4}
.store-empty b{font-size:46px;display:block;margin-bottom:12px}
.store-empty h3{font:800 22px Manrope;color:var(--green)}
.store-empty p{color:var(--muted);max-width:460px;margin:10px auto 22px;line-height:1.7}
.how-band{background:linear-gradient(180deg,#20402b,#254c31);padding:80px 0;color:#fff}
.how-band .eyebrow{color:var(--gold)}
.how-band h2{color:#fff}
.how-band h2 em{color:var(--lime)}
.how-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin-top:8px}
.how-step{background:#ffffff10;border:1px solid #ffffff1f;border-radius:16px;padding:26px}
.hs-num{font:800 13px Manrope;color:var(--gold);letter-spacing:.2em;display:block;margin-bottom:12px}
.how-step b{font:800 18px Manrope;display:block;margin-bottom:10px}
.how-step p{font-size:13.5px;color:#dbe6d6;line-height:1.7}
.guarantee .g-card{display:grid;grid-template-columns:64px 1fr auto;gap:22px;align-items:center;background:linear-gradient(120deg,#f7f4e8,#eef2e2);border:1px solid var(--line);border-radius:20px;padding:30px 34px}
.g-icon{width:64px;height:64px;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:26px;box-shadow:var(--shadow)}
.g-card h3{font:800 19px Manrope;color:var(--green);margin-bottom:6px}
.g-card p{font-size:13.5px;color:var(--muted);line-height:1.7}

/* product detail */
.pd-shell{padding:36px 0 80px}
.pd-crumb{font-size:12.5px;color:var(--muted);margin-bottom:26px}
.pd-crumb a{color:var(--green2);font-weight:600;text-decoration:none}
.pd-crumb a:hover{text-decoration:underline}
.pd-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:36px;align-items:start}
.pd-media{position:relative;border-radius:20px;overflow:hidden;background:linear-gradient(135deg,#eef2e2,#f7f4e8);min-height:320px;display:grid;place-items:center;border:1px solid var(--line)}
.pd-media img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.pd-ph{font-size:84px;display:grid;place-items:center;gap:6px;color:var(--green)}
.pd-ph span{font:800 14px Manrope;letter-spacing:.3em;background:var(--green);color:#fff;padding:6px 14px;border-radius:8px}
.pd-main h1{font:800 34px Manrope;color:var(--green);letter-spacing:-1px;margin:18px 0 10px}
.pd-lead{font-size:16px;color:#41503f;line-height:1.75}
.pd-details h3,.pd-includes h3{font:800 15px Manrope;color:var(--green);letter-spacing:.06em;text-transform:uppercase;margin:28px 0 10px}
.pd-details p{font-size:14.5px;color:#41503f;line-height:1.8;margin-bottom:10px}
.pd-includes ul{list-style:none;display:grid;gap:10px;padding:0;margin:0}
.pd-includes li{background:#fff;border:1px solid var(--line);border-radius:12px;padding:13px 16px 13px 44px;font-size:14px;color:#33432f;position:relative}
.pd-includes li::before{content:'\2713';position:absolute;left:16px;color:var(--green2);font-weight:800}
.pd-trust{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.pd-trust span{background:#f1f5ea;color:var(--green);border:1px solid #dbe6cc;font-size:12.5px;font-weight:700;padding:8px 14px;border-radius:999px}
.pd-buy{position:sticky;top:90px}
.buy-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:26px;box-shadow:0 20px 50px rgba(20,40,25,.1)}
.buy-price{display:flex;align-items:baseline;gap:10px}
.buy-price b{font:800 34px Manrope;color:var(--green);letter-spacing:-1px}
.buy-price small{font-size:11.5px;color:var(--muted);font-weight:700}
.buy-fmt{margin:12px 0 18px;font-size:12.5px;color:#9d853e;font-weight:700;background:#f6f1dd;display:inline-block;padding:7px 12px;border-radius:8px}
.buy-form label{display:block;font:800 10.5px Manrope;letter-spacing:.12em;text-transform:uppercase;color:var(--green);margin:12px 0 6px}
.buy-form input{width:100%;padding:12px 14px;border:1.5px solid var(--line);border-radius:11px;font:600 14px 'DM Sans';background:#fbfbf7}
.buy-form input:focus{outline:none;border-color:var(--green2);background:#fff}
.buy-btn{width:100%;margin-top:18px}
.buy-note{display:block;margin-top:12px;font-size:11.5px;color:var(--muted);line-height:1.6}
.buy-soon{text-align:center;padding:22px 6px;color:var(--muted)}
.buy-soon b{font-size:32px;display:block;margin-bottom:8px}
.buy-soon p{font-size:13px;line-height:1.7;margin-bottom:16px}
.buy-meta{display:flex;flex-direction:column;gap:4px;margin-top:18px;border-top:1px dashed var(--line);padding-top:14px;font-size:11.5px;color:var(--muted)}
@media(max-width:960px){.pd-grid{grid-template-columns:1fr}.pd-buy{position:static}}

/* checkout */
.co-shell{padding:36px 0 90px}
.co-lock{background:#f1f5ea;border:1px solid #dbe6cc;color:var(--green);font-size:13px;font-weight:700;padding:12px 18px;border-radius:12px;margin-bottom:26px}
.co-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:34px;align-items:start}
.co-pay h1{font:800 28px Manrope;color:var(--green);letter-spacing:-.8px;margin-bottom:20px}
.pm-tabs{display:flex;gap:10px;margin-bottom:22px}
.pm-tab{flex:1;padding:13px;border-radius:12px;border:1.5px solid var(--line);background:#fff;font:800 13.5px Manrope;color:var(--muted);cursor:pointer;transition:.2s}
.pm-tab.active{border-color:var(--green);background:#f1f5ea;color:var(--green)}
.co-form{display:grid;gap:16px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px;box-shadow:var(--shadow)}
.co-field{position:relative;display:flex;flex-direction:column;gap:6px}
.co-field label{font:800 10.5px Manrope;letter-spacing:.12em;text-transform:uppercase;color:var(--green)}
.co-field input{padding:12px 14px;border:1.5px solid var(--line);border-radius:11px;font:600 15px 'DM Sans';background:#fbfbf7}
.co-field input:focus{outline:none;border-color:var(--green2);background:#fff}
.co-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.cc-brands{position:absolute;right:14px;top:41px;display:flex;gap:5px}
.cc-brands i{width:28px;height:18px;border-radius:4px;background:linear-gradient(120deg,#e6e1cf,#d7cfae);display:block}
.co-btn{width:100%}
.co-bank{background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px;box-shadow:var(--shadow)}
.co-bank h3{font:800 17px Manrope;color:var(--green);margin-bottom:16px}
.bank-steps{list-style:none;padding:0;margin:0 0 20px;display:grid;gap:14px}
.bank-steps li{display:flex;gap:14px;align-items:baseline;font-size:13.5px;color:#41503f;line-height:1.6}
.bank-steps b{background:var(--green);color:#fff;font-size:10px;letter-spacing:.1em;padding:5px 10px;border-radius:6px;white-space:nowrap;text-transform:uppercase}
.bank-acc{background:#f6f1dd;border-radius:14px;padding:20px;display:grid;gap:6px;text-align:center}
.bank-acc span{font-size:12.5px;color:var(--muted)}
.bank-acc b{font:800 17px Manrope;color:var(--green)}
.bank-acc code{font-weight:800;color:#9d853e;font-size:15px}
.bank-acc .btn{margin-top:10px;justify-self:center}
.co-cancel{display:inline-block;margin-top:20px;font-size:13px;color:var(--muted);text-decoration:none;font-weight:600}
.co-cancel:hover{color:var(--green)}
.co-summary{background:linear-gradient(180deg,#f7f4e8,#f1f2e8);border:1px solid var(--line);border-radius:18px;padding:26px;position:sticky;top:90px}
.co-summary h2{font:800 16px Manrope;color:var(--green);letter-spacing:.08em;text-transform:uppercase;margin-bottom:18px}
.sum-row{display:flex;justify-content:space-between;gap:14px;padding:10px 0;border-bottom:1px dashed var(--line);font-size:13.5px;color:#41503f}
.sum-row b{font-weight:800;color:var(--green);text-align:right}
.sum-row.muted span,.sum-row.muted b{font-weight:600;color:var(--muted);font-size:12.5px}
.sum-row.total{border-bottom:none;margin-top:6px}
.sum-row.total span{font:800 15px Manrope;color:var(--green)}
.sum-row.total b{font:800 20px Manrope;color:#9d853e}
.co-summary small{display:block;margin-top:14px;font-size:11px;color:var(--muted);line-height:1.6}
@media(max-width:960px){.co-grid{grid-template-columns:1fr}.co-summary{position:static}}

/* thank you / receipt */
.ty-shell{padding:50px 0 90px}
.ty-card{max-width:660px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:24px;padding:44px;text-align:center;box-shadow:0 24px 60px rgba(20,40,25,.12)}
.ty-check{width:74px;height:74px;margin:0 auto 18px;border-radius:50%;background:var(--green);color:#fff;font-size:34px;display:grid;place-items:center;box-shadow:0 0 0 8px #e7f0df;animation:ty-pop .5s ease}
@keyframes ty-pop{0%{transform:scale(.5);opacity:0}70%{transform:scale(1.08)}100%{transform:scale(1)}}
.ty-card h1{font:800 27px Manrope;color:var(--green);letter-spacing:-.8px;margin:8px 0 12px}
.ty-card h1 em{color:var(--green2)}
.ty-sub{font-size:14.5px;color:var(--muted);line-height:1.75}
.ty-actions{margin:26px 0}
.ty-btn{width:100%}
.ty-actions small{display:block;margin-top:12px;font-size:12px;color:var(--muted)}
.ty-actions small a{color:var(--green2);font-weight:700}
.ty-receipt{text-align:left;background:#f8f8f2;border:1px solid var(--line);border-radius:16px;padding:22px;margin:24px 0}
.ty-receipt h3{font:800 14px Manrope;color:var(--green);letter-spacing:.08em;text-transform:uppercase;margin-bottom:12px}
.tr-row{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px dashed var(--line);font-size:13px}
.tr-row:last-child{border-bottom:none}
.tr-row span{color:var(--muted)}
.tr-row b{color:var(--green);text-align:right}
.tr-paid{color:#217a3c!important;font-weight:800}
.ty-keep{font-size:12.5px;color:var(--muted);line-height:1.7}
.ty-next{display:flex;gap:12px;justify-content:center;margin-top:26px;flex-wrap:wrap}

@media(max-width:760px){.product-grid{grid-template-columns:1fr}.how-band{padding:54px 0}.guarantee .g-card{grid-template-columns:1fr;text-align:center;justify-items:center}.pd-main h1{font-size:26px}.ty-card{padding:28px 20px}}
.status-pending{background:#fdeecd;color:#9d853e!important}
.record-item form{display:inline}

/* receipt PDF + email */
.ty-two{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.ty-half{width:100%;justify-content:center;text-align:center}
.ty-mailform{display:flex;gap:0;background:#fff;border:1.5px solid var(--green);border-radius:12px;overflow:hidden;align-items:stretch}
.ty-mailform input[type=email]{flex:1;min-width:0;border:none;padding:12px 14px;font:600 13.5px 'DM Sans';background:#fff;color:var(--green)}
.ty-mailform input[type=email]:focus{outline:none;background:#fbfbf4}
.ty-mailform button{border:none;background:var(--green);color:#fff;font:800 13px Manrope;padding:12px 16px;cursor:pointer;white-space:nowrap;transition:.2s}
.ty-mailform button:hover{background:var(--green2)}
.tr-soft{color:#9d853e!important;font-weight:800}
.co-aside{margin:2px 0 0;font-size:12.5px;color:var(--muted);line-height:1.65;background:#f6f1dd;border-radius:10px;padding:12px 14px}
.co-aside b{color:var(--green)}
.rec-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
@media(max-width:760px){.ty-two{grid-template-columns:1fr}.rec-actions{width:100%;justify-content:flex-start;margin-top:8px}}

/* ===== live payment rails ===== */
.co-sub{font-size:14px;color:var(--muted);line-height:1.7;margin-bottom:20px}
.co-sub b{color:var(--green)}
.rail-list{display:grid;gap:14px}
.rail-card{display:block}
.rail-btn{width:100%;display:flex;align-items:center;gap:16px;text-align:left;background:#fff;border:1.5px solid var(--line);border-radius:16px;padding:18px 20px;cursor:pointer;font:inherit;transition:border-color .2s,box-shadow .2s,transform .2s}
.rail-btn:hover{border-color:var(--green2);box-shadow:0 14px 34px rgba(22,42,27,.12);transform:translateY(-2px)}
.rail-mark{flex:0 0 46px;height:46px;border-radius:12px;display:grid;place-items:center;font-size:21px;background:linear-gradient(135deg,#f1f5ea,#e5efdb);border:1px solid #dbe6cc}
.rail-mark.offline{background:linear-gradient(135deg,#f6f1dd,#efe6cd);border-color:#e6dcc0}
.rail-body{flex:1;min-width:0;display:grid;gap:4px}
.rail-body b{font:800 16px Manrope;color:var(--green)}
.rail-body small{font-size:12.5px;color:var(--muted);line-height:1.55}
.rail-body em{font-style:normal;font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:#9d853e;font-weight:700}
.rail-go{flex:0 0 auto;font:800 13px Manrope;color:#fff;background:var(--green);border-radius:10px;padding:11px 14px;white-space:nowrap}
.rail-btn:hover .rail-go{background:var(--gold);color:#3b3029}
.rail-none{background:#fdf6e7;border:1px solid #ecdcb6;border-radius:16px;padding:22px}
.rail-none b{display:block;font:800 15px Manrope;color:#9d853e;margin-bottom:8px}
.rail-none p{font-size:13.5px;color:#5a5240;line-height:1.7;margin:0}
.co-safe{display:grid;gap:8px;margin-top:16px;padding-top:16px;border-top:1px dashed var(--line)}
.co-safe span{font-size:12px;color:var(--muted);font-weight:600}
.buy-cur{display:grid;gap:9px;margin:2px 0 6px}
.cur-opt{display:flex;gap:10px;align-items:flex-start;border:1.5px solid var(--line);border-radius:12px;padding:11px 13px;cursor:pointer;transition:.2s;background:#fff}
.cur-opt:hover{border-color:var(--green2)}
.cur-opt input{margin-top:3px;accent-color:var(--green)}
.cur-opt input:checked~span b{color:#9d853e}
.cur-opt span{display:grid;gap:2px;font-size:12.5px;color:var(--muted)}
.cur-opt b{font:800 15px Manrope;color:var(--green)}
.cur-opt small{font-size:11px;letter-spacing:.03em}
.buy-global{margin:14px 0 0;font-size:11.5px;color:var(--muted);line-height:1.6;background:#f6f1dd;border-radius:10px;padding:10px 12px}
.pc-usd{font-size:11.5px;font-weight:700;color:#9d853e}
.pd-pending{max-width:720px}
.pd-hourglass{background:#9d853e!important;box-shadow:0 0 0 8px #f6f1dd!important;animation:pd-spin 2.6s ease-in-out infinite}
@keyframes pd-spin{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}
.pd-done{background:#217a3c!important;animation:none}
.pd-statusbar{display:flex;align-items:center;gap:10px;background:#f8f8f2;border:1px solid var(--line);border-radius:14px;padding:14px 18px;margin:20px 0;text-align:left}
.pd-statusbar b{font:800 13.5px Manrope;color:var(--green);flex:1}
.pd-statusbar small{font-size:11.5px;color:var(--muted)}
.pd-dot{width:11px;height:11px;border-radius:50%;background:#d8b84a;flex:0 0 11px;animation:pd-pulse 1.6s infinite}
.pd-dot.ok{background:#217a3c;animation:none}
@keyframes pd-pulse{0%{box-shadow:0 0 0 0 rgba(216,184,74,.5)}70%{box-shadow:0 0 0 9px rgba(216,184,74,0)}100%{box-shadow:0 0 0 0 rgba(216,184,74,0)}}
.pd-switch{margin-top:26px;text-align:left}
.pd-switch h3,.pd-bank h3{font:800 14px Manrope;color:var(--green);letter-spacing:.06em;text-transform:uppercase;margin-bottom:12px}
.pd-bank{margin-top:22px;text-align:left}
.hosted-form{display:none}
.pd-hosted .ty-next{flex-direction:column;align-items:center}
/* admin money screens */
.pay-stats div{position:relative}
.pay-sub{display:block;font-size:11px;color:var(--muted);margin-top:4px;line-height:1.5}
.pay-refund strong{color:#b3541e!important}
.pay-warn{background:#fdf0e2;border:1px solid #f2cfa8;border-radius:14px;padding:16px 18px;margin:0 0 20px;font-size:13px;color:#7a4a18;line-height:1.6}
.pay-warn b{display:block;font:800 14px Manrope;margin-bottom:5px;color:#8a4a12}
.pay-help{font-size:12.5px;color:var(--muted);line-height:1.65;margin:0 0 16px}
.pay-help code,.pay-warn code{background:#eee7d3;padding:2px 6px;border-radius:6px;font-size:11.5px;color:#7a6320}
.pay-table{width:100%;border-collapse:collapse;font-size:12.5px}
.pay-table th{text-align:left;font:800 10.5px Manrope;letter-spacing:.11em;text-transform:uppercase;color:var(--green);border-bottom:2px solid var(--line);padding:9px 8px}
.pay-table td{padding:11px 8px;border-bottom:1px dashed var(--line);vertical-align:top;color:#41503f}
.pay-table td small{display:block;font-size:11px;color:var(--muted)}
.pay-table td code{font-size:11.5px;color:#7a6320;word-break:break-all}
.pay-table tbody tr:hover{background:#f8f8f2}
.pay-table .status{display:inline-block;font:800 10px Manrope;letter-spacing:.08em;text-transform:uppercase;padding:5px 9px;border-radius:7px;background:#e7f0df;color:var(--green)}
.row-off td{opacity:.62}
.pay-ok{color:#217a3c!important;font-weight:700}
.pay-note{color:#9d853e!important;font-style:italic}
.pay-await{flex-wrap:wrap}
.pay-confirm{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:6px}
.pay-confirm input{border:1.5px solid var(--line);border-radius:9px;padding:8px 10px;font:600 12px 'DM Sans';min-width:150px}
.pay-confirm input:focus{outline:none;border-color:var(--green2)}
.pay-refund-form{display:flex;gap:8px;align-items:center;margin-top:8px}
.pay-refund-form input{border:1.5px solid var(--line);border-radius:9px;padding:7px 9px;font:600 12px 'DM Sans';min-width:160px}
.pay-refund-btn{color:#b3541e!important;border-color:#f2cfa8!important}
.pay-live{margin-bottom:22px}
.pay-live h2{font:800 16px Manrope;color:var(--green);margin-bottom:10px}
.pay-live p{font-size:13px;color:#41503f;line-height:1.7;margin:0}
.pay-links{display:flex;gap:18px;margin-top:12px!important;flex-wrap:wrap}
.pay-table.compact td,.pay-table.compact th{padding:8px 6px}
@media(max-width:900px){.rail-btn{flex-wrap:wrap}.rail-go{width:100%;text-align:center}.pay-table{font-size:11.5px}}
/* dashboard payment setup form */
.pay-form{display:grid;gap:16px}
.pay-group{border:1px solid var(--line);border-radius:14px;padding:6px 18px 18px;background:#fbfbf6;margin:0}
.pay-group legend{font:800 11.5px Manrope;letter-spacing:.08em;text-transform:uppercase;color:var(--green);padding:0 8px}
.pay-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px;margin-top:12px}
.pay-field{display:block}
.pay-field>span{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:12px;color:#41503f;margin-bottom:5px}
.pay-field>span b{font-weight:800}
.pay-field code{font-size:10.5px;color:#7a6320;background:#eee7d3;padding:2px 6px;border-radius:5px;word-break:break-all}
.pay-field input,.pay-field textarea{width:100%;border:1.5px solid var(--line);border-radius:10px;padding:10px 12px;font:600 12.5px 'DM Sans';background:#fff;color:var(--ink);box-sizing:border-box}
.pay-field textarea{font:600 12px/1.6 ui-monospace,Consolas,monospace;resize:vertical}
.pay-field input:focus,.pay-field textarea:focus{outline:none;border-color:var(--green2);box-shadow:0 0 0 3px rgba(55,104,68,.12)}
.pay-field small{display:block;font-size:11px;color:var(--muted);line-height:1.55;margin-top:5px}
.pay-env,.pay-saved{font:800 9.5px Manrope;letter-spacing:.06em;text-transform:uppercase;padding:3px 7px;border-radius:20px;background:#e9e4cf;color:#7a6320;font-style:normal}
.pay-saved{background:#e7f0df;color:#217a3c}
.pay-saved-list{margin-top:18px}
.pay-form>.btn-gold{justify-self:start}
@media(max-width:700px){.pay-fields{grid-template-columns:1fr}}

/* =============================================================================
   LEGAL DOCUMENTS (/privacy /terms /cookies) — shared document typography.
   A clause-per-clause layout: sticky clause index on the left, the document on
   the right, tables and callouts for the detail, and a print sheet at the end.
   ========================================================================== */
.doc-hero .eyebrow{color:#718345}
.doc-meta{display:flex;flex-wrap:wrap;gap:9px;list-style:none;padding:0;margin:24px 0 0}
.doc-meta li{background:#fff;border:1px solid var(--line);border-radius:6px;padding:8px 14px;display:flex;flex-direction:column;gap:3px;min-width:104px}
.doc-meta span{font:800 8.5px Manrope;letter-spacing:.14em;text-transform:uppercase;color:#9aa79a}
.doc-meta b{font:700 12.5px Manrope;color:var(--green);letter-spacing:-.2px}
.doc-section{padding-top:64px}
.doc-shell{display:grid;grid-template-columns:264px minmax(0,1fr);gap:56px;align-items:start}
/* Stretch the rail track to the full row height, otherwise the sticky index inside it
   has no room to travel and scrolls away with the page. */
.doc-rail{min-width:0;align-self:stretch}
.doc-rail-inner{position:sticky;top:104px;max-height:calc(100vh - 132px);overflow:auto;padding-right:6px}
.doc-rail h2{font:800 10px Manrope;letter-spacing:.16em;text-transform:uppercase;color:var(--green);margin:0 0 14px;padding-bottom:12px;border-bottom:2px solid var(--gold)}
.doc-toc{list-style:none;margin:0;padding:0;display:grid;gap:1px;counter-reset:toc}
.doc-toc a{display:flex;gap:10px;align-items:baseline;padding:7px 8px;border-radius:5px;font-size:11.5px;line-height:1.45;color:var(--muted);font-weight:500;transition:.18s}
.doc-toc a span{font:800 9.5px Manrope;color:#b3a06a;flex:none;letter-spacing:.04em}
.doc-toc a:hover{background:var(--cream);color:var(--green)}
.doc-toc a.is-active{background:#eef3e7;color:var(--green);font-weight:700}
.doc-toc a.is-active span{color:var(--green2)}
.doc-rail-actions{display:grid;gap:7px;margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.doc-act{border:1px solid #d9dfd2;background:#fff;border-radius:5px;padding:9px 11px;font:700 10.5px 'DM Sans';color:var(--green);cursor:pointer;text-align:left;transition:.18s}
.doc-act:hover{background:var(--green);color:#fff;border-color:var(--green)}
.doc-rail-note{font-size:10.5px;line-height:1.7;color:#93a094;margin:16px 0 0}
.doc-body{min-width:0;max-width:80ch}
.doc-lead{font-size:18px;line-height:1.75;color:var(--ink);font-weight:500;letter-spacing:-.2px;margin:0 0 30px}
.doc-body p{font-size:14.5px;line-height:1.95;color:#3b493d;margin:0 0 17px;letter-spacing:.004em}
.doc-body p a,.doc-list a,.doc-table a{text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--gold);color:var(--green);font-weight:600}
.doc-body p a:hover{background:#f4f7ef}
.doc-glance{background:var(--green);color:#eaf0e6;border-radius:14px;padding:30px 32px;margin:0 0 40px;box-shadow:var(--shadow)}
.doc-glance h2{font:800 11px Manrope;letter-spacing:.16em;text-transform:uppercase;color:#d7c588;margin:0 0 20px;display:flex;align-items:center;gap:9px}
.doc-glance ul{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.doc-glance li{padding-left:16px;border-left:2px solid rgba(215,185,94,.5)}
.doc-glance b{display:block;font:700 15px Manrope;color:#fff;letter-spacing:-.3px;margin-bottom:4px}
.doc-glance p{font-size:12.5px;line-height:1.7;color:#c3d2c1;margin:0}
.doc-sec{margin:0 0 40px;padding-bottom:6px;scroll-margin-top:110px}
.doc-sec h2{display:flex;gap:14px;align-items:flex-start;font-size:24px;line-height:1.25;letter-spacing:-.8px;color:var(--ink);margin:0 0 16px}
.doc-num{flex:none;font:800 11px/1 Manrope;letter-spacing:.02em;color:#8d7a34;background:#f3ecd6;border:1px solid #e5d8a9;border-radius:5px;padding:7px 8px;margin-top:4px}
.doc-sec>*+p:first-of-type{margin-top:0}
.doc-body h3{font:800 11px Manrope;letter-spacing:.14em;text-transform:uppercase;color:var(--green);margin:26px 0 12px}
.doc-list{list-style:none;margin:0 0 20px;padding:0;display:grid;gap:10px}
.doc-list li{position:relative;padding-left:22px;font-size:14px;line-height:1.85;color:#3b493d}
.doc-list li::before{content:'';position:absolute;left:0;top:11px;width:9px;height:2px;background:var(--gold);border-radius:2px}
.doc-callout{display:flex;gap:14px;background:linear-gradient(135deg,#f2f6ec,#faf6e9);border:1px solid #e6e4cf;border-left:3px solid var(--gold);border-radius:0 10px 10px 0;padding:18px 22px;margin:0 0 22px}
.doc-callout-mark{flex:none;font-size:16px;color:#a08a3d;line-height:1.5}
.doc-callout p{margin:0;font-size:13.5px;line-height:1.8;color:#44513f}
.doc-table-wrap{overflow-x:auto;margin:0 0 24px}
.doc-table-hint{display:none;font-size:10.5px;letter-spacing:.04em;color:#93a094;margin:0 0 7px}
.doc-table{width:100%;border-collapse:collapse;font-size:13px;min-width:520px}
.doc-table caption{text-align:left;font:800 9.5px Manrope;letter-spacing:.14em;text-transform:uppercase;color:#93a094;padding:0 0 9px}
.doc-table th{text-align:left;background:var(--green);color:#e9f0e5;font:800 11px Manrope;letter-spacing:.09em;text-transform:uppercase;padding:11px 14px;white-space:nowrap}
.doc-table th:first-child{border-radius:6px 0 0 0}
.doc-table th:last-child{border-radius:0 6px 0 0}
.doc-table td{padding:13px 14px;border-bottom:1px solid var(--line);color:#41503f;line-height:1.7;vertical-align:top}
.doc-table td strong{color:var(--green);font-weight:700}
.doc-table tbody tr:nth-child(even) td{background:#fafbf7}
.doc-table tbody tr:hover td{background:#f2f6ec}
.doc-signoff{margin-top:48px;padding-top:14px;border-top:2px solid var(--gold);display:grid;gap:22px}
.doc-contact{background:var(--cream);border:1px solid var(--line);border-radius:14px;padding:30px 32px}
.doc-contact h3{font-size:22px;letter-spacing:-.7px;color:var(--ink);margin:12px 0 10px}
.doc-contact p{font-size:13px;margin-bottom:18px}
.doc-lines{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.doc-lines a{background:#fff;border:1px solid var(--line);border-radius:8px;padding:13px 15px;display:grid;gap:4px;transition:.2s}
.doc-lines a:hover{border-color:#c9d6b7;transform:translateY(-2px);box-shadow:0 12px 28px rgba(22,42,27,.1)}
.doc-lines b{font:800 9px Manrope;letter-spacing:.13em;text-transform:uppercase;color:#a08a3d}
.doc-lines span{font-size:12px;color:var(--green);font-weight:600;word-break:break-word}
.doc-related{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.doc-rel-card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:18px 20px;display:grid;gap:6px;align-content:start;transition:.2s}
.doc-rel-card:hover{border-color:#c9d6b7;box-shadow:var(--shadow);transform:translateY(-3px)}
.doc-rel-card b{font-size:15px;color:var(--green);letter-spacing:-.3px}
.doc-rel-card small{font:700 9px Manrope;letter-spacing:.1em;text-transform:uppercase;color:#a08a3d}
.doc-rel-card span{font-size:11.5px;line-height:1.65;color:var(--muted)}
.doc-legal-note{font-size:11px;line-height:1.75;color:#93a094;background:#fafbf7;border:1px dashed #d7dfd0;border-radius:8px;padding:14px 18px;margin:0}
@media(max-width:1000px){.doc-shell{grid-template-columns:1fr;gap:28px}.doc-rail-inner{position:static;max-height:none;overflow:visible}.doc-toc{display:flex;flex-wrap:wrap;gap:4px;max-height:154px;overflow:auto;padding-right:6px}.doc-toc a{border:1px solid var(--line);padding:6px 9px}.doc-rail-actions{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.doc-lines,.doc-related{grid-template-columns:1fr}.doc-lead{font-size:16px}.doc-sec h2{font-size:20px}.doc-glance{padding:22px 20px}.doc-table-hint{display:block}}
@media print{.topline,.header,.footer,.chat-launch,.chatbox,.subscribe-modal,.doc-rail,.doc-act,.doc-callout-mark,.ck,.ck-toast,.doc-table-hint{display:none!important}.doc-hero{padding:0 0 12px;background:none}.doc-section{padding:0}.doc-shell{grid-template-columns:1fr}.doc-body{max-width:none}.doc-body p,.doc-list li{font-size:10.5pt;color:#000}.doc-glance{background:none;color:#000;border:1px solid #999;box-shadow:none}.doc-glance b,.doc-glance h2{color:#000}.doc-table th{background:#eee;color:#000}.doc-sec{page-break-inside:avoid}}

/* =============================================================================
   COOKIE CONSENT — fixed bottom band. Non-blocking: it never covers the page
   centre, and it is fully usable with JavaScript switched off (plain form).
   ========================================================================== */
.ck{position:fixed;left:0;right:0;bottom:0;z-index:105;background:#16261b;color:#e6ede4;box-shadow:0 -16px 44px rgba(11,22,15,.3);padding:16px 0}
.ck--quiet{display:none}
.ck--quiet:target,.ck--quiet:has(.ck-prefs:target),.ck.is-open{display:block}
.ck-inner{width:min(1180px,calc(100% - 48px));margin:auto;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:26px;align-items:center}
.ck-summary{display:flex;gap:16px;align-items:flex-start}
.ck-mark{flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#2a4632;color:#d7b95e;font-size:19px}
.ck-copy h2{font:800 17px Manrope;letter-spacing:-.4px;color:#fff;margin:0 0 6px}
.ck-copy p{font-size:12px;line-height:1.7;color:#bccbb9;margin:0;max-width:70ch}
.ck-copy a{color:#d9c68a;text-decoration:underline;text-underline-offset:3px;font-weight:700}
.ck-link-line{margin-top:6px!important;font-size:11px!important}
.ck-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.ck .btn{gap:10px}
.ck .btn-ghost{border:1px solid rgba(255,255,255,.32);color:#e9f0e6;background:transparent}
.ck .btn-ghost:hover{background:rgba(255,255,255,.1)}
.ck-more{font:700 11px 'DM Sans';color:#c9d68e;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.ck-prefs{display:none;margin-top:18px;border-top:1px solid rgba(255,255,255,.16);padding-top:18px;grid-column:1/-1}
.ck-prefs:target,.ck-prefs.is-open{display:block}
.ck-prefs h3{font:800 10px Manrope;letter-spacing:.15em;text-transform:uppercase;color:#d7c588;margin:0 0 12px}
.ck-list{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.ck-row{display:flex;gap:14px;align-items:flex-start;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.08);border-radius:8px;padding:13px 15px}
.ck-row-locked{background:rgba(255,255,255,.03);border-style:dashed}
.ck-check{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
.ck-row-text{flex:1;display:grid;grid-template-columns:auto 1fr;gap:0 12px;cursor:pointer;min-width:0}
.ck-row-text>b{grid-column:2;font:700 12.5px Manrope;color:#fff}
.ck-row-text>small{grid-column:2;font-size:11px;line-height:1.65;color:#b3c3b1;margin-top:3px}
.ck-switch{grid-row:span 2;align-self:center;width:42px;height:23px;border-radius:20px;background:rgba(255,255,255,.22);position:relative;transition:.2s}
.ck-switch::after{content:'';position:absolute;top:3px;left:3px;width:17px;height:17px;border-radius:50%;background:#fff;transition:.2s;box-shadow:0 1px 4px rgba(0,0,0,.3)}
.ck-check:checked+.ck-row-text .ck-switch{background:var(--lime)}
.ck-check:checked+.ck-row-text .ck-switch::after{left:22px;background:#1c3524}
.ck-check:focus-visible+.ck-row-text{outline:2px solid var(--gold);outline-offset:4px;border-radius:5px}
.ck-locked{align-self:center;width:23px;height:23px;border-radius:50%;background:rgba(168,191,85,.2);color:#c9d68e;display:grid;place-items:center;font-size:12px;flex:none}
.ck-state{font:800 8.5px Manrope;letter-spacing:.12em;text-transform:uppercase;color:#9fb28a;align-self:center;white-space:nowrap}
.ck-row-locked .ck-state{color:#d7c588}
.ck-prefs-actions{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:16px}
.ck-foot{font-size:11px;line-height:1.7;color:#a9bba7;margin:14px 0 0}
/* Confirmation lives outside the band, which hides itself the moment a choice lands */
.ck-toast{position:fixed;left:50%;transform:translateX(-50%);bottom:26px;z-index:106;max-width:min(560px,calc(100% - 40px));background:#16261b;color:#e6ede4;border:1px solid rgba(255,255,255,.18);border-left:3px solid var(--lime);box-shadow:0 22px 50px rgba(11,22,15,.35);border-radius:9px;padding:13px 18px;font-size:12px;line-height:1.6;font-weight:600;display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.ck-toast[hidden]{display:none}
.ck-toast--ok{border-left-color:#bfe07a}
.ck-reload{border:1px solid rgba(255,255,255,.34);background:transparent;color:#fff;font:800 10.5px 'DM Sans';padding:7px 12px;border-radius:4px;cursor:pointer;white-space:nowrap}
.ck-reload:hover{background:rgba(255,255,255,.12)}
/* While the band is open it floats over the page end, so leave room for the footer.
   site.js measures the real band and overrides --ck-space inline; these are the
   no-JavaScript fallbacks. */
body.has-ck{padding-bottom:var(--ck-space,210px)}
body.has-ck .chat-launch{bottom:calc(var(--ck-space,210px) + 6px)}
body.has-ck .chatbox{bottom:calc(var(--ck-space,210px) + 69px)}
@media(min-width:901px){body.has-ck{--ck-space:206px}}
@media(max-width:900px){body.has-ck{--ck-space:300px}}
@media(max-width:520px){body.has-ck{--ck-space:420px}}
.glance-mark{color:#d7b95e;font-size:12px}
.footbottom{flex-wrap:wrap;gap:8px 18px;font-size:11px}
.foot-legal,.foot-tools{display:inline-flex;gap:8px;align-items:center;flex-wrap:wrap}
.footbottom i{font-style:normal;opacity:.4}
.foot-tools a[data-ck-open]{color:#d7c588}
@media(max-width:900px){.ck-inner{grid-template-columns:1fr;gap:16px}.ck-actions{width:100%}.ck-actions .btn{flex:1;justify-content:center}}
@media(max-width:520px){.ck-summary{flex-direction:column;gap:10px}.ck-mark{width:32px;height:32px;font-size:16px}.ck-actions{flex-direction:column;align-items:stretch}.ck-more{text-align:center}}

/* Consent-gated map panel on the Contact page, plus small form notices */
.map-loaded-note{position:absolute;left:0;right:0;bottom:0;z-index:2;margin:0;padding:9px 18px;font-size:10.5px;line-height:1.6;color:var(--muted);background:rgba(255,255,255,.94);backdrop-filter:blur(6px);border-top:1px solid var(--line)}
.map-loaded-note a{text-decoration:underline;text-underline-offset:2px;color:var(--green);font-weight:700}
/* Panel left standing after a mid-page withdrawal: no frame, so no fixed embed height */
.map-stopped{height:auto;padding:44px 26px 52px;background:#f2f6ec}
.map-locked{height:auto;display:grid;place-items:center;padding:34px 26px;background:linear-gradient(135deg,#eef2e8,#f8f5ea);border:1px dashed #c6d1ba;box-shadow:none}
.map-lock-inner{max-width:540px;display:grid;gap:11px;justify-items:center;text-align:center}
.map-lock-mark{width:42px;height:42px;border-radius:50%;background:#fff;border:1px solid var(--line);display:grid;place-items:center;color:var(--green);font-size:19px}
.map-lock-inner b{font:800 17px Manrope;color:var(--ink);letter-spacing:-.4px}
.map-lock-inner p{font-size:12.5px;line-height:1.75;color:var(--muted);margin:0}
.map-consent-form{display:flex;gap:14px;align-items:center;flex-wrap:wrap;justify-content:center;background:#fff;border:1px solid var(--line);border-radius:10px;padding:15px 20px;margin-top:4px}
.map-consent-form input[type=checkbox]{width:17px;height:17px;accent-color:var(--green);margin:0}
.map-consent-form label{font-size:12px;font-weight:600;color:var(--green);cursor:pointer}
.map-lock-foot{font-size:11px;color:#93a094}
.map-lock-foot a{text-decoration:underline;text-underline-offset:2px;color:var(--green);font-weight:700}
@media(max-width:760px){.map-locked{height:auto;padding:26px 18px}}
.form-privacy{font-size:11px;line-height:1.7;color:var(--muted);border-left:2px solid var(--gold);padding-left:13px;margin:12px 0 0}
.form-privacy a{text-decoration:underline;text-underline-offset:2px;color:var(--green);font-weight:700}

/* ============ Contact page — professional redesign ============ */
.cpx{display:grid;gap:30px}
.cpx-channels{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.cpx-card{position:relative;display:flex;align-items:center;gap:16px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px 22px;box-shadow:0 14px 34px rgba(22,42,27,.06);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;overflow:hidden;color:var(--ink)}
.cpx-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(var(--green),var(--lime));opacity:0;transition:opacity .25s}
.cpx-card:hover{transform:translateY(-4px);box-shadow:0 26px 56px rgba(22,42,27,.13);border-color:#cfd9c4}
.cpx-card:hover::before{opacity:1}
.cpx-card-static{cursor:default}
.cpx-ico{flex:none;width:50px;height:50px;border-radius:14px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--green),var(--green2) 60%,var(--lime));box-shadow:0 10px 22px rgba(37,76,49,.22)}
.cpx-ico svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.cpx-cardtxt{display:flex;flex-direction:column;gap:2px;min-width:0}
.cpx-cardtxt b{font:800 14px Manrope;letter-spacing:-.2px}
.cpx-cardtxt>span{font-size:13px;color:var(--green2);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cpx-cardtxt small{font-size:11px;color:var(--muted)}
.cpx-go{margin-left:auto;color:#b39443;font-weight:800;transition:transform .25s}
.cpx-card:hover .cpx-go{transform:translate(3px,-3px)}

.cpx-main{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:26px;align-items:start}
.cpx-form-panel{background:#fff;border:1px solid var(--line);border-radius:20px;padding:36px 38px;box-shadow:0 20px 60px rgba(22,42,27,.08);position:relative;overflow:hidden}
.cpx-form-panel::after{content:"";position:absolute;right:-60px;top:-60px;width:190px;height:190px;border-radius:50%;background:radial-gradient(closest-side,rgba(168,191,85,.16),transparent);pointer-events:none}
.cpx-form-panel .eyebrow{position:relative}
.cpx-form-panel h2{font-size:32px;letter-spacing:-1.4px;line-height:1.14;margin:14px 0 10px;position:relative}
.cpx-lead{font-size:14px;color:var(--muted);line-height:1.75;max-width:540px;margin:0 0 26px;position:relative}
.cpx-form{gap:0;position:relative}
.cpx-field{display:flex;flex-direction:column;margin-bottom:16px}
.cpx-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.cpx-form label{display:flex;align-items:center;gap:8px;font:700 11px Manrope;letter-spacing:.05em;text-transform:uppercase;color:#59645b;margin:0 0 8px}
.cpx-form .req{font-size:9px;letter-spacing:.08em;color:#8b6c1f;background:#faf3dd;padding:2px 8px;border-radius:20px;text-transform:none;font-weight:700}
.cpx-form .opt{font-size:9px;letter-spacing:.06em;color:var(--muted);background:#eef1ea;padding:2px 8px;border-radius:20px;text-transform:none;font-weight:700}
.cpx-form input,.cpx-form textarea{border:1px solid #d6ddcf;background:#fbfcf9;padding:14px 15px;border-radius:11px;font:500 14px 'DM Sans';color:var(--ink);width:100%;outline:none;transition:border-color .18s,box-shadow .18s,background .18s}
.cpx-form textarea{resize:vertical;min-height:134px;line-height:1.6}
.cpx-form input::placeholder,.cpx-form textarea::placeholder{color:#a7b0a6}
.cpx-form input:hover,.cpx-form textarea:hover{border-color:#c3cdb9}
.cpx-form input:focus,.cpx-form textarea:focus{border-color:var(--green);background:#fff;box-shadow:0 0 0 4px rgba(37,76,49,.1)}
.cpx-submit{width:100%;justify-content:space-between;gap:14px;margin-top:6px;padding:16px 22px;font-size:13px;border-radius:11px}
.cpx-submit span{color:var(--gold);margin-left:0}
.cpx-form .form-privacy{margin-top:16px}

.cpx-side{display:flex;flex-direction:column;gap:16px}
.cpx-panel{background:var(--cream);border:1px solid var(--line);border-radius:16px;padding:24px 26px}
.cpx-panel h3{font-size:15px;color:var(--green);margin:0 0 14px;letter-spacing:-.2px}
.cpx-next ol{list-style:none;counter-reset:n;margin:0;padding:0;display:flex;flex-direction:column;gap:16px}
.cpx-next li{position:relative;padding-left:38px;counter-increment:n;font-size:12.5px;line-height:1.6;color:var(--muted)}
.cpx-next li b{display:block;color:var(--ink);font:700 13px Manrope;margin-bottom:2px}
.cpx-next li::before{content:counter(n);position:absolute;left:0;top:-2px;width:26px;height:26px;border-radius:50%;background:#fff;border:1px solid var(--line);color:var(--green);font:800 12px Manrope;display:grid;place-items:center}
.cpx-loc p{font-size:13px;line-height:1.7;color:var(--muted);margin:0 0 12px}
.cpx-loc b{color:var(--ink)}
.cpx-minilink{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:700;color:var(--green);margin-right:16px}
.cpx-minilink:hover{color:#8b6c1f}
.cpx-note{background:linear-gradient(135deg,var(--green),#1e3927);border:0;color:#eaf0e6}
.cpx-note b{display:block;font:800 14px Manrope;color:#fff;margin-bottom:8px}
.cpx-note p{font-size:12.5px;line-height:1.7;color:#cddac9;margin:0}

@media(max-width:940px){.cpx-main{grid-template-columns:1fr}}
@media(max-width:600px){.cpx-form-panel{padding:26px 22px}.cpx-form-panel h2{font-size:27px}.cpx-row{grid-template-columns:1fr}.cpx-channels{grid-template-columns:1fr}}
.chat-note{margin:0;padding:10px 14px;font-size:10.5px;line-height:1.6;color:var(--muted);background:#f4f7f0;border-top:1px solid var(--line)}
.chat-note a{text-decoration:underline;color:var(--green);font-weight:700}
.chat-note.is-warn{background:#fbf8ec;color:#7a6320}
.chat-note button{border:0;background:var(--green);color:#fff;font:800 10px 'DM Sans';padding:7px 11px;border-radius:4px;cursor:pointer;margin-top:7px;display:block}
.chat-note button:hover{background:var(--green2)}

/* Legal notices where personal or payment details are handed over */
.co-legal{font-size:11px;line-height:1.75;color:var(--muted);background:#fafbf7;border:1px solid var(--line);border-left:2px solid var(--gold);border-radius:0 6px 6px 0;padding:12px 14px;margin:14px 0 0}
.buy-legal,.apply-privacy{font-size:11px;line-height:1.7;color:var(--muted);border-left:2px solid var(--gold);padding-left:12px;margin:10px 0 0}
.buy-legal{max-width:420px}
.apply-privacy{font-size:11.5px;line-height:1.7;color:#7c8779;margin-top:13px;max-width:460px}
.co-legal a,.buy-legal a,.apply-privacy a{color:var(--green);font-weight:700;text-decoration:underline;text-underline-offset:2px}

/* ============ Header: utility bar, navigation, mega menus, search launcher ============ */
:root{--nav-h:86px}
.skip-link{position:fixed;left:16px;top:-70px;z-index:200;background:#fff;color:var(--green);font:800 12px Manrope;padding:13px 19px;border-radius:0 0 8px 8px;box-shadow:var(--shadow);transition:top .2s ease}
.skip-link:focus{top:0}
main:focus{outline:none}
.topline{background:#1b3223;color:#cfe0cd;font-size:11px;letter-spacing:.02em}
.topinner{height:38px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.tl-place{display:inline-flex;align-items:center;gap:9px}
.tl-dot{width:6px;height:6px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 3px rgba(168,191,85,.22)}
.tl-links{display:inline-flex;align-items:center;gap:9px}
.tl-links a{color:#fff;font-weight:600}
.tl-links a:hover{color:var(--lime)}
.tl-links i{font-style:normal;color:#5f7a63}
.header{position:sticky;top:0;z-index:90;background:rgba(255,255,255,.92);backdrop-filter:blur(18px) saturate(150%);border-bottom:1px solid rgba(20,40,24,.09);transition:box-shadow .3s ease,background .3s ease}
.header.is-stuck{background:rgba(255,255,255,.97);box-shadow:0 14px 34px rgba(18,36,22,.1)}
.nav{height:var(--nav-h);display:flex;align-items:center;justify-content:space-between;gap:26px;transition:height .28s ease}
/* give the header row a wider column than the 1200px body so the eight top-level
   items (Home, Company, Services, Shop, Projects, Insights, Notices, Careers) plus
   the search + Let's-talk tools breathe instead of colliding on a normal laptop */
.nav.container{width:min(1360px,calc(100% - 36px))}
.header.is-stuck .nav{height:68px}
.brand{display:flex;align-items:center;gap:11px;color:var(--green)}
.brandmark{width:44px;height:44px;transition:width .28s ease,height .28s ease}
.header.is-stuck .brandmark{width:36px;height:36px}
.mainnav{display:flex;align-items:center;gap:12px;font-size:12px;font-weight:700}
/* Nav labels answer the cursor. Three things happen at once, all inside the
   label's own box so nothing shifts: a lime/gold glow rises from beneath the
   word, the word inks to the brand green and lifts a hair, and a rule is drawn
   under it from the left. The page you are already on keeps its rule drawn, so
   hovering it can never look like a change of address. */
.navlink{position:relative;display:inline-flex;align-items:center;gap:7px;padding:11px 13px;border-radius:8px;color:#2b3c30;white-space:nowrap;text-transform:uppercase;letter-spacing:.04em;background:radial-gradient(78% 150% at 50% 132%,rgba(168,191,85,.36),rgba(215,185,94,.16) 52%,rgba(215,185,94,0) 76%) no-repeat 50% 100%;background-size:0 100%;transition:color .18s ease,transform .24s cubic-bezier(.22,.61,.36,1),background-size .34s cubic-bezier(.22,.61,.36,1)}
.navlink:hover,.navlink:focus-visible{color:var(--green);transform:translateY(-1px);background-size:165% 100%}
.navlink:after{content:'';position:absolute;left:13px;right:13px;bottom:4px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--gold),var(--lime));transform:scaleX(0);transform-origin:left center;transition:transform .32s cubic-bezier(.22,.61,.36,1),box-shadow .32s ease}
.navlink:hover:after,.navlink:focus-visible:after{transform:scaleX(1);box-shadow:0 3px 13px rgba(215,185,94,.5)}
.navlink.is-current{color:var(--green)}
.navlink.is-current:after{transform:scaleX(1)}
.navlink.is-current:hover:after{box-shadow:0 3px 15px rgba(168,191,85,.68)}
/* the original stylesheet sets .mainnav>a,.navdrop>a{padding:12px 0}, which outranks
   a single class, so the header block repeats its own values at that specificity */
.mainnav>a.navlink,.navdrop>a.navlink{display:inline-flex;padding:11px 13px}
.navcaret{width:9px;height:6px;opacity:.55;transition:transform .22s ease,opacity .22s ease}
.navdrop{position:static}
.navdrop.is-open .navcaret,.navdrop:hover .navcaret{transform:rotate(180deg) translateY(-1px);opacity:.95}
/* A group holds its label lit while its panel is under the cursor or open, or the
   word goes dark exactly where the reader is now looking. */
.navdrop:hover>a.navlink,.navdrop.is-open>a.navlink,.navdrop:focus-within>a.navlink{color:var(--green);transform:translateY(-1px);background-size:165% 100%}
.navdrop:hover>a.navlink:after,.navdrop.is-open>a.navlink:after,.navdrop:focus-within>a.navlink:after{transform:scaleX(1);box-shadow:0 3px 13px rgba(215,185,94,.5)}
.navdrop.is-open>a.navlink{color:var(--green)}
.megamenu{position:absolute;top:100%;left:50%;transform:translate(-50%,-12px);width:min(940px,calc(100vw - 40px));background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 34px 80px rgba(16,34,22,.19);padding:26px 28px;opacity:0;visibility:hidden;transition:opacity .2s ease,transform .26s cubic-bezier(.4,0,.2,1),visibility 0s .26s;z-index:5}
.navdrop:hover>.megamenu,.navdrop:focus-within>.megamenu,.navdrop.is-open>.megamenu{opacity:1;visibility:visible;transform:translate(-50%,0);transition-delay:0s}
.mm-cols{display:grid;grid-template-columns:1.15fr 1.15fr .85fr;gap:26px}
.mm-col h4{font:800 9.5px Manrope;letter-spacing:.16em;text-transform:uppercase;color:#8fa090;margin:0 0 10px}
.mm-col>a{display:block;padding:9px 11px;border-radius:8px;font-size:13px;font-weight:700;color:var(--ink)}
.mm-col>a span{display:block;font:500 11px 'DM Sans';color:var(--muted);margin-top:3px;line-height:1.5}
.mm-col>a:hover{background:var(--cream);color:var(--green)}
.mm-legal{background:var(--cream);border-radius:12px;padding:16px 14px}
.mm-legal>a{display:block;padding:7px 8px;font-size:12px;border-radius:6px}
.mm-cookie{display:block;width:100%;text-align:left;border:1px dashed #c9d5bf;background:none;border-radius:6px;padding:9px 8px;font:700 11px Manrope;color:var(--green);cursor:pointer;margin-top:4px}
.mm-cookie:hover{background:#fff}
.mega-services{width:min(1000px,calc(100vw - 40px))}
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}
.svc-grid a{display:flex;gap:12px;align-items:flex-start;padding:12px;border-radius:10px}
.svc-grid a:hover{background:var(--cream)}
.svc-ico{flex:none;width:34px;height:34px;border-radius:9px;background:#eef3e7;color:var(--green);display:grid;place-items:center;font-size:16px}
.svc-grid b{display:block;font:700 13px Manrope;color:var(--ink)}
.svc-grid small{display:block;font-size:11px;line-height:1.5;color:var(--muted);margin-top:3px}
.mega-foot{display:flex;align-items:center;justify-content:space-between;gap:22px;border-top:1px solid var(--line);margin-top:16px;padding-top:14px}
.mega-foot .text-link{margin:0}
.mega-note{font-size:11px;color:var(--muted)}
.mega-note a{color:var(--green);font-weight:800;text-decoration:underline;text-underline-offset:2px}
.navtools{display:flex;align-items:center;gap:12px;flex:none}
.navtools .nav-cta{flex:none;white-space:nowrap}
/* The search control carries its meaning as an icon alone: the words live in aria-label and
   the hover tooltip, so the box stays a round keyline button and never takes width away from
   the nav items it sits next to. Fixed square keeps it a true circle at every breakpoint. */
.searchbtn{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border:1px solid var(--line);background:#fff;color:#4a5a4e;border-radius:50%;transition:border-color .2s ease,color .2s ease,box-shadow .2s ease}
.searchbtn svg{width:15px;height:15px}
.searchbtn:hover{border-color:#c3d1b8;color:var(--green);box-shadow:0 8px 18px rgba(22,42,27,.09)}
.nav-cta{border-radius:8px;padding:15px 24px!important}
.nav-cta.is-current{box-shadow:0 0 0 3px rgba(215,185,94,.32)}
/* The CTA had no cursor answer of its own at all. It now takes the same lift as the
   labels beside it, deepens, and the arrow steps forward - so the row reads as one
   responsive strip instead of eight live words next to a dead button. */
.nav-cta{transition:transform .22s cubic-bezier(.22,.61,.36,1),box-shadow .22s ease,background .2s ease}
.nav-cta:hover,.nav-cta:focus-visible{transform:translateY(-1px);background:var(--green2);box-shadow:0 10px 22px rgba(22,42,27,.22)}
.nav-cta.is-current:hover,.nav-cta.is-current:focus-visible{box-shadow:0 0 0 3px rgba(215,185,94,.32),0 10px 22px rgba(22,42,27,.22)}
.nav-cta span{transition:transform .26s cubic-bezier(.22,.61,.36,1)}
.nav-cta:hover span,.nav-cta:focus-visible span{transform:translate(3px,-2px)}
.menu-toggle{display:none;width:42px;height:42px;border:1px solid var(--line);background:#fff;border-radius:9px;flex-direction:column;align-items:center;justify-content:center;gap:4px;cursor:pointer}
.menu-toggle span{display:block;width:18px;height:2px;background:var(--green);border-radius:2px;transition:transform .25s ease,opacity .18s ease}
.menu-toggle[aria-expanded=true] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.menu-toggle[aria-expanded=true] span:nth-child(2){opacity:0}
.menu-toggle[aria-expanded=true] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
/* The pinned footer of the phone sheet. It lives inside the navigation so a desktop visitor
   would see it as two stray links in the menu row — it only exists once the menu is a sheet. */
.drawer-foot{display:none}
.navprogress{height:2px;background:transparent}
.navprogress i{display:block;height:100%;background:linear-gradient(90deg,var(--gold),var(--lime));transform:scaleX(0);transform-origin:left}

/* ============ Search layer (header overlay) ============ */
.searchlayer{position:fixed;inset:0;z-index:120;background:rgba(13,25,17,.55);backdrop-filter:blur(7px);overflow:auto}
.searchlayer[hidden]{display:none}
.sl-panel{min-height:100%;padding:78px 0 40px;background:linear-gradient(180deg,rgba(255,255,255,.97),rgba(246,248,242,.98))}
.searchform{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid #cfdac6;border-radius:14px;padding:9px 9px 9px 16px;box-shadow:0 14px 38px rgba(22,42,27,.1)}
.searchform:focus-within{border-color:var(--green2);box-shadow:0 0 0 4px rgba(168,191,85,.2)}
.sl-ico{flex:none;width:20px;height:20px;color:#7d8c7f}
.searchform input[type=search]{flex:1;min-width:0;border:0;background:none;outline:none;font:600 18px 'DM Sans';color:var(--ink);padding:10px 0}
.searchform input[type=search]::-webkit-search-cancel-button{filter:grayscale(1)}
.sl-close{flex:none;border:0;background:none;font-size:26px;line-height:1;color:#8b988c;cursor:pointer;padding:0 8px}
.sl-close:hover{color:var(--green)}
.sl-suggest{margin-top:14px}
.sl-suggest[hidden]{display:none}
.sug-list{list-style:none;margin:0;padding:8px 0 0;border-top:1px solid var(--line)}
.sug{display:flex;align-items:flex-start;gap:14px;padding:11px 12px;border-radius:10px}
.sug:hover,.sug:focus-visible{background:#fff;box-shadow:0 10px 24px rgba(22,42,27,.09);outline:none}
.sug-type{flex:none;font:800 8.5px Manrope;letter-spacing:.12em;text-transform:uppercase;color:#6f8060;background:#eef3e7;border-radius:20px;padding:6px 11px;margin-top:2px}
.sug-body{min-width:0}
.sug b{display:block;font:700 13.5px Manrope;color:var(--ink)}
.sug p{margin:3px 0 0;font-size:11.5px;color:var(--muted);line-height:1.55}
.sug-empty{margin:0;padding:14px 4px;font-size:12.5px;color:var(--muted)}
.sug-all{display:inline-block;margin:10px 4px 0;font:800 11.5px Manrope;color:var(--green)}
.sug-all:hover{color:var(--green2)}
mark{background:#f3e6bd;color:#4a3d13;border-radius:2px;padding:0 2px}
.sl-help{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}
.sl-help[hidden]{display:none}
.sl-help p{margin:0;font:800 9.5px Manrope;letter-spacing:.14em;text-transform:uppercase;color:#8fa090}
.schips{display:flex;flex-wrap:wrap;gap:7px}
.schips a{font:700 11px Manrope;border:1px solid var(--line);border-radius:20px;padding:6px 13px;color:#4d5c50;background:#fff}
.schips a:hover{border-color:var(--lime);color:var(--green);background:#f7f9f2}
.sl-help .sl-hint{font:500 11px 'DM Sans';letter-spacing:0;text-transform:none;color:var(--muted)}
.sl-hint kbd{font:700 10px Manrope;border:1px solid var(--line);border-radius:3px;padding:1px 5px;background:#fafbf7;color:#6f7d71}
body.search-open{overflow:hidden}

/* ============ Page heroes: the real coding backdrop on every page ============ */
.page-hero{position:relative;isolation:isolate;overflow:hidden;background:#122019 url('../img/hero-code.jpg') center 62%/cover no-repeat;padding:98px 0 94px;border-bottom:1px solid rgba(255,255,255,.08)}
.page-hero:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(101deg,rgba(12,24,17,.96) 0%,rgba(14,29,20,.9) 44%,rgba(17,36,25,.7) 74%,rgba(20,42,28,.52) 100%),radial-gradient(720px 340px at 8% 118%,rgba(168,191,85,.18),transparent 70%)}
.page-hero .container{position:relative}
.page-hero .eyebrow,.page-hero.doc-hero .eyebrow{color:var(--gold)}
.page-hero .eyebrow i{background:var(--lime)}
.page-hero h1{color:#fff;text-shadow:0 3px 26px rgba(5,14,9,.45)}
.page-hero h1 em{color:var(--lime)}
.page-hero p{color:rgba(255,255,255,.84)}
.page-hero .insight-meta{color:rgba(255,255,255,.74)}
.page-hero .service-hero-icon{box-shadow:0 12px 28px rgba(0,0,0,.38)}
.page-hero .doc-meta li{background:rgba(255,255,255,.95);border-color:rgba(255,255,255,.42)}
.profile-hero{background-image:radial-gradient(circle at 85% 20%,rgba(168,191,85,.22),transparent 45%),radial-gradient(circle at 10% 90%,rgba(215,185,94,.18),transparent 40%),linear-gradient(140deg,rgba(37,76,49,.94),rgba(24,50,33,.92) 58%,rgba(55,104,68,.9)),url('../img/hero-code-alt.jpg');background-size:cover;background-position:center right 68%,center,center,center;background-repeat:no-repeat}

/* ============ Search results page ============ */
.sr-form{display:flex;align-items:center;gap:10px;margin-top:28px;max-width:660px;background:rgba(255,255,255,.97);border:1px solid rgba(255,255,255,.55);border-radius:13px;padding:7px 7px 7px 15px;box-shadow:0 18px 44px rgba(8,18,12,.3)}
.sr-form input[type=search]{flex:1;min-width:0;border:0;background:none;outline:none;font:600 15px 'DM Sans';color:var(--ink);padding:10px 0}
.sr-count{margin:18px 0 0;font-size:12px;color:rgba(255,255,255,.82)}
.sr-count code{background:rgba(255,255,255,.15);border-radius:3px;padding:2px 7px;font:700 11px ui-monospace,Consolas,monospace;color:#fff}
.sr-facets{display:flex;flex-wrap:wrap;gap:8px;position:relative;z-index:2;margin-top:-32px}
.sr-chip{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1px solid var(--line);border-radius:30px;padding:9px 15px;font:700 11px Manrope;color:#4d5c50;box-shadow:0 8px 20px rgba(22,42,27,.09)}
.sr-chip small{color:#8d9a8f;font-weight:800}
.sr-chip:hover{border-color:#c3d1b8;color:var(--green)}
.sr-chip.is-on{background:var(--green);border-color:var(--green);color:#fff}
.sr-chip.is-on small{color:var(--gold)}
.sr-section{padding-top:66px}
.sr-group{margin-bottom:44px}
.sr-group h2{display:flex;align-items:center;gap:12px;font:800 12px Manrope;letter-spacing:.13em;text-transform:uppercase;color:#54645a;margin:0 0 18px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.sr-group h2 small{margin-left:auto;font:700 10px 'DM Sans';letter-spacing:.04em;text-transform:none;color:#93a096}
.sr-ico{font-size:15px}
.sr-list{display:grid;gap:12px}
.sr-item{background:#fff;border:1px solid var(--line);border-radius:11px;padding:20px 22px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:0 22px;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}
.sr-item:hover{border-color:#c7d2bb;box-shadow:var(--shadow);transform:translateY(-2px)}
.sr-item h3{grid-column:1;font:800 17px Manrope;letter-spacing:-.3px;margin:0}
.sr-item h3 a:hover{color:var(--green2)}
.sr-meta{grid-column:1;margin:5px 0 0;font:700 9.5px Manrope;letter-spacing:.1em;text-transform:uppercase;color:#8d9a8f}
.sr-snip{grid-column:1;margin:9px 0 0;font-size:13px;color:var(--muted);line-height:1.7}
.sr-open{grid-row:1/4;grid-column:2;align-self:center;font:800 11px Manrope;color:var(--green);border:1px solid var(--line);border-radius:7px;padding:9px 14px;white-space:nowrap}
.sr-open span{color:#b39443}
.sr-item:hover .sr-open{border-color:var(--lime);background:#f7f9f2}
.sr-more{font-size:11px;color:var(--muted);margin:12px 0 0}
.sr-more a{color:var(--green);font-weight:800}
.sr-best{background:#fcfcf7;border:1px solid #e7dfc4;border-radius:14px;padding:22px 22px 8px;margin-bottom:40px}
.sr-best h2{border-bottom-color:#e7dfc4;color:#7a6321}
.sr-best h2 small{color:#b39443}
.sr-fallback{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;background:#fbf6e6;border:1px solid #ecdcb0;border-left:4px solid var(--gold);border-radius:10px;padding:16px 20px;margin:0 0 26px;font-size:13.5px;color:#6b5414;line-height:1.6}
.sr-fallback b{font-weight:800}
.sr-fallback code{background:rgba(107,84,20,.1);border-radius:3px;padding:1px 6px;font:700 12px ui-monospace,Consolas,monospace}
.sr-dym{font-size:15px;color:var(--ink);margin:0 0 16px;line-height:1.9}
.sr-dym--inline{margin-top:2px}
.sr-fix{display:inline-block;color:var(--green);font-weight:800;text-decoration:none;border-bottom:2px solid var(--lime);padding:0 1px}
.sr-fix:hover{background:#f2f6ea}
.sr-aside{max-width:740px}
.sr-aside h2{font:800 27px Manrope;letter-spacing:-1px;margin:0 0 10px}
.sr-aside p{font-size:14px;color:var(--muted);line-height:1.8}
.sr-aside .schips{margin-top:18px}
.sr-ask{margin-top:22px;font-size:13px}
.sr-browse{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin-top:30px}
.sr-browse a{border:1px solid var(--line);border-radius:11px;padding:18px;background:#fff}
.sr-browse b{display:block;font:800 14px Manrope;color:var(--green)}
.sr-browse small{display:block;font-size:11px;color:var(--muted);margin-top:5px;line-height:1.5}
.sr-browse a:hover{border-color:#c7d2bb;box-shadow:var(--shadow)}
.sr-foot{display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap;background:var(--cream);border:1px solid var(--line);border-radius:12px;padding:26px 30px}
.sr-foot p{margin:10px 0 0;font-size:13px;color:var(--muted);max-width:520px;line-height:1.7}
.sr-foot-actions{display:flex;gap:10px;flex-wrap:wrap}
.nf-links{display:flex;flex-wrap:wrap;gap:9px;margin-top:24px}
.nf-links a{font:700 11px Manrope;border:1px solid rgba(255,255,255,.34);border-radius:20px;padding:8px 15px;color:#eef3e6;background:rgba(255,255,255,.07)}
.nf-links a:hover{border-color:var(--lime);background:rgba(255,255,255,.13)}

/* ============ Header behaviour at narrower widths ============ */
/* Below 1440px the header keeps the compact-but-breathing row (6px between items) so the
   8 items + brand + tools still fit ~1280–1439px without the
   "Let's talk" button being clipped. Above 1440px the base styles give it real air. */
@media(max-width:1439px){.mainnav{gap:6px}.navlink{padding:11px 11px}.nav-cta{padding:14px 20px!important}}
/* Eight top-level items + a long "Digital Marketplace" label need ~1250px in a row,
   so any width under 1280px hands the menu to the slide-out drawer (which already
   carries a full-width Search + Let's-talk bar) instead of overflowing and clipping. */
@media(max-width:1279px){
:root{--nav-h:74px}
.menu-toggle{display:flex}
/* ---------- the navigation becomes a sheet, not a drop panel ----------
   The wide header's three hover panels are built to be read side by side. Flattened into
   a phone they became one 1000px scroll inside a 376px box, so below 1080px the whole
   navigation takes the room that is left under the header instead: rows keep their place,
   each panel nests under the row it belongs to with its group heading pinned while you
   read it, the descriptions that only make sense on a card are dropped, and the two things
   a thumb actually wants - search and talking to us - are nailed to the bottom.
   --sheet-h is handed over by site.js from the header's own bottom edge, because the
   contact bar above it scrolls away and the bar shrinks as you go. */
.mainnav{--pad:20px;position:absolute;top:100%;left:auto;right:0;width:min(520px,100%);height:calc(100vh - var(--sheet-h,112px));height:calc(100dvh - var(--sheet-h,112px));max-height:none;display:flex;flex-direction:column;align-items:stretch;gap:0;background:#fff;border-left:1px solid var(--line);border-bottom:0;border-radius:0 0 22px 0;box-shadow:-22px 30px 70px rgba(12,24,16,.22);padding:6px var(--pad) 0;overflow-y:auto;overscroll-behavior:block;-webkit-overflow-scrolling:touch;z-index:6}
html.has-js .mainnav{transform:translateX(16px);opacity:0;visibility:hidden;transition:transform .28s cubic-bezier(.4,0,.2,1),opacity .2s ease,visibility 0s .28s}
html.has-js .mainnav.is-open{transform:none;opacity:1;visibility:visible;transition-delay:0s}
.navlink{width:100%;justify-content:space-between;align-items:center;border-radius:0;border-bottom:1px solid var(--line);padding:15px 4px;font-size:14px;min-height:54px}
.mainnav>a.navlink,.navdrop>a.navlink{display:flex;padding:15px 4px}
.navlink:hover{background:none}
.navlink.is-current{color:var(--green);border-left:3px solid var(--gold);padding-left:11px}
.navlink.is-current:after{display:none}
.navlink.is-current:hover{background:none}
/* The cursor theatre belongs to the wide bar. In the sheet a row is a list item
   with a spine and a press reaction, so the glow and the drawn rule are put away
   - and nothing is left hanging from the group hover rules. */
.navlink:after{display:none}
.navlink,.navlink:hover,.navlink:focus-visible,
.navdrop:hover>a.navlink,.navdrop.is-open>a.navlink,.navdrop:focus-within>a.navlink{transform:none;color:#2b3c30;background:none}
.navlink.is-current,.navdrop.is-open>a.navlink{color:var(--green)}
/* A touch screen hands back no hover, so the row answers the press instead - and inside a
   cream panel the answer has to be white, or the feedback is invisible. */
.mainnav .navlink:active{background:var(--cream)}
.mainnav .mm-col>a:active,.mainnav .svc-grid a:active{background:#fff}
/* A group row and its panel read as one object: the row keeps the rule, the panel carries
   a gold spine so it is unmistakably the child of the row above it. */
.navdrop>a.navlink{border-bottom:0}
.navdrop{border-bottom:1px solid var(--line)}
.navdrop.is-open{border-bottom:0;background:var(--cream)}
.navdrop.is-open>a.navlink{border-bottom:1px solid var(--line)}
/* position:static cancels the centring the wide panels use, so their -50% shift has to be
   taken back as well - and the hover rule that carries it has to be answered here, because
   an !important on this box would out-rank the open animation and freeze it. */
.megamenu{position:static;transform:none;opacity:1;visibility:visible;transition:none;width:auto;max-width:none;box-shadow:none;border:0;border-radius:0;margin:0 calc(var(--pad) * -1);padding:4px var(--pad) 16px calc(var(--pad) + 2px);background:var(--cream);border-left:3px solid var(--gold)}
.navdrop:hover>.megamenu,.navdrop:focus-within>.megamenu,.navdrop.is-open>.megamenu{transform:none;opacity:1;visibility:visible;transition:none}
html.has-js .navdrop:not(.is-open)>.megamenu{display:none}
html.has-js .navdrop.is-open>.megamenu{animation:panelIn .3s cubic-bezier(.22,.61,.36,1) both}
@keyframes panelIn{from{opacity:0;transform:translateY(-9px)}to{opacity:1;transform:none}}
.mm-cols{grid-template-columns:1fr;gap:0}
.mm-col{padding:12px 0 2px}
/* Group headings hold their place at the top of the sheet while their own links scroll
   past, which is what makes a long menu skimmable with one thumb. */
.mm-col h4{position:sticky;top:0;z-index:1;margin:0;padding:8px 0;background:var(--cream);box-shadow:0 1px 0 #dfe4d6}
.mm-col>a{display:flex;align-items:center;min-height:48px;padding:10px 11px;border-radius:8px}
/* The one-line description each card carries is worth reading on a page and is pure noise
   in a menu: it is the difference between a services list that fits a screen and one that
   does not. The marketplace keeps its counts - those tell a buyer what is actually in stock. */
.mm-col>a span,.mega-services .svc-grid small{display:none}
/* The small print is four short labels a reader scans, not four places a thumb is aiming
   for on the way somewhere. Laid out as chips they take two rows instead of four full ones,
   which is what lets the whole Company panel live inside one screenful. Named through
   .mainnav because the phone pass further down asks for 44px rows at a lower specificity. */
.mm-legal{display:flex;flex-wrap:wrap;align-items:center;gap:7px;background:#eff3e9;padding:12px;margin-top:10px}
.mm-legal h4{width:100%;position:static;box-shadow:none;background:none;padding:0;margin:0 0 2px}
.mainnav .mm-legal>a,.mainnav .mm-cookie{min-height:40px;display:inline-flex;align-items:center;width:auto;margin:0;padding:0 13px;border:1px solid #d5decb;border-radius:22px;background:#fff;font-size:11.5px;text-align:left}
.mainnav .mm-cookie{border-style:dashed;font:700 11.5px Manrope;color:var(--green)}
/* The marketplace dropdown keeps its own width and three-column grid further down this
   file, outside every media query, so at tablet width those rules would win on source order
   alone. Naming the element as both megamenu variants lifts these above them. */
.megamenu.mega-services,.megamenu.mega-market{width:auto;max-width:none}
.mainnav .mega-market .svc-grid{grid-template-columns:1fr}
.mainnav .mega-market b{max-width:none;white-space:normal}
.svc-grid{grid-template-columns:1fr;gap:0}
.svc-grid a{align-items:center;min-height:54px;padding:11px 12px;border-radius:9px}
.svc-grid a:hover{background:#fff}
.mega-foot{flex-direction:column;align-items:flex-start;gap:10px;padding:14px 8px 0;margin-top:6px;border-top:1px solid #dfe4d6}
/* The pinned base of the sheet. The header hides its own "Let's talk" button on a phone,
   so without this the contact page would be two taps buried inside the Company menu. */
.drawer-foot{display:flex;align-items:center;gap:10px;position:sticky;bottom:0;margin:auto calc(var(--pad) * -1) 0;padding:12px var(--pad);padding-bottom:calc(12px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid var(--line);box-shadow:0 -14px 30px rgba(12,24,16,.08)}
.drawer-foot .btn{flex:1;justify-content:center}
.drawer-foot .df-search{display:inline-flex;align-items:center;gap:8px;flex:none;min-height:46px;padding:0 16px;border:1px solid var(--line);border-radius:8px;font:700 12px Manrope;color:#4a5a4e;background:#fff}
.drawer-foot .df-search svg{width:16px;height:16px}
.drawer-foot .df-search:hover{border-color:var(--lime);color:var(--green)}
body.nav-open{overflow:hidden}
body.nav-open:before{content:'';position:fixed;inset:0;z-index:70;background:rgba(12,22,15,.5)}
/* No JavaScript means no sheet: the toggle would do nothing and a hidden panel could never
   be opened. Rather than dumping all forty links into the header - which pushed the page two
   thousand pixels down - the menu stays the short list of places a visitor can actually name,
   and each group heading is a real link to its own section. On a desktop the same links still
   open on hover, because that behaviour is pure CSS.
   The legal pages, the profile and the team are all repeated in the footer of every page. */
html:not(.has-js) .menu-toggle{display:none}
html:not(.has-js) .megamenu{display:none}
html:not(.has-js) .nav{flex-wrap:wrap;height:auto;padding-top:12px;padding-bottom:8px;row-gap:2px}
html:not(.has-js) .brand{order:1}
html:not(.has-js) .navtools{order:2}
html:not(.has-js) .mainnav{order:3;flex:1 1 100%;position:static;width:100%;height:auto;max-height:none;display:block;border-left:0;border-bottom:0;border-radius:0;box-shadow:none;overflow:visible}
html:not(.has-js) .drawer-foot{position:static;padding-bottom:12px}
}
/* Phones take the whole width and slide the sheet down from under the header; the sheet is
   never wider than the thumb can reach. */
@media(max-width:640px){
.mainnav{--pad:16px;left:0;width:100%;border-left:0;border-radius:0;box-shadow:0 30px 70px rgba(12,24,16,.24)}
html.has-js .mainnav{transform:translateY(-12px)}
}
@media(max-width:760px){
.topinner{height:34px;font-size:10px;gap:12px;justify-content:center}
.tl-place{display:none}
.page-hero{padding:66px 0 62px;background-image:url('../img/hero-code-sm.jpg')}
.page-hero:before{background:linear-gradient(rgba(13,26,19,.93),rgba(15,30,21,.87)),radial-gradient(420px 240px at 18% 120%,rgba(168,191,85,.16),transparent 70%)}
.page-hero h1{font-size:clamp(31px,8.4vw,44px);letter-spacing:-1.5px;margin:14px 0 12px}
.page-hero p{font-size:14px}
.profile-hero{background-position:center right,center,center,center right 60%}
.navtools .nav-cta{display:none}
.sr-form{flex-wrap:wrap;padding:8px}
.sr-form input[type=search]{flex:1 1 100%;order:1}
.sr-form .btn{order:2;flex:1}
.sr-form .sl-ico{order:3}
.sr-facets{margin-top:-24px;padding:0 4px}
.sr-item{grid-template-columns:1fr;padding:18px}
.sr-open{grid-row:auto;grid-column:1;justify-self:start;margin-top:14px}
.sr-foot{padding:20px}
.sl-panel{padding:24px 0 30px}
.searchform{padding:7px 7px 7px 12px}
.searchform input[type=search]{font-size:16px}
.searchform .btn{padding:13px 15px}
.sl-help{gap:9px}
.sug p{font-size:11px}
}
@media(prefers-reduced-motion:reduce){.nav,.brandmark,.megamenu,.mainnav,.menu-toggle span,.searchbtn,.sr-item,.skip-link,.navlink,.navlink:after,.navcaret,.nav-cta,.nav-cta span{transition:none!important}.navlink:hover,.navlink:focus-visible,.navdrop:hover>a.navlink,.navdrop.is-open>a.navlink,.navdrop:focus-within>a.navlink,.nav-cta:hover,.nav-cta:hover span{transform:none}.navdrop:hover .navcaret,.navdrop.is-open .navcaret{transform:rotate(180deg)}html.has-js .navdrop.is-open>.megamenu{animation:none}}
@media print{.topline,.header,.searchlayer,.skip-link,.navprogress,.sr-facets,.sr-open,.sr-form,.mm-cookie{display:none!important}.page-hero,.profile-hero{background:#fff!important;color:#17231b!important;padding:18px 0;border:0}.page-hero:before{display:none}.page-hero h1,.profile-hero h1{color:#17231b!important;text-shadow:none}.page-hero h1 em,.profile-hero h1 em{color:#254c31!important}.page-hero p,.profile-hero p{color:#42503f!important}.page-hero .eyebrow,.profile-hero .eyebrow{color:#6f8060!important}.page-hero .doc-meta li{background:#fff!important;border:1px solid #dfe4da!important}}

/* ============ Service pictures: photo tiles and monogram tiles ============ */
/* One upload now feeds four surfaces — header menu tile, card badge, card photo
   strip and service page hero. The tile is the same box the icon used to occupy,
   so nothing shifts when a service gains a picture. */
.svc-ico.is-photo,.cap-icon.is-photo,.service-icon.is-photo,.service-hero-icon.is-photo{padding:0;overflow:hidden;background:#e7ecdd}
.svc-ico.is-photo img,.cap-icon.is-photo img,.service-icon.is-photo img,.service-hero-icon.is-photo img{width:100%;height:100%;object-fit:cover;display:block}
.svc-ico.is-photo{box-shadow:0 0 0 1px #dbe4d1,0 3px 9px rgba(22,42,27,.14)}
.svc-ico.is-photo img{transition:transform .35s ease}
.svc-grid a:hover .svc-ico.is-photo img{transform:scale(1.08)}
.cap-icon.is-photo{box-shadow:0 0 0 1px var(--line),0 6px 14px rgba(22,42,27,.1)}
.service-icon.is-photo{border-radius:14px}
.service-hero-icon.is-photo{border:2px solid rgba(255,255,255,.9);border-radius:16px}
/* No picture yet: initials read as a designed badge instead of a placeholder star. */
.svc-ico.is-mono,.cap-icon.is-mono,.service-icon.is-mono{font:800 12px/1 Manrope;letter-spacing:.01em;color:#4e6350;background:linear-gradient(150deg,#f1f5ea,#e2ead6)}
.svc-ico.is-mono{width:34px;height:34px}
.cap-icon.is-mono,.service-icon.is-mono{font-size:14px}
.service-hero-icon.is-mono{font:800 19px/1 Manrope;letter-spacing:.02em;color:#1f3d27}
/* A card that leads with a photo needs the strip flush to its edges (the card
   padding is 27px) and the number moved onto the picture where it stays legible. */
.service-photo{margin:-27px -27px 18px}
.service-card:has(.service-photo) .service-number{top:16px;right:16px;color:#fff;background:rgba(17,36,23,.58);border:1px solid rgba(255,255,255,.22);border-radius:20px;padding:5px 11px;letter-spacing:.14em;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}
.service-card:has(.service-photo) .service-icon{margin-top:4px}

/* ============ Phone: roomy targets, safe edges, calm page changes ============ */
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--nav-h,82px) + 18px)}
body{overflow-wrap:break-word}
img,video,iframe,table{max-width:100%}
a,button,input,select,textarea,.schips a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
/* Each navigation paints as one calm fade instead of a hard swap; opacity only,
   so no fixed or sticky element inside main loses its reference frame. */
main{animation:pageIn .3s ease-out both}
@keyframes pageIn{from{opacity:0}to{opacity:1}}
@keyframes riseIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.page-hero .container,.profile-hero .container{animation:riseIn .5s .05s cubic-bezier(.22,.61,.36,1) both}
/* Notched screens: viewport-fit=cover only pays off if the chrome is pushed into
   the insets, otherwise the drawer, chat button and cookie sheet sit on the
   home-indicator strip. Every env() below resolves to 0px where there is no notch. */
.container{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
.mega-note a{display:inline-block;padding:9px 4px;margin:-9px -4px;border-radius:4px}
.chat-launch{bottom:calc(22px + env(safe-area-inset-bottom))}
.chatbox{bottom:calc(85px + env(safe-area-inset-bottom))}
.ck{padding-bottom:env(safe-area-inset-bottom)}
.ck-toast{bottom:calc(26px + env(safe-area-inset-bottom))}
.footbottom{padding-bottom:calc(20px + env(safe-area-inset-bottom))}
@media(max-width:760px){
.nav{height:var(--nav-h,74px)}
/* The sheet already owns the room under the header through --sheet-h, so it must not be
capped twice over; the base padding belongs to the pinned footer, not to the scroll box. */
.mainnav{max-height:none;padding-bottom:0}
/* Safari zooms the whole page when a focused field is under 16px and never
   zooms back out — the usual reason a form feels broken on a phone. */
input,select,textarea{font-size:16px}
.contact-form input,.contact-form textarea,.modal-form input,.login-card input,.edit-form input,.edit-form textarea,.newsletter input,.chatbox input{font-size:16px}
/* The results box sets its own font with a shorthand, so it needs naming directly —
   at 15px Safari would zoom the whole page the moment the field is focused. */
.sr-form input[type=search]{font-size:16px;min-height:46px;padding:11px 0}
.btn{min-height:46px}
.searchbtn{width:44px;height:44px}
.sr-facets a{display:inline-flex;align-items:center;min-height:42px;padding-inline:16px}
.sr-open{display:inline-flex;align-items:center;min-height:40px}
/* Equal padding and negative margin net to zero, so the row keeps its exact height
   while the email, phone and address links become something a thumb can hit. */
.contact-detail a{display:block;padding:10px 0;margin:-10px 0;border-radius:4px}
.text-link{display:inline-flex;align-items:center;min-height:44px}
.mm-legal>a,.mm-cookie{min-height:44px;display:flex;align-items:center}
.svc-grid a{min-height:54px}
.schips a{display:inline-flex;align-items:center;min-height:40px}
.footergrid>div>a:not(.brand),.footbottom a{padding:9px 0;margin:3px 0;display:inline-block}
.footergrid>div>a:not(.brand){padding:14px 0;margin:2px 0}
.footbottom a{padding:13px 4px}
/* The contact bar above the header is the quickest way to email or call from a phone,
   and at 13px tall it was a tap you could easily miss. */
.topinner{height:auto;min-height:38px;padding:3px 0}
.tl-links a{display:inline-block;padding:14px 10px}
/* A grid track cannot shrink below the longest word sitting in it, which is how the founding
   numbers pushed the whole strip 12px past a 320px screen. min-width:0 hands that decision
   back to the column, and the 30px gap was written for a desktop three-across row. */
.stats-grid{gap:16px}
.stats-grid>div{min-width:0}
.stats-grid h2{font-size:31px;letter-spacing:-1px}
.stat{padding-left:14px}
.menu-toggle{width:46px;height:46px}
.hero h1{font-size:clamp(34px,10.4vw,49px);letter-spacing:-1.8px}
.page-hero{padding:54px 0 50px}
.page-hero .container{animation:riseIn .45s cubic-bezier(.22,.61,.36,1) both}
.section{padding:56px 0}
.values-grid article,.contact-detail{padding-left:18px;padding-right:18px}
}
/* 320–430px screens. Placed after every 760px rule above, because the contact bar and the
   brand are set there too and equal specificity is decided by source order alone. The bar
   folded onto two lines and took 73px from the sheet before it had even opened; losing the
   hiring link here costs nothing, it is a top-level menu row and a footer link already. */
@media(max-width:430px){
:root{--nav-h:68px}
.section{padding:46px 0}.hero h1{font-size:clamp(30px,9vw,38px)}
.nav{height:var(--nav-h)}
.topinner{min-height:32px;font-size:10px;gap:6px;padding:0}
.tl-links{gap:5px}
.tl-links a{padding:12px 7px}
.brandtext b{font-size:17px}
.brandtext small{letter-spacing:2px;font-size:8.5px}
.brandmark{width:38px;height:38px}
.brand{gap:9px}
.navtools{gap:7px}
.drawer-foot{gap:8px}
.drawer-foot .df-search{padding:0 12px}
}
/* The smallest phones in use - an iPhone SE, an old Galaxy - are the only screens where the
   three contact links genuinely will not share one line. Below 360px the hiring link and the
   separator behind it are dropped rather than folding the bar onto two lines and taking 40px
   from the menu sheet; Careers stays reachable as a menu row and in the footer. */
@media(max-width:360px){
.topinner .tl-links>a:last-of-type,.topinner .tl-links>i:last-of-type{display:none}
}
@media(prefers-reduced-motion:reduce){main,.page-hero .container{animation:none}html{scroll-behavior:auto}}

/* ==========================================================
   Digital Marketplace — shelf rail, sort bar, shelf tiles
   The store page and every shelf page are drawn from these rules plus the
   product-card styles the old store already used. Nothing here is keyed to a
   particular shelf name, so a shelf created in the Control Centre is styled
   the moment it exists.
   ========================================================== */
.mk-stats{display:flex;flex-wrap:wrap;gap:9px;margin:20px 0 24px}
.mk-stats span{font:700 11px Manrope;letter-spacing:.06em;text-transform:uppercase;padding:8px 15px;border-radius:30px;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.07);color:#eef3e6}
.mk-stats b{color:var(--lime);font-size:14.5px;margin-right:5px}
.mk-shell{padding:42px 0 8px}
.mk-rail{display:flex;gap:10px;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin;padding:3px 2px 14px;margin-bottom:24px;border-bottom:1px solid var(--line)}
.mk-railitem{flex:0 0 auto;display:flex;align-items:center;gap:11px;padding:9px 16px 9px 10px;border:1px solid var(--line);border-radius:14px;background:#fff;transition:border-color .2s ease,transform .2s ease,box-shadow .2s ease,background .2s ease}
.mk-railitem:hover{border-color:var(--green2);transform:translateY(-2px);box-shadow:0 10px 24px rgba(20,40,25,.09)}
.mk-railitem b{display:block;font:700 13px Manrope;color:var(--ink);white-space:nowrap}
.mk-railitem small{display:block;font-size:11px;color:var(--muted);white-space:nowrap;margin-top:2px}
.mk-railitem.is-active{background:var(--green);border-color:var(--green)}
.mk-railitem.is-active b{color:#fff}
.mk-railitem.is-active small{color:rgba(255,255,255,.72)}
.mk-railitem.is-empty{opacity:.66}
.mki-all{flex:none;width:34px;height:34px;border-radius:9px;background:#eef3e7;display:grid;place-items:center;font-size:16px}
.mk-toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;margin:0 0 22px}
.mk-count{font-size:12.5px;color:var(--muted);margin:0}
.mk-sort{display:flex;flex-wrap:wrap;gap:6px}
.mk-sortbtn{font:700 11.5px Manrope;letter-spacing:.03em;color:var(--muted);border:1px solid var(--line);background:#fff;padding:8px 13px;border-radius:20px;transition:.18s}
.mk-sortbtn:hover{border-color:var(--green2);color:var(--green)}
.mk-sortbtn.is-active{background:var(--green);border-color:var(--green);color:#fff}
.mk-sortbtn.is-off{opacity:.45;pointer-events:none}
.mk-shelves{margin:44px 0 8px;padding-top:34px;border-top:1px solid var(--line)}
.mk-sub{font:800 20px Manrope;color:var(--green);letter-spacing:-.5px;margin:0 0 18px}
.mks-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));gap:18px}
.mks-tile{display:flex;flex-direction:column;gap:9px;padding:22px;border:1px solid var(--line);border-radius:18px;background:#fff;transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease}
.mks-tile:hover{transform:translateY(-5px);box-shadow:0 18px 42px rgba(20,40,25,.13);border-color:#cfd9c4}
.mks-tile b{font:800 16.5px Manrope;color:var(--green);letter-spacing:-.3px}
.mks-tile small{font-size:12.5px;line-height:1.65;color:var(--muted);flex:1}
.mks-tile .svc-ico,.mks-tile .svc-ico.is-mono{width:46px;height:46px;border-radius:12px;font-size:15px}
.mks-num{font:800 11px Manrope;letter-spacing:.05em;text-transform:uppercase;color:#9d853e}
.mks-tile.is-empty{background:#fbfcf8}
.mks-tile.is-empty .mks-num{color:var(--muted)}
/* The card photo and the shelf chip became links, so they must not inherit link blue or
   an underline, and the chip moves out of the media corner onto the body of the card. */
a.pc-media{display:block;text-decoration:none;color:inherit}
a.pc-cat{text-decoration:none}
.pc-body .pc-cat{position:static;align-self:flex-start;display:inline-block;padding:5px 11px;border-radius:20px;background:#eef3e7;color:var(--green);font:800 10px Manrope;letter-spacing:.08em;text-transform:uppercase}
.pc-body .pc-cat:hover{background:var(--green);color:#fff}
a.pc-title{color:inherit;text-decoration:none}
.pc-body h3 a:hover{color:var(--green2)}
.pc-soon{font-size:11.5px;font-weight:700;color:#9d853e;margin:0}
.mk-empty-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.mkv-all{background:var(--cream)}
.mkv-all b{color:var(--green)}
.mega-market{width:min(880px,calc(100vw - 40px))}
.mega-market .svc-grid{grid-template-columns:repeat(3,1fr)}
.mega-market b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:230px}
@media(max-width:640px){
.mk-shell{padding:28px 0 4px}
.mk-rail{gap:8px;margin-bottom:18px}
.mk-railitem{padding:11px 14px 11px 9px;border-radius:12px}
.mk-railitem b{font-size:12.5px}
.mk-toolbar{flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:12px}
/* flex-wrap has to be turned back off here. The wide rule wraps, and a *column* flex
   container that wraps sizes its children by their content instead of stretching them to
   the column, which let the count line and the sort row stand 17px past the right margin.
   min-width:0 then allows them to shrink, so the sort row scrolls in place instead of
   pushing the page wide. */
.mk-count,.mk-sort{min-width:0}
.mk-sort{overflow-x:auto;flex-wrap:nowrap;max-width:100%;padding-bottom:4px;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.mk-sort::-webkit-scrollbar{display:none}
.mk-sortbtn{flex:0 0 auto;padding:10px 14px;min-height:40px}
/* The product name is the link a thumb aims at, and on its own it is a 26px target, so it
   gets vertical room here. The card reads the same; the tap area grows to about 44px. */
.pc-body h3 a{display:inline-block;padding:9px 0;line-height:1.3}
.mks-grid{grid-template-columns:1fr;gap:12px}
.mks-tile{padding:18px}
.mk-stats{gap:7px}
.product-grid{grid-template-columns:1fr}
.mega-market .svc-grid{grid-template-columns:1fr}
.mega-market b{max-width:none;white-space:normal}
}

/* ============ Mr Lao launcher: the company mark on its own ============ */
/* The logo is a light mark on a transparent field, so it reads on the green disc exactly as
   it does in the dark footer. With the words gone the pill becomes a round badge, and the
   label survives as the button's accessible name and tooltip. */
.chat-launch{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;padding:0;border-radius:50%}
.chat-launch img{display:block;width:30px;height:30px;object-fit:contain;filter:drop-shadow(0 2px 6px rgba(0,0,0,.3))}

/* ==========================================================================
   TEAM — the portrait card on /team, and the full profile (CV) page
   ========================================================================== */
/* The card. The framed portrait is the object: an arched plate with a gold edge, the name
   set under it, the two facts a client scans for, and one link to the resume. The old
   circular badge is switched off here because every card now carries .tm-card. */
.tm-card{position:relative;background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px 22px 22px;text-align:center;box-shadow:0 14px 40px rgba(22,42,27,.07);display:flex;flex-direction:column;align-items:center;transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}
.team-card.tm-card::before{content:none}
.tm-card:hover{transform:translateY(-6px);box-shadow:0 26px 60px rgba(22,42,27,.16);border-color:#cfd9c4}
.tm-portrait{display:block;width:100%;max-width:232px;margin:0 auto 18px}
.tm-frame{position:relative;display:block;width:100%;height:272px;overflow:hidden;padding:5px;border-radius:130px 130px 12px 12px;background:linear-gradient(152deg,var(--gold),#efe2ba 30%,var(--lime) 66%,var(--green2));box-shadow:0 16px 34px rgba(22,42,27,.2)}
.tm-frame img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 20%;border-radius:126px 126px 8px 8px;background:#e9eee3;transition:transform .5s ease}
.tm-card:hover .tm-frame img{transform:scale(1.045)}
.tm-mono{display:grid;place-items:center;width:100%;height:100%;border-radius:126px 126px 8px 8px;background:linear-gradient(152deg,#20402b,var(--green2) 62%,#4a7d58);color:#e7efd8;font:800 54px Manrope;letter-spacing:.04em}
.tm-veil{position:absolute;inset:5px;display:flex;align-items:flex-end;justify-content:center;padding:0 0 22px;opacity:0;transition:opacity .3s ease;border-radius:126px 126px 8px 8px;background:linear-gradient(transparent 40%,rgba(14,31,20,.78))}
.tm-card:hover .tm-veil,.tm-portrait:focus-visible .tm-veil{opacity:1}
.tm-cta{display:inline-flex;align-items:center;gap:8px;font:800 10.5px Manrope;letter-spacing:.1em;text-transform:uppercase;color:#fff;border:1px solid rgba(255,255,255,.55);border-radius:20px;padding:8px 15px;background:rgba(20,44,28,.42);backdrop-filter:blur(3px)}
.tm-cta i{font-style:normal;color:var(--gold)}
.tm-card h3{font-size:19px;margin:2px 0 8px;color:var(--ink);letter-spacing:-.4px}
.tm-head{margin:-2px 0 12px;font:700 11px Manrope;letter-spacing:.14em;text-transform:uppercase;color:#7f8f57;line-height:1.6}
.tm-facts{display:flex;list-style:none;width:100%;margin:16px 0 0;padding:13px 0 0;border-top:1px solid var(--line);justify-content:center}
.tm-facts li{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px;padding:0 8px}
.tm-facts li+li{border-left:1px solid var(--line)}
.tm-facts b{display:block;font:800 13.5px Manrope;letter-spacing:-.2px;color:var(--green);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tm-facts span{font:700 9px Manrope;letter-spacing:.12em;text-transform:uppercase;color:#9aa79a}
.tm-more{margin-top:auto;padding-top:17px;display:inline-flex;align-items:center;gap:8px;font:800 11px Manrope;letter-spacing:.06em;color:var(--green)}
.tm-more span{color:#b39443;transition:transform .2s ease}
.tm-card:hover .tm-more span{transform:translateX(4px)}
/* the printed sheet, offered under the page link: quiet until hovered, so the card still
   reads as one portrait rather than a row of buttons */
.tm-pdf{margin-top:9px;display:inline-flex;align-items:center;gap:6px;font:700 9.5px Manrope;letter-spacing:.12em;text-transform:uppercase;color:#9aa79a;transition:color .2s ease}
.tm-pdf:hover{color:var(--green)}

/* ---- the profile page: hero ---- */
.cv-hero{padding:92px 0 88px}
.cv-hero-grid{display:grid;grid-template-columns:296px 1fr;gap:62px;align-items:center}
.cv-portrait{margin:0}
.cv-frame{display:block;padding:8px;border-radius:152px 152px 16px 16px;background:linear-gradient(155deg,var(--gold),#f1e4bb 30%,var(--lime) 66%,var(--green2));box-shadow:0 26px 60px rgba(4,12,7,.5)}
.cv-frame img{display:block;width:100%;height:346px;object-fit:cover;object-position:center 16%;border-radius:146px 146px 10px 10px;background:#e9eee3}
.cv-mono{display:grid;place-items:center;width:100%;height:346px;border-radius:146px 146px 10px 10px;background:linear-gradient(155deg,#1b3724,var(--green2));color:#eaf2d9;font:800 82px Manrope;letter-spacing:.04em}
.cv-crest{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:16px}
.cv-crest b{font:800 12px Manrope;letter-spacing:.34em;color:#c8d59a}
.cv-crest-line{height:1px;width:56px;background:linear-gradient(90deg,transparent,rgba(215,185,94,.75),transparent)}
.cv-role{margin:14px 0 8px;font:800 12.5px Manrope;letter-spacing:.24em;text-transform:uppercase;color:var(--lime)}
.cv-head{margin:0 0 22px;font-size:16px;line-height:1.75;color:rgba(255,255,255,.82);max-width:640px}
.cv-id h1{max-width:760px}
.cv-meta{display:flex;flex-wrap:wrap;list-style:none;margin:0 0 26px;padding:0}
.cv-meta li{display:flex;flex-direction:column;gap:4px;margin-right:26px;padding-right:26px;border-right:1px solid rgba(255,255,255,.18)}
.cv-meta li:last-child{margin-right:0;padding-right:0;border-right:0}
.cv-meta b{font:800 9px Manrope;letter-spacing:.16em;text-transform:uppercase;color:#9fb37f}
.cv-meta span,.cv-meta a{font-size:13px;color:#e8efe2}
.cv-meta a:hover{color:var(--lime)}
.cv-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.cv-ghost{border:1px solid rgba(255,255,255,.32);background:transparent;color:#fff}
.cv-ghost:hover{background:rgba(255,255,255,.1)}
.cv-back{font:800 12px Manrope;color:#c9d68e}
.cv-back:hover{color:var(--lime)}

/* ---- the profile page: the sheet ---- */
.cv-section{padding:74px 0 84px;background:var(--cream)}
.cv-sheet{max-width:1060px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:6px;box-shadow:0 30px 80px rgba(22,42,27,.12);padding:52px 54px 0}
.cv-grid{display:grid;grid-template-columns:1fr 300px;gap:56px}
.cv-sec{margin:0 0 40px}
.cv-sec>p{margin:0 0 14px;font-size:14.5px;line-height:1.85;color:#4a584c}
.cv-h{display:flex;align-items:center;gap:14px;margin:0 0 20px}
.cv-hn{flex:none;font:800 10px Manrope;letter-spacing:.1em;color:#b39443;background:#faf7ec;border:1px solid #e3d9bb;border-radius:3px;padding:4px 7px}
.cv-h h2{margin:0;font:800 14.5px Manrope;letter-spacing:.16em;text-transform:uppercase;color:var(--green);white-space:nowrap}
.cv-h i{flex:1;height:1px;background:linear-gradient(90deg,var(--line),transparent)}
.cv-entry{margin:0 0 22px;padding:0 0 22px;border-bottom:1px dashed #e6eadf}
.cv-entry:last-child{margin-bottom:0;padding-bottom:0;border-bottom:0}
.cv-entry-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;flex-wrap:wrap}
.cv-entry h3{margin:0;font-size:17px;color:var(--ink)}
.cv-entry h3 em{display:block;margin-top:5px;font:700 12px Manrope;font-style:normal;letter-spacing:.06em;text-transform:uppercase;color:#7f8f57}
.cv-period{flex:none;font:700 11px Manrope;letter-spacing:.06em;color:#7f8f57;background:#f1f4ea;border-radius:20px;padding:5px 12px;white-space:nowrap}
.cv-bul{display:flex;flex-direction:column;gap:9px;list-style:none;margin:12px 0 0;padding:0}
.cv-bul li{position:relative;padding-left:22px;font-size:13.5px;line-height:1.7;color:#4a584c}
.cv-bul li::before{content:'';position:absolute;left:3px;top:9px;width:7px;height:7px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 3px #f0f4e6}
.cv-seal{display:grid;grid-template-columns:repeat(auto-fill,minmax(238px,1fr));gap:12px;list-style:none;margin:0;padding:0}
.cv-seal li{border:1px solid #e6eadf;border-left:3px solid var(--gold);background:#fbfaf6;border-radius:0 6px 6px 0;padding:13px 16px}
.cv-seal b{font:700 13px Manrope;color:var(--ink)}
.cv-blank{background:linear-gradient(150deg,#f7f9f2,#eef3e6);border:1px dashed #cfd9c4;border-radius:12px;padding:44px 40px;text-align:center}
.cv-blank h2{margin:0 0 12px;font-size:22px;color:var(--green);letter-spacing:-.6px}
.cv-blank p{margin:0 auto 22px;max-width:470px;font-size:13.5px;line-height:1.8;color:var(--muted)}

/* ---- the profile page: the narrow fact column ---- */
.cv-side-head{display:flex;align-items:center;gap:10px;margin:30px 0 12px}
.cv-side-head:first-child{margin-top:0}
.cv-side-head h3{margin:0;font:800 10.5px Manrope;letter-spacing:.2em;text-transform:uppercase;color:#8b9b6c}
.cv-side-head::after{content:'';flex:1;height:1px;background:var(--line)}
.cv-contacts{display:flex;flex-direction:column;gap:13px;list-style:none;margin:0;padding:0}
.cv-contacts li{font-size:13px;color:var(--ink);overflow-wrap:anywhere}
.cv-contacts span{display:block;margin-bottom:2px;font:800 9px Manrope;letter-spacing:.14em;text-transform:uppercase;color:#a4b09d}
.cv-contacts a{font-weight:700;color:var(--green)}
.cv-chips{display:flex;flex-wrap:wrap;gap:7px;list-style:none;margin:0;padding:0}
.cv-chips li{background:#edf3e7;color:var(--green);border-radius:20px;padding:6px 13px;font:700 11.5px Manrope}
.cv-ticks{display:flex;flex-direction:column;gap:9px;list-style:none;margin:0;padding:0}
.cv-ticks li{position:relative;padding-left:25px;font-size:12.5px;line-height:1.6;color:#4a584c}
.cv-ticks li::before{content:'\2713';position:absolute;left:0;top:0;font:800 12px Manrope;color:#8ba03f}
.cv-langs{display:flex;flex-direction:column;gap:8px;list-style:none;margin:0;padding:0}
.cv-langs li{display:flex;justify-content:space-between;gap:12px;padding-bottom:8px;border-bottom:1px dashed #eaeef2;font-size:12.5px}
.cv-langs li:last-child{border-bottom:0}
.cv-langs b{font-weight:700;color:var(--ink)}
.cv-langs span{font-size:11.5px;color:var(--muted);text-align:right}
.cv-refs{display:flex;flex-direction:column;gap:10px;list-style:none;margin:0;padding:0}
.cv-refs li{padding-left:14px;border-left:2px solid #e3e9dc;font-size:12.5px;line-height:1.65;color:#4a584c}
.cv-onreq{margin:0;font-size:12.5px;color:var(--muted);font-style:italic}
.cv-brand{display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:32px;padding:18px 16px;background:var(--cream);border-radius:8px;text-align:center}
.cv-brand img{width:44px;height:44px;object-fit:contain}
.cv-brand b{font:800 12px Manrope;letter-spacing:.04em;color:var(--green)}
.cv-brand span{font-size:10.5px;line-height:1.6;color:var(--muted)}
.cv-foot{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;margin:44px -54px 0;padding:18px 54px;border-top:1px solid var(--line);font-size:10.5px;letter-spacing:.02em;color:#98a492}

/* ---- also on the team ---- */
.cv-moreband{padding:72px 0 84px;border-top:1px solid var(--line)}
.cv-more-head{display:flex;align-items:end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:28px}
.cv-more-head h2{margin:10px 0 0;font-size:30px;letter-spacing:-1.4px}
.cv-more{display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));gap:14px}
.cv-person{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.cv-person:hover{transform:translateY(-3px);box-shadow:0 16px 38px rgba(22,42,27,.1);border-color:#cfd9c4}
.cv-person-img{flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;overflow:hidden;background:#e9eee3;border:2px solid #edf3e7}
.cv-person-img img{width:100%;height:100%;object-fit:cover}
.cv-person-img b{font:800 15px Manrope;color:var(--green)}
.cv-person-txt{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.cv-person-txt b{font-size:13.5px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cv-person-txt small{font-size:11px;color:var(--muted)}
.cv-person i{font:800 12px Manrope;font-style:normal;color:#b39443}
@media(max-width:1000px){
.cv-hero-grid{grid-template-columns:1fr;gap:34px}
.cv-portrait{max-width:270px}
.cv-grid{grid-template-columns:1fr;gap:42px}
.cv-frame img,.cv-mono{height:300px}
}
@media(max-width:760px){
.cv-section{padding:56px 0 62px}
.cv-sheet{padding:34px 24px 0}
.cv-foot{margin:34px -24px 0;padding:16px 24px}
.cv-meta li{border-right:0;margin-right:0;padding-right:0;width:100%}
.cv-hero{padding:64px 0 58px}
.cv-entry-head{gap:6px}
.cv-period{order:2}
}
@media(max-width:430px){.tm-frame{height:240px}.cv-frame img,.cv-mono{height:250px}}

/* ---- the printed sheet ----
   The page is written as a document, so printing it should not need a second template:
   the site chrome and the on-screen actions go, the dark hero turns to black on white, the
   medallion shrinks to a portrait beside the name and the two columns are kept. */
@page{size:A4;margin:12mm}
@media print{
.topline,.header,.footer,.chat-launch,.chatbox,.subscribe-modal,.ck,.ck-toast,.skip-link,
.searchlayer,.flash-wrap,.cv-actions,.cv-back,.cv-moreband,.cv-crest,.cv-brand{display:none!important}
body{background:#fff}
*{-webkit-print-color-adjust:exact;print-color-adjust:exact}
.page-hero:before{display:none}
.cv-hero{background:#fff!important;padding:0 0 8mm;border-bottom:1px solid #999}
.cv-hero-grid{grid-template-columns:34mm 1fr;gap:9mm;align-items:start}
.cv-frame{padding:1mm;border-radius:2mm;background:#d9d9d9;box-shadow:none}
.cv-frame img{height:44mm;object-position:center 20%;border-radius:1mm}
.cv-mono{height:44mm;font-size:22pt;border-radius:1mm}
.cv-hero .eyebrow{color:#666}
.cv-hero h1{color:#000;font-size:24pt;letter-spacing:-.6px;text-shadow:none;margin:0 0 2mm}
.cv-role{color:#254c31;font-size:9.5pt}
.cv-head{color:#333;font-size:10pt}
.cv-meta li{border-right-color:#ccc}
.cv-meta b{color:#777}
.cv-meta span,.cv-meta a{color:#111}
.cv-section{padding:0;background:#fff}
.cv-sheet{max-width:none;border:0;border-radius:0;box-shadow:none;padding:8mm 0 0}
.cv-grid{gap:10mm}
.cv-sec{margin-bottom:7mm;page-break-inside:auto}
.cv-sec>p{font-size:10.5pt;color:#222;line-height:1.6}
.cv-h{margin-bottom:4mm}
.cv-h h2{color:#000;font-size:10.5pt}
.cv-hn{color:#333;background:none;border-color:#bbb}
.cv-h i{background:#bbb}
.cv-entry{page-break-inside:avoid;margin-bottom:5mm;padding-bottom:5mm;border-bottom-color:#ddd}
.cv-entry h3{font-size:11.5pt;color:#000}
.cv-entry h3 em{color:#333}
.cv-period{background:none;border:1px solid #bbb;color:#333;font-size:8.5pt}
.cv-bul li,.cv-ticks li,.cv-refs li{font-size:9.5pt;color:#222;line-height:1.55}
.cv-bul li::before{background:#666;box-shadow:none}
.cv-ticks li::before{color:#333}
.cv-seal li{border-color:#ddd;border-left-color:#999;background:none}
.cv-seal b{color:#000}
.cv-side-head h3{color:#333}
.cv-side-head::after{background:#ddd}
.cv-contacts li,.cv-contacts a{color:#111;font-size:9.5pt}
.cv-contacts span{color:#777}
.cv-chips li{background:none;border:1px solid #bbb;color:#111;font-size:9pt}
.cv-langs li{border-bottom-color:#ddd;font-size:9.5pt}
.cv-langs b{color:#000}.cv-langs span{color:#555}
.cv-onreq{color:#333;font-size:9.5pt}
.cv-foot{margin:8mm 0 0;padding:4mm 0 0;border-top-color:#bbb;color:#555;font-size:8pt}
}

/* ============ Quote request — public intake form ============ */
.qz-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:28px;align-items:start}
.qz-form{background:#fff;border:1px solid var(--line);border-radius:22px;padding:34px 36px;box-shadow:0 22px 60px rgba(22,42,27,.08);position:relative;overflow:hidden}
.qz-form::after{content:"";position:absolute;right:-70px;top:-70px;width:200px;height:200px;border-radius:50%;background:radial-gradient(closest-side,rgba(168,191,85,.16),transparent);pointer-events:none}
.qz-block{position:relative;padding:22px 0 4px;border-top:1px solid var(--line)}
.qz-block:first-of-type{border-top:0;padding-top:6px}
.qz-step{position:absolute;top:22px;right:0;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--green),var(--green2) 60%,var(--lime));color:#fff;font:800 15px Manrope;box-shadow:0 8px 18px rgba(37,76,49,.24)}
.qz-block:first-of-type .qz-step{top:6px}
.qz-block h3{font:800 18px Manrope;letter-spacing:-.4px;color:var(--ink);margin:0 0 6px;padding-right:44px}
.qz-help{font-size:12.5px;color:var(--muted);line-height:1.6;margin:0 0 16px}
.qz-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.qz-field{display:flex;flex-direction:column;margin-bottom:16px}
.qz-field label{display:flex;align-items:center;gap:8px;font:700 11px Manrope;letter-spacing:.05em;text-transform:uppercase;color:#59645b;margin:0 0 8px}
.qz-req{font-size:9px;letter-spacing:.08em;color:#8b6c1f;background:#faf3dd;padding:2px 8px;border-radius:20px;text-transform:none;font-weight:700}
.qz-opt{font-size:9px;letter-spacing:.06em;color:var(--muted);background:#eef1ea;padding:2px 8px;border-radius:20px;text-transform:none;font-weight:700}
.qz-field input,.qz-field textarea,.qz-field select{border:1px solid #d6ddcf;background:#fbfcf9;padding:14px 15px;border-radius:11px;font:500 14px 'DM Sans';color:var(--ink);width:100%;outline:none;transition:border-color .18s,box-shadow .18s,background .18s}
.qz-field textarea{resize:vertical;min-height:150px;line-height:1.6}
.qz-field input::placeholder,.qz-field textarea::placeholder{color:#a7b0a6}
.qz-field input:hover,.qz-field textarea:hover,.qz-field select:hover{border-color:#c3cdb9}
.qz-field input:focus,.qz-field textarea:focus,.qz-field select:focus{border-color:var(--green);background:#fff;box-shadow:0 0 0 4px rgba(37,76,49,.1)}

.qz-svcs{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.qz-svc{position:relative;cursor:pointer;display:block}
.qz-svc input{position:absolute;opacity:0;width:0;height:0}
.qz-svc-body{display:flex;align-items:center;gap:13px;border:1.5px solid var(--line);background:#fbfcf9;border-radius:14px;padding:14px 15px;transition:border-color .18s,box-shadow .18s,background .18s,transform .18s}
.qz-svc:hover .qz-svc-body{border-color:#c3cdb9;transform:translateY(-2px)}
.qz-svc-ico{flex:none;width:40px;height:40px;border-radius:11px;display:grid;place-items:center;font-size:20px;color:#fff;background:linear-gradient(135deg,var(--green),var(--green2) 60%,var(--lime))}
.qz-svc-txt{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.qz-svc-txt b{font:700 13.5px Manrope;color:var(--ink)}
.qz-svc-txt small{font-size:11.5px;color:var(--muted);line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.qz-svc-tick{flex:none;width:22px;height:22px;border-radius:50%;border:1.5px solid #cdd6c6;display:grid;place-items:center;color:#fff;font-size:12px;opacity:.4;transition:.18s}
.qz-svc.is-on .qz-svc-body,.qz-svc input:checked~.qz-svc-body{border-color:var(--green);background:#f2f6ea;box-shadow:0 0 0 3px rgba(37,76,49,.09)}
.qz-svc.is-on .qz-svc-tick,.qz-svc input:checked~.qz-svc-body .qz-svc-tick{opacity:1;background:var(--green);border-color:var(--green)}
.qz-submit{width:100%;justify-content:space-between;gap:14px;margin-top:24px;padding:16px 22px;font-size:13.5px;border-radius:12px}
.qz-submit span{color:var(--gold)}

.qz-side{display:flex;flex-direction:column;gap:16px;position:sticky;top:100px}
.qz-side-card{background:var(--cream);border:1px solid var(--line);border-radius:16px;padding:24px 26px}
.qz-side-card h3{font-size:15px;color:var(--green);margin:0 0 14px;letter-spacing:-.2px}
.qz-side-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:13px}
.qz-side-list li{position:relative;padding-left:26px;font-size:12.5px;line-height:1.6;color:var(--muted)}
.qz-side-list li b{color:var(--ink);font-weight:700}
.qz-side-list li::before{content:"\2713";position:absolute;left:0;top:0;color:var(--green);font-weight:800}
.qz-side-cta{background:linear-gradient(135deg,var(--green),#1e3927);border:0;color:#eaf0e6}
.qz-side-cta .eyebrow{color:var(--gold)}
.qz-side-cta h3{color:#fff}
.qz-side-cta p{font-size:12.5px;line-height:1.7;color:#cddac9;margin:0 0 14px}
.qz-side-cta .btn-ghost{background:#fff;border-color:#fff;color:var(--green)}
.qz-side-quote{border-left:3px solid var(--gold);padding:4px 0 4px 18px}
.qz-side-quote p{font:italic 500 14px/1.6 'DM Sans';color:var(--ink);margin:0 0 10px}
.qz-side-quote b{display:block;font:800 12.5px Manrope;color:var(--green);letter-spacing:.02em}
.qz-side-quote small{font-size:11px;color:var(--muted)}

/* Thank-you (sent) panel */
.qz-done{max-width:640px;margin:0 auto;text-align:center;background:#fff;border:1px solid var(--line);border-radius:22px;padding:44px 40px;box-shadow:0 22px 60px rgba(22,42,27,.08)}
.qz-done-mark{width:74px;height:74px;margin:0 auto 20px;border-radius:50%;display:grid;place-items:center;font-size:34px;color:#fff;background:linear-gradient(135deg,var(--green),var(--lime));box-shadow:0 14px 30px rgba(37,76,49,.28)}
.qz-done h2{font:800 28px Manrope;letter-spacing:-.8px;color:var(--ink);margin:12px 0 12px}
.qz-done>p{font-size:14px;color:var(--muted);line-height:1.75;margin:0 0 26px}
.qz-done-steps{list-style:none;counter-reset:q;margin:0 0 26px;padding:0;text-align:left;display:flex;flex-direction:column;gap:16px}
.qz-done-steps li{position:relative;padding-left:42px;counter-increment:q;font-size:13px;line-height:1.6;color:var(--muted)}
.qz-done-steps li b{display:block;color:var(--ink);font:700 13.5px Manrope;margin-bottom:2px}
.qz-done-steps li::before{content:counter(q);position:absolute;left:0;top:-2px;width:30px;height:30px;border-radius:50%;background:var(--cream);border:1px solid var(--line);color:var(--green);font:800 13px Manrope;display:grid;place-items:center}
.qz-done-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-bottom:20px}
.qz-done-note{font-size:12px;color:var(--muted);margin:0}

@media(max-width:940px){.qz-grid{grid-template-columns:1fr}.qz-side{position:static}}
@media(max-width:600px){.qz-form{padding:26px 22px}.qz-row,.qz-svcs{grid-template-columns:1fr}.qz-done{padding:32px 22px}}

/* ============ Quote request — public A4 quotation sheet ============ */
.qz-docbar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.qz-back{font:700 13px Manrope;color:var(--green);text-decoration:none}
.qz-back:hover{text-decoration:underline}
.qz-docbar-actions{display:flex;gap:12px;flex-wrap:wrap}
.qz-docbar-actions .btn span{opacity:.85}
.qz-doc-area{padding-bottom:70px;display:flex;justify-content:center}
.a4{width:min(860px,100%);background:#fff;border:1px solid var(--line);border-radius:6px;box-shadow:0 30px 70px rgba(22,42,27,.16);padding:52px 54px;color:var(--ink);position:relative}

.a4-head{display:flex;justify-content:space-between;align-items:flex-start;gap:26px}
.a4-brand{display:flex;gap:16px;align-items:flex-start;min-width:0}
.a4-brand img{width:56px;height:56px;object-fit:contain;flex:none}
.a4-brand b{display:block;font:800 18px Manrope;letter-spacing:-.3px;color:var(--green)}
.a4-brand small{display:block;font-size:12px;color:var(--muted);line-height:1.5;margin-top:2px}
.a4-brand span{display:block;font-size:11.5px;color:var(--muted);margin-top:4px}
.a4-title{text-align:right;flex:none}
.a4-title span{display:block;font:800 11px Manrope;letter-spacing:.28em;color:var(--gold)}
.a4-title b{display:block;font:800 22px Manrope;letter-spacing:-.4px;color:var(--ink);margin-top:6px}
.a4-rule{display:flex;gap:4px;margin:22px 0 26px}
.a4-rule i{height:4px;border-radius:3px;background:var(--green)}
.a4-rule i:nth-child(1){width:46%}.a4-rule i:nth-child(2){width:24%;background:var(--green2)}
.a4-rule i:nth-child(3){width:18%;background:var(--lime)}.a4-rule i:nth-child(4){width:12%;background:var(--gold)}

.a4-meta{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap;margin-bottom:30px}
.a4-dl{display:flex;gap:34px;flex-wrap:wrap}
.a4-dl>div{display:flex;flex-direction:column;gap:3px}
.a4-dl small{font:800 10px Manrope;letter-spacing:.14em;color:var(--muted)}
.a4-dl b{font:700 14px Manrope;color:var(--ink)}
.a4-to{background:var(--cream);border:1px solid var(--line);border-left:3px solid var(--gold);border-radius:0 12px 12px 0;padding:16px 20px;min-width:240px}
.a4-to small{display:block;font:800 10px Manrope;letter-spacing:.14em;color:var(--muted);margin-bottom:6px}
.a4-to span{display:block;font:600 13px/1.5 'DM Sans';color:var(--ink)}

.a4-lines table{width:100%;border-collapse:collapse}
.a4-lines th{text-align:left;font:800 10.5px Manrope;letter-spacing:.1em;text-transform:uppercase;color:#fff;background:var(--green);padding:12px 14px}
.a4-lines th.n{text-align:right;width:96px}
.a4-lines td{padding:15px 14px;border-bottom:1px solid var(--line);vertical-align:top;font-size:13px}
.a4-lines td.n{text-align:right;font:700 13.5px Manrope;font-variant-numeric:tabular-nums;white-space:nowrap}
.a4-lines td b{display:block;font:700 14px Manrope;color:var(--ink);margin-bottom:3px}
.a4-lines td p{margin:0;font-size:12.5px;color:var(--muted);line-height:1.55}
.a4-lines td em{display:block;font-style:normal;font-size:11.5px;color:#8a948a;margin-top:4px}
.a4-lines tbody tr:nth-child(even) td{background:#fafbf7}

.a4-foot-grid{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap;margin-top:28px}
.a4-terms{flex:1;min-width:250px}
.a4-terms h4{font:800 12px Manrope;letter-spacing:.1em;text-transform:uppercase;color:var(--green);margin:0 0 12px}
.a4-terms p{display:flex;justify-content:space-between;gap:14px;margin:0 0 7px;font-size:12.5px;border-bottom:1px dotted var(--line);padding-bottom:6px}
.a4-terms small{color:var(--muted)}
.a4-terms b{color:var(--ink);font-weight:700;text-align:right}
.a4-totals{width:280px;flex:none;display:flex;flex-direction:column;gap:9px}
.a4-totals>div{display:flex;justify-content:space-between;gap:14px;font-size:13px}
.a4-totals small{color:var(--muted)}
.a4-totals b{font:700 14px Manrope;font-variant-numeric:tabular-nums;color:var(--ink)}
.a4-grand{margin-top:8px;padding:15px 18px;border-radius:11px;background:linear-gradient(135deg,var(--green),var(--green2));align-items:center!important}
.a4-grand small{color:#cfe0c4!important;font:800 11px Manrope;letter-spacing:.12em}
.a4-grand b{color:#fff!important;font:800 22px Manrope!important}

.a4-note{margin:28px 0 0;padding:14px 18px;background:var(--cream);border:1px solid var(--line);border-radius:11px;font-size:12.5px;line-height:1.65;color:var(--muted)}
.a4-sign{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap;margin-top:34px}
.a4-sign-line{min-width:220px}
.a4-sign-line span{display:block;font:800 10px Manrope;letter-spacing:.14em;color:var(--muted);border-bottom:1.5px solid var(--ink);padding-bottom:26px;margin-bottom:8px;max-width:220px}
.a4-sign-line b{display:block;font:700 14px Manrope;color:var(--ink)}
.a4-sign-line small{display:block;font-size:12px;color:var(--muted)}
.a4-accept{flex:1;min-width:250px;background:#f2f6ea;border:1px solid #cfe0c4;border-radius:12px;padding:16px 20px}
.a4-accept b{display:block;font:800 12.5px Manrope;color:var(--green);margin-bottom:6px}
.a4-accept p{margin:0;font-size:12.5px;line-height:1.6;color:#4a5648}
.a4-legal{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:34px;padding-top:18px;border-top:1px solid var(--line);font-size:11px;color:var(--muted)}
.a4-legal a{color:var(--green);font-weight:700;text-decoration:none}

@media(max-width:720px){.a4{padding:30px 22px}.a4-head{flex-direction:column}.a4-title{text-align:left}}

@media print{
  .qz-docbar,.chat-launcher,.chat-panel,nav,footer,.skip-link{display:none!important}
  body{background:#fff}
  .qz-doc-area{padding:0}
  .a4{width:100%;border:0;box-shadow:none;padding:0;border-radius:0}
  main,section{margin:0;padding:0}
}

/* ==========================================================================
   FAQ page — one search box, topic chips and a details/summary accordion.
   The rows are the Faq table as an editor left them, so the answer column is
   allowed to be several paragraphs or a bullet list and both have to read well.
   ========================================================================== */
.fq-area{padding-top:58px}
.fq-tools{position:sticky;top:88px;z-index:20;display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between;padding:14px 0 16px;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);margin-bottom:34px}
.fq-search{position:relative;flex:1 1 320px;max-width:520px}
.fq-search svg{position:absolute;left:15px;top:50%;transform:translateY(-50%);width:19px;height:19px;color:#8d9a8c;pointer-events:none}
.fq-search input{width:100%;border:1px solid #d7ded1;background:#fff;border-radius:9px;padding:14px 16px 14px 44px;font:14px 'DM Sans';color:var(--ink);outline:none}
.fq-search input::placeholder{color:#9aa69a}
.fq-search input:focus{border-color:var(--green2);box-shadow:0 0 0 4px rgba(55,104,68,.1)}
.fq-cats{display:flex;flex-wrap:wrap;gap:8px}
.fq-cat{display:inline-flex;align-items:center;gap:7px;border:1px solid #d9dfd3;background:#fff;color:#4a5648;border-radius:20px;padding:9px 14px;font:700 12px 'DM Sans';cursor:pointer;transition:.18s}
.fq-cat b{font:800 10px Manrope;color:#93a08f;background:#eef1e9;border-radius:10px;padding:2px 7px}
.fq-cat:hover{border-color:var(--green2);color:var(--green)}
.fq-cat.is-on{background:var(--green);border-color:var(--green);color:#fff}
.fq-cat.is-on b{background:#ffffff2e;color:#e6efd8}
.fq-hint{margin:0 0 22px;font-size:13.5px;color:var(--muted)}
.fq-hint a{color:var(--green);font-weight:700}
/* What the page holds, and what is currently on the screen while a filter is on. */
.fq-tally{margin:20px 0 0;font:700 11.5px 'DM Sans';letter-spacing:.12em;text-transform:uppercase;color:#7f8c7d}
.fq-tally b{font:800 14px Manrope;letter-spacing:-.2px;text-transform:none;color:var(--green)}
.fq-shown{margin:0 0 20px;font-size:12.5px;color:#7f8c7d}
.fq-shown:empty{display:none}
.fq-groups{display:flex;flex-direction:column;gap:42px}
.fq-ghead{display:flex;align-items:baseline;gap:14px;border-bottom:1px solid var(--line);padding-bottom:12px;margin-bottom:20px}
.fq-ghead h2{font:800 22px Manrope;letter-spacing:-.7px;margin:0;color:var(--ink)}
.fq-ghead span{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#8b9a86;font-weight:700}
.fq-list{display:flex;flex-direction:column;gap:10px;max-width:980px}
.fq-item{background:#fff;border:1px solid var(--line);border-left:3px solid #dfe5da;border-radius:10px;transition:border-color .2s,box-shadow .2s}
.fq-item:hover{border-color:#cdd7c6;border-left-color:var(--lime)}
.fq-item[open]{border-left-color:var(--green);box-shadow:0 10px 30px rgba(22,42,27,.07)}
.fq-item summary{display:flex;align-items:center;gap:18px;padding:19px 22px;cursor:pointer;list-style:none}
.fq-item summary::-webkit-details-marker{display:none}
.fq-item summary:focus-visible{outline:2px solid var(--green2);outline-offset:-2px;border-radius:10px}
.fq-q{flex:1;font:700 16.5px/1.45 Manrope;letter-spacing:-.25px;color:var(--ink)}
.fq-plus{position:relative;flex:none;width:28px;height:28px;border-radius:50%;background:#eef3e6;transition:.25s}
.fq-plus::before,.fq-plus::after{content:'';position:absolute;background:var(--green);border-radius:2px;top:50%;left:50%;transform:translate(-50%,-50%)}
.fq-plus::before{width:12px;height:2px}
.fq-plus::after{width:2px;height:12px;transition:transform .25s}
.fq-item[open] .fq-plus{background:var(--green)}
.fq-item[open] .fq-plus::before,.fq-item[open] .fq-plus::after{background:#fff}
.fq-item[open] .fq-plus::after{transform:translate(-50%,-50%) rotate(90deg)}
.fq-a{padding:2px 22px 22px 22px;border-top:1px dashed #e2e7dc;animation:fqOpen .22s ease}
.fq-a p{font-size:14.5px;line-height:1.85;color:#41503f;margin:16px 0 0}
.fq-a ul{margin:16px 0 0;padding-left:20px}
.fq-a li{font-size:14px;line-height:1.75;color:#41503f;margin:7px 0}
.fq-a li::marker{color:var(--lime)}
@keyframes fqOpen{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.fq-empty{max-width:640px;margin:0 auto;text-align:center;background:var(--cream);border:1px solid var(--line);border-radius:18px;padding:56px 40px}
.fq-empty h2{font:800 26px Manrope;letter-spacing:-1px;color:var(--ink);margin:0 0 12px}
.fq-empty p{font-size:14px;color:var(--muted);line-height:1.8;margin:0 0 22px}
/* The same quotes, sitting under the answers on /faq as a bordered inset panel. */
.fq-proof{margin:0 auto 20px;background:var(--cream);border:1px solid var(--line);border-radius:22px;padding:46px 40px}
.fq-proof .section-head{margin-bottom:26px}

/* ==========================================================================
   Client quotes — one card, included by the home page band and the FAQ page.
   ========================================================================== */
.ts-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:20px}
.ts-card{display:flex;flex-direction:column;gap:16px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:28px 26px;box-shadow:0 8px 24px rgba(22,42,27,.05)}
.ts-card.is-featured{border-left:3px solid var(--gold);box-shadow:var(--shadow)}
.ts-stars{display:flex;gap:3px}
.ts-star{font-size:15px;line-height:1;color:#d9ded2}
.ts-star.on{color:var(--gold)}
.ts-quote{flex:1;margin:0;font-size:15px;line-height:1.78;color:#33413a;letter-spacing:-.1px}
.ts-by{display:flex;align-items:center;gap:12px;border-top:1px solid var(--line);padding-top:16px}
.ts-face,.ts-mono{flex:none;width:44px;height:44px;border-radius:50%}
.ts-face{object-fit:cover;background:#e9eee3}
.ts-mono{display:grid;place-items:center;background:#e7edde;color:var(--green);font:800 14px Manrope;letter-spacing:.5px}
.ts-id{min-width:0}
.ts-id b{display:block;font:700 13.5px Manrope;color:var(--ink);overflow-wrap:anywhere}
.ts-id small{display:block;font-size:11.5px;color:var(--muted);margin-top:4px;line-height:1.5}
.ts-svc{margin-left:auto;flex:none;font:700 10px 'DM Sans';letter-spacing:.07em;text-transform:uppercase;font-style:normal;color:var(--green);background:#eef3e6;border-radius:20px;padding:6px 11px}
.ts-section{background:linear-gradient(180deg,#fff 0%,#f7f8f3 100%)}

/* ==========================================================================
   Trusted-by band — the organisations the work was delivered for.
   ========================================================================== */
.lg-band{padding:20px 0 62px;background:#fff}
.lg-title{font:800 clamp(21px,2.3vw,28px)/1.2 Manrope;letter-spacing:-1px;color:var(--ink);margin:0 0 24px}
.lg-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:14px}
.lg-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;padding:20px 16px;text-align:center;background:#fff;border:1px solid var(--line);border-radius:12px;transition:.22s}
a.lg-tile:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:#c7d2bb}
.lg-img{width:auto;max-width:100%;height:auto;max-height:44px;object-fit:contain;display:block;opacity:.82;filter:grayscale(.4);transition:.22s}
.lg-tile:hover .lg-img{opacity:1;filter:none}
.lg-name{font:700 12px Manrope;letter-spacing:-.1px;color:var(--ink)}
.lg-sector{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#8b9a86;font-weight:700}

/* ==========================================================================
   Closing ask on the FAQ page — the green band the rest of the site uses.
   ========================================================================== */
.cta-band{background:var(--green);color:#fff;padding:72px 0;position:relative;overflow:hidden}
.cta-band:after{content:'?';position:absolute;right:6%;top:-150px;font:800 440px Manrope;color:#ffffff09}
.cta-inner{display:flex;align-items:center;justify-content:space-between;gap:46px;position:relative;z-index:1}
.cta-band .eyebrow{color:#c8d59a}
.cta-band h2{font:800 clamp(28px,3.4vw,40px)/1.15 Manrope;letter-spacing:-1.8px;color:#fff;margin:16px 0 12px}
.cta-band p{font-size:14px;line-height:1.8;color:#d4ded3;max-width:520px;margin:0}
.cta-actions{display:flex;flex-wrap:wrap;gap:12px}
.cta-actions .btn{margin-top:0}
.cta-band .btn-light span{color:#b39443}
.cta-band .btn-ghost{border-color:#ffffff5c;color:#fff}
.cta-band .btn-ghost:hover{background:#ffffff14;border-color:#fff}

@media(max-width:900px){
  .fq-tools{position:static;flex-direction:column;align-items:flex-start}
  .fq-search{max-width:100%}
  .ts-grid{grid-template-columns:1fr 1fr}
  .cta-inner{flex-direction:column;align-items:flex-start}
}
@media(max-width:700px){
  .fq-area{padding-top:34px}
  .fq-cats{width:100%}
  .fq-item summary{padding:16px 16px;gap:12px}
  .fq-q{font-size:15px}
  .fq-a{padding:2px 16px 18px}
  .fq-ghead{flex-direction:column;gap:5px}
  .fq-proof{padding:32px 22px}
  .ts-grid,.lg-row{grid-template-columns:1fr 1fr}
  .lg-band{padding-bottom:44px}
}
@media(max-width:430px){.ts-grid,.lg-row{grid-template-columns:1fr}}

/* ===========================================================================
   THE DISCUSSION - the comments readers post on a project story, an insight or
   an open role, and the form they post them with.
   Deliberately not a card carousel: a thread has to be read top to bottom, so it
   is a list with a picture beside each entry. The team's own reply carries the
   gold rule, so a reader can see instantly which words came from the company.
   =========================================================================== */
.cm-section{padding:4px 0 100px}
.cm-head{align-items:flex-end;gap:26px}
.cm-sub{font-size:14.5px;color:var(--muted);line-height:1.7;max-width:660px;margin:14px 0 0}
.cm-tally{margin:0 0 4px;text-align:right;font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted);font-family:Manrope;line-height:1.5}
.cm-tally b{display:block;font-size:34px;letter-spacing:-1.4px;color:var(--green);text-transform:none}
.cm-staff{display:flex;align-items:center;gap:9px;margin:0 0 22px;padding:11px 15px;border-radius:12px;
  background:rgba(215,185,94,.14);border:1px solid rgba(215,185,94,.42);color:#6d5a19;font-size:12.8px}
.cm-staff svg{width:15px;height:15px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7}
.cm-staff a{color:#6d5a19;font-weight:700;text-decoration:underline}
.cm-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px}
.cm-card{display:grid;grid-template-columns:56px 1fr;gap:16px;background:#fff;border:1px solid var(--line);
  border-radius:18px;padding:22px 24px;box-shadow:0 14px 34px rgba(22,42,27,.05)}
.cm-face{width:48px;height:48px;border-radius:13px;display:block;background:var(--cream)}
.cm-main{min-width:0}
.cm-byline{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 8px}
.cm-name{font:700 15.5px Manrope;color:var(--ink);letter-spacing:-.2px}
.cm-byline time{margin-left:auto;font-size:12px;color:#93a08f;white-space:nowrap}
.cm-team{font:700 9.5px Manrope;letter-spacing:.12em;text-transform:uppercase;color:#3f5a2f;
  background:rgba(168,191,85,.22);border:1px solid rgba(88,120,52,.3);padding:3px 9px;border-radius:20px}
.cm-body p{margin:0 0 8px;font-size:15px;line-height:1.75;color:#2c3a2f;white-space:pre-line;overflow-wrap:break-word}
.cm-body p:last-child{margin-bottom:0}
.cm-tools{margin:12px 0 0;display:flex;gap:16px;align-items:center}
.cm-act{display:inline-flex;align-items:center;gap:6px;font:700 12px Manrope;letter-spacing:.03em;
  color:var(--green);text-decoration:none;border-bottom:1.5px solid transparent;padding-bottom:1px}
.cm-act span{color:var(--gold);transition:transform .18s}
.cm-act:hover{border-bottom-color:var(--green)}
.cm-act:hover span{transform:translateX(3px)}
.cm-thread{margin-top:16px;padding-left:clamp(0px,4vw,30px);display:flex;flex-direction:column;gap:12px}
.cm-is-reply{grid-template-columns:44px 1fr;padding:16px 18px;border-radius:14px;background:#fbfcf8;box-shadow:none}
.cm-is-reply .cm-face{width:38px;height:38px;border-radius:11px}
.cm-is-reply .cm-body p{font-size:14.5px}
.cm-is-team{border-left:3px solid var(--gold);background:linear-gradient(180deg,#fffdf6,#fff)}
/* The card the writer is answering, marked by the script in site.js. Nothing is hidden
   when the script is off - the reply still threads, it is only harder to see which one
   is being answered while the page reloads. */
.cm-card.is-target{border-color:var(--gold);
  box-shadow:0 0 0 3px rgba(215,185,94,.22),0 14px 34px rgba(22,42,27,.06)}
.cm-more{margin-top:18px}
.cm-more summary{display:inline-flex;align-items:center;gap:8px;cursor:pointer;list-style:none;
  font:700 12.5px Manrope;letter-spacing:.04em;color:var(--green);border:1px solid var(--line);
  background:#fff;padding:11px 18px;border-radius:30px}
.cm-more summary::-webkit-details-marker{display:none}
.cm-more summary:hover{border-color:var(--green2);background:var(--cream)}
.cm-more[open] summary{margin-bottom:16px}
.cm-more .cm-list{gap:14px}
.cm-empty{margin:0;padding:26px 28px;border:1px dashed var(--line);border-radius:16px;background:var(--cream);
  font-size:14.5px;line-height:1.7;color:var(--muted)}
.cm-closed{margin:26px 0 0;padding:18px 22px;border-radius:14px;background:#fbfcf8;border:1px solid var(--line);
  font-size:14px;line-height:1.7;color:var(--muted)}
.cm-closed a{color:var(--green);font-weight:700}

.cm-form{margin-top:30px;background:#fff;border:1px solid var(--line);border-radius:20px;
  padding:30px 32px;box-shadow:0 20px 60px rgba(22,42,27,.07)}
.cm-form-head{display:flex;align-items:baseline;gap:16px;margin-bottom:20px}
.cm-form-head h3{margin:0;font-size:21px;letter-spacing:-.6px;color:var(--ink);font-family:Manrope}
.cm-form-head b{color:var(--green)}
.cm-cancel{margin-left:auto;background:none;border:none;cursor:pointer;font:700 11.5px Manrope;
  letter-spacing:.05em;color:var(--muted);text-decoration:underline;padding:0}
.cm-cancel:hover{color:var(--green)}
.cm-fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.cm-field{display:flex;flex-direction:column;margin:0 0 16px}
.cm-field label{display:flex;align-items:center;gap:8px;font:700 11px Manrope;letter-spacing:.05em;
  text-transform:uppercase;color:#59645b;margin-bottom:8px}
.cm-field label small{text-transform:none;letter-spacing:0;font-weight:500;font-size:11px;color:#93a08f}
.cm-form input,.cm-form textarea{border:1px solid #d6ddcf;background:#fbfcf9;padding:13px 14px;border-radius:11px;
  font:500 14px 'DM Sans';color:var(--ink);width:100%;outline:none;transition:border-color .18s,box-shadow .18s,background .18s}
.cm-form textarea{resize:vertical;min-height:118px;line-height:1.65}
.cm-form input::placeholder,.cm-form textarea::placeholder{color:#a7b0a6}
.cm-form input:hover,.cm-form textarea:hover{border-color:#c3cdb9}
.cm-form input:focus,.cm-form textarea:focus{border-color:var(--green);background:#fff;box-shadow:0 0 0 4px rgba(37,76,49,.1)}
.cm-count{font-size:11.5px;color:#93a08f;margin:7px 0 0;text-align:right;letter-spacing:.03em}
.cm-count.is-near{color:#8b5a12;font-weight:700}
.btn.is-busy{opacity:.6;cursor:progress}
.cm-bot{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.cm-foot{display:flex;flex-direction:column;gap:14px}
.cm-privacy{margin:0;font-size:12.4px;line-height:1.65;color:var(--muted);max-width:640px}
.cm-privacy a{color:var(--green);text-decoration:underline}
@media(max-width:900px){
  .cm-head{flex-direction:column;align-items:flex-start}
  .cm-tally{text-align:left;margin:0}
  .cm-tally b{display:inline;font-size:26px}
}
@media(max-width:640px){
  .cm-section{padding-bottom:74px}
  .cm-fields{grid-template-columns:1fr}
  .cm-card{grid-template-columns:40px 1fr;gap:12px;padding:18px 18px}
  .cm-face{width:36px;height:36px;border-radius:10px}
  .cm-byline time{margin-left:0;width:100%}
  .cm-thread{padding-left:0}
  .cm-form{padding:22px 18px}
}

/* =============================================================================
   Mobile polish — verified on small (≈320px) and short (landscape) phone screens.
   ============================================================================= */
/* Keep the briefing panel fully reachable when it is taller than the viewport (a
   landscape phone or a short Android): scroll from the top instead of clipping it. */
@media(max-width:760px){
  .subscribe-modal{align-items:start;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:16px 14px calc(16px + env(safe-area-inset-bottom))}
  .modal-card{margin:auto}
  /* A comfortable close target on every phone and tablet, not just the smallest. */
  .modal-close{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-size:24px;line-height:1}
}
/* The smallest phones: tighten the panel. */
@media(max-width:430px){
  .modal-art{padding:26px 22px}
  .modal-art h2{font-size:25px;letter-spacing:-1px}
  .modal-form{padding:24px 20px}
  .modal-close{right:10px;top:8px}
}
/* iOS and Android zoom the page when a focused field is smaller than 16px, which throws
   the comment form off-screen mid-typing. Hold its text fields at 16px on phones. */
@media(max-width:760px){
  .cm-form input,.cm-form textarea{font-size:16px}
  /* The thin top contact strip and the footer link columns read fine but are very small
     tap targets on a touchscreen; give them room without disturbing the desktop layout. */
  .topinner a{display:inline-block;padding:6px 3px}
  .footergrid>div>a:not(.brand){padding:6px 0}
}
/* ===== Phone footer polish =====
   On a phone the footer columns stack and the section labels (Explore / What we do /
   Get in touch) were plain small text. Give them a deliberate, label-like treatment and
   tidy the brand row, links and bottom bar. Scoped to <=760px so desktop is untouched. */
@media(max-width:760px){
  .footer{padding-top:52px}
  .footergrid{grid-template-columns:1fr 1fr;gap:36px 26px;padding-bottom:42px}
  /* brand + description + socials read best across the full width above the link columns */
  .footergrid>div:first-child{grid-column:1/-1}
  .footer h4{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#d8c477;
             display:flex;align-items:center;gap:9px;margin:0 0 14px;padding-bottom:10px;
             border-bottom:1px solid rgba(216,196,119,.22)}
  .footer h4::before{content:'';width:14px;height:2px;border-radius:2px;background:var(--gold);flex:none}
  /* the old phone rule (line ~1225) forced these links to display:inline-block, so they
     flowed together like sentence words and gave a thumb only the text to hit. Put them
     back on their own full-width row, each a comfortable tap target. */
  .footergrid>div>a:not(.brand){display:block;width:100%;font-size:12.5px;color:#c4d0c5;margin:0;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.06)}
  .footergrid>div>a:not(.brand):last-child{border-bottom:0}
  .footergrid>div>a:not(.brand):hover{color:#fff}
  .footer .muted{max-width:none;margin-top:16px}
  .socials{margin-top:20px;gap:10px}
  .socials span{width:34px;height:34px;font-size:12px}
}
/* Smallest phones: single column, roomier tap targets and a wrapped legal bar. */
@media(max-width:430px){
  .footergrid{grid-template-columns:1fr;gap:30px}
  .footergrid>div>a:not(.brand){padding:13px 0}
  .footbottom{font-size:11px;gap:12px}
  .foot-legal,.foot-tools{width:100%;justify-content:flex-start}
}
/* ===== Content copy deterrent =====
   Stops casual highlighting/copying of the site text. Paired with the JS guard in
   site.js. It is only a deterrent (view-source and screenshots still work) and keeps
   editable fields selectable so forms stay usable. */
body{-webkit-user-select:none;-moz-user-select:none;user-select:none}
main img{-webkit-user-drag:none;user-drag:none}
input,textarea,select,[contenteditable="true"],.cm-body,.sr-results,.doc-body,.code,.legal-body{-webkit-user-select:text;user-select:text}
/* ===== Draggable Mr Lao launcher =====
   touch-action:none lets a phone drag the button instead of scrolling the page while the
   finger is on it; the grab/grabbing cursors and the lifted shadow signal that it is movable. */
.chat-launch{touch-action:none;cursor:grab;transition:transform .15s ease,box-shadow .15s ease}
.chat-launch:hover{transform:translateY(-2px)}
.chat-launch.is-dragging{cursor:grabbing;transform:none;transition:none;box-shadow:0 18px 44px rgba(22,42,27,.3)}
.chat-launch img{pointer-events:none}

/* ============ Response dialog: one professional confirmation per form ============
   Painted from _response_modal.html whenever respond.say() left words behind. It sits
   above the briefing panel (z-index 100), the cookie band (105) and the search layer
   (120) because a person has to be able to read the answer to what they just did.
   The tones only ever change the accent: the shape, the spacing and the type stay the
   same, so good news and bad news are delivered by the same professional face. */
.resp{position:fixed;inset:0;z-index:140;display:none;place-items:center;padding:24px}
.resp.is-open{display:grid}
.resp-veil{position:absolute;inset:0;background:radial-gradient(120% 130% at 50% 0,rgba(16,27,19,.6),rgba(11,20,14,.82));backdrop-filter:blur(3px);animation:respVeil .3s ease}
.resp-card{position:relative;width:min(540px,100%);max-height:calc(100vh - 48px);overflow-y:auto;background:#fff;border-radius:22px;padding:34px 34px 26px;text-align:center;box-shadow:0 44px 100px rgba(11,22,15,.42);animation:respRise .42s cubic-bezier(.2,.9,.24,1)}
.resp-band{position:absolute;left:0;right:0;top:0;height:5px;background:var(--green)}
.resp-x{position:absolute;right:14px;top:10px;width:34px;height:34px;border:0;border-radius:50%;background:#eff3ea;color:var(--green);font:400 24px/1 Manrope;cursor:pointer;transition:background .16s,color .16s,transform .16s}
.resp-x:hover{background:var(--green);color:#fff;transform:rotate(90deg)}
.resp-mark{width:76px;height:76px;margin:4px auto 18px;border-radius:50%;display:grid;place-items:center;color:#fff;background:var(--green);box-shadow:0 0 0 9px #edf3e6,0 16px 34px rgba(37,76,49,.26);animation:respPop .5s cubic-bezier(.2,.9,.24,1) .06s backwards}
.resp-mark svg{width:34px;height:34px}
.resp-mark svg path,.resp-mark svg circle,.resp-mark svg rect{stroke-dasharray:120;stroke-dashoffset:120;animation:respDraw .75s ease .3s forwards}
.resp-kicker{display:inline-flex;align-items:center;gap:8px;font:700 10.5px Manrope;letter-spacing:.16em;text-transform:uppercase;color:#8b6c1f;margin-bottom:10px}
.resp-kicker i{width:18px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--gold),var(--lime))}
.resp-title{font:800 25px/1.25 Manrope;letter-spacing:-.7px;color:var(--ink);margin:0 0 10px}
.resp-body{font-size:14px;line-height:1.72;color:var(--muted);margin:0 auto;max-width:44ch}
.resp-ref{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin:20px auto 0;padding:11px 16px;border:1px dashed #cdd8c2;border-radius:12px;background:linear-gradient(135deg,#f6f8f1,#fbf8ec);width:fit-content}
.resp-ref-lab{font:700 10px Manrope;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.resp-ref-val{font:800 15px/1 ui-monospace,'Cascadia Mono',Consolas,monospace;letter-spacing:.06em;color:var(--green);-webkit-user-select:text;user-select:text}
.resp-copy{display:inline-flex;align-items:center;gap:5px;border:1px solid #cdd8c2;background:#fff;border-radius:20px;padding:5px 12px;font:700 11px Manrope;color:var(--green);cursor:pointer;transition:background .16s,border-color .16s}
.resp-copy:hover{background:#edf3e7;border-color:#b9c8ac}
.resp-copy svg{width:13px;height:13px}
.resp-copy.is-done{background:var(--green);border-color:var(--green);color:#fff}
.resp-steps{list-style:none;counter-reset:resp;margin:24px 0 0;padding:0;text-align:left;display:flex;flex-direction:column;gap:14px}
.resp-steps li{position:relative;padding-left:40px;counter-increment:resp;font-size:13px;line-height:1.6;color:var(--muted);animation:riseIn .45s ease backwards}
.resp-steps li:nth-child(2){animation-delay:.08s}
.resp-steps li:nth-child(3){animation-delay:.16s}
.resp-steps li:nth-child(4){animation-delay:.24s}
.resp-steps li b{display:block;color:var(--ink);font:700 13px Manrope;margin-bottom:1px}
.resp-steps li::before{content:counter(resp);position:absolute;left:0;top:-1px;width:28px;height:28px;border-radius:50%;background:var(--cream);border:1px solid var(--line);color:var(--green);font:800 12.5px Manrope;display:grid;place-items:center}
.resp-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:26px}
.resp-note{font-size:11.5px;line-height:1.6;color:var(--muted);margin:20px 0 -6px;padding-top:14px;border-top:1px solid var(--line)}
.resp-timer{position:absolute;left:0;right:0;bottom:0;height:3px;background:#eef1e9;overflow:hidden;border-radius:0 0 22px 22px}
.resp-timer i{display:block;height:100%;background:linear-gradient(90deg,var(--lime),var(--gold));transform-origin:left;animation:respTimer 9s linear .6s forwards}
/* No exit on a timer when the message has to be read: an error, or a cookie band still
   waiting underneath (site.js puts this class on the layer in that case). */
.resp-noauto .resp-timer{display:none}
body.resp-open{overflow:hidden}
/* The same face, four voices. The plain rules above carry no colour of their own beyond
   the brand green, so each tone states its own - nothing is left to an inherited default
   that a later tone might quietly overwrite. */
.resp--success .resp-band{background:linear-gradient(90deg,var(--green),var(--lime) 55%,var(--gold))}
.resp--success .resp-mark{background:linear-gradient(135deg,var(--green),var(--green2) 52%,var(--lime))}
.resp--info .resp-mark{background:linear-gradient(135deg,var(--green2),#5c8f72 55%,var(--gold))}
.resp--info .resp-band{background:linear-gradient(90deg,var(--green2),var(--gold))}
.resp--warn .resp-mark{background:linear-gradient(135deg,#b3862a,var(--gold));box-shadow:0 0 0 9px #faf3dd,0 16px 34px rgba(179,134,42,.26)}
.resp--warn .resp-band{background:linear-gradient(90deg,#b3862a,var(--gold))}
.resp--warn .resp-timer i{background:var(--gold)}
.resp--error .resp-mark{background:linear-gradient(135deg,#8e3a2d,#c1695a);box-shadow:0 0 0 9px #fae9e7,0 16px 34px rgba(142,58,45,.26)}
.resp--error .resp-band{background:linear-gradient(90deg,#8e3a2d,#c1695a)}
.resp--error .resp-title{color:#8e3a2d}
.resp--error .resp-timer i{background:#c1695a}
.resp.is-closing .resp-card{animation:respOut .22s ease forwards}
.resp.is-closing .resp-veil{animation:respVeil .22s ease reverse forwards}
@keyframes respVeil{from{opacity:0}to{opacity:1}}
@keyframes respRise{from{opacity:0;transform:translateY(20px) scale(.97)}to{opacity:1;transform:none}}
@keyframes respOut{to{opacity:0;transform:translateY(10px) scale(.985)}}
@keyframes respPop{0%{transform:scale(.55);opacity:0}70%{transform:scale(1.07);opacity:1}100%{transform:scale(1);opacity:1}}
@keyframes respDraw{to{stroke-dashoffset:0}}
@keyframes respTimer{from{transform:scaleX(1)}to{transform:scaleX(0)}}
@media(max-width:600px){.resp{padding:14px}.resp-card{padding:28px 20px 22px;border-radius:18px}.resp-mark{width:64px;height:64px;margin-bottom:14px}.resp-mark svg{width:29px;height:29px}.resp-title{font-size:21px}.resp-body{font-size:13.5px}.resp-actions .btn{flex:1 1 auto}.resp-steps{margin-top:20px}.resp-timer{border-radius:0 0 18px 18px}}
@media(prefers-reduced-motion:reduce){.resp-veil,.resp-card,.resp-mark,.resp-mark svg path,.resp-mark svg circle,.resp-mark svg rect,.resp-steps li,.resp-timer i{animation:none!important;stroke-dashoffset:0!important;stroke-dasharray:none!important;transform:none!important;opacity:1!important}.resp-timer{display:none}}
@media print{.resp{display:none!important}}
/* The plain bar under the header is the no-JS copy of this dialog. site.js adds the class
   below once the dialog is on screen, so a visitor is never told the same thing twice. */
body.resp-open .flash-wrap{display:none}