@import "tailwindcss";

:root { --orange:#f64920; --orange-dark:#df3519; --green:#236b37; --cream:#fff0e0; --ink:#173526; }
.floating-whatsapp { position:fixed; right:25px; bottom:24px; z-index:20; display:flex; align-items:center; gap:10px; padding:9px 11px 9px 16px; background:#25d366; color:#fff; border-radius:999px; box-shadow:0 9px 25px rgba(9,69,33,.32); font-size:13px; font-weight:700; transition:transform .2s ease,box-shadow .2s ease; }.floating-whatsapp:hover { transform:translateY(-3px); box-shadow:0 13px 28px rgba(9,69,33,.4); }.floating-whatsapp b { width:31px; height:31px; display:grid; place-items:center; background:#fff; color:#168c44; border-radius:50%; font-size:10px; letter-spacing:-.5px; }.social-links { display:flex; gap:12px; margin-top:13px; }.social-links a { width:39px; height:39px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.65); border-radius:50%; transition:background .2s ease,transform .2s ease; }.social-links a:hover { background:rgba(255,255,255,.18); transform:translateY(-2px); }.social-links img { width:18px; height:18px; }.ia-credit { display:flex; justify-content:center; align-items:center; gap:5px; padding:14px 24px; background:#173526; color:#d6ead1; font-size:11px; letter-spacing:1px; }.ia-credit:hover { background:#0f291c; }.ia-credit strong { color:#fff; }
.clients { background:var(--orange); color:white; text-align:center; }.clients-art { width:100%; max-width:1400px; display:block; margin:auto; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; background:var(--cream); color:var(--ink); font-family:Arial, Helvetica, sans-serif; } a { color:inherit; text-decoration:none; }
.topbar { height:84px; max-width:1280px; margin:auto; padding:0 36px; display:flex; align-items:center; justify-content:space-between; background:var(--cream); }
.brand { display:flex; align-items:center; }.brand img { display:block; width:172px; height:auto; }
nav { display:flex; gap:30px; font-size:14px; } nav a:hover,.text-link:hover { text-decoration:underline; }.button { display:inline-flex; align-items:center; gap:19px; background:var(--green); color:white; padding:16px 21px; border-radius:3px; font-weight:700; font-size:14px; }.button span { font-size:21px; line-height:10px; }.button-small { padding:11px 16px; }
.hero { min-height:600px; display:grid; grid-template-columns:1.45fr .8fr; background:var(--orange); color:white; overflow:hidden; }.hero-copy { padding:100px max(7vw,48px); align-self:center; }.eyebrow { margin:0 0 20px; font-size:11px; font-weight:700; letter-spacing:1.7px; }.green { color:var(--green); }.hero h1 { font-size:clamp(48px,6vw,86px); line-height:.94; letter-spacing:-4px; margin:0 0 27px; }.hero h1 em { font-family:Georgia,serif; font-weight:400; }.lead { max-width:560px; font-size:19px; line-height:1.5; }.hero-actions { margin-top:37px; display:flex; align-items:center; gap:30px; }.hero .button { background:var(--cream); color:var(--green); }.text-link { font-size:14px; font-weight:bold; }.hero-panel { min-height:600px; background:var(--green); padding:84px 60px; position:relative; overflow:hidden; display:flex; flex-direction:column; }.panel-orbit { position:absolute; width:540px; height:540px; border:1px solid #95bf93; border-radius:50%; top:-214px; right:-248px; }.hero-panel p { font-size:15px; text-transform:uppercase; letter-spacing:1px; margin:0 0 28px; }.hero-panel strong { font-size:134px; letter-spacing:-10px; line-height:.8; }.hero-panel > span { font-size:19px; max-width:270px; margin-top:28px; line-height:1.35; }.panel-footer { margin-top:auto; padding-top:28px; border-top:1px solid #94bc92; font-size:10px; font-weight:bold; letter-spacing:1.2px; }
.intro { max-width:1120px; margin:auto; padding:110px 36px; display:grid; grid-template-columns:.55fr 1.45fr; gap:30px; }.intro h2,.services h2,.method h2,.contact h2 { font-size:clamp(34px,4vw,58px); letter-spacing:-2.7px; line-height:.98; margin:0 0 22px; }.intro div p { font-size:19px; line-height:1.5; max-width:600px; }
.video-showcase { padding:105px max(7vw,36px); background:#163f25; color:#fff; }.video-showcase-heading { display:grid; grid-template-columns:.7fr 1.3fr 1fr; gap:28px; align-items:end; margin-bottom:48px; }.video-showcase h2 { font-size:clamp(35px,4.5vw,64px); letter-spacing:-3px; line-height:.94; margin:0; }.video-showcase h2 em { font-family:Georgia,serif; font-weight:400; }.video-showcase-heading > p:last-child { line-height:1.45; margin:0; max-width:280px; }.video-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px; }.video-grid figure { margin:0; }.video-grid video { width:100%; aspect-ratio:16/10; object-fit:cover; display:block; background:#0d2818; }.video-grid figcaption { padding-top:14px; font-size:13px; font-weight:bold; letter-spacing:.7px; text-transform:uppercase; color:#d3ead3; }
.services { background:var(--green); padding:105px max(7vw,36px); color:white; }.section-heading { display:flex; align-items:end; justify-content:space-between; margin-bottom:60px; }.section-heading h2 { margin:0; }.service-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid #88ac89; }.service-card { position:relative; min-height:218px; padding:25px 24px; border-right:1px solid #88ac89; border-bottom:1px solid #88ac89; }.service-card:nth-child(3n) { border-right:0; }.service-card span { font-size:12px; opacity:.8; }.service-card h3 { font-size:23px; max-width:250px; line-height:1.08; margin:60px 0 0; }.service-card i { position:absolute; right:24px; bottom:19px; font-size:26px; font-style:normal; }
.method { max-width:1120px; margin:auto; padding:115px 36px; display:grid; grid-template-columns:1fr 1fr; gap:80px; }.method p:last-child { font-size:18px; line-height:1.55; margin:30px 0 0; }.trust { display:grid; grid-template-columns:repeat(3,1fr); }.trust-card { padding:70px max(3.5vw,30px); background:#cfe5c9; min-height:280px; }.trust-card.orange { background:var(--orange); color:white; }.trust-card span { font-size:13px; font-weight:bold; }.trust-card h3 { font-size:28px; letter-spacing:-1px; margin:65px 0 10px; }.trust-card p { line-height:1.4; max-width:250px; }
.contact { background:var(--orange); color:white; padding:95px max(7vw,36px); display:grid; grid-template-columns:1.1fr .8fr .7fr; align-items:center; gap:45px; }.contact h2 { margin-bottom:18px; }.contact > div > p:last-child { max-width:345px; line-height:1.5; }.whatsapp-card { display:block; background:var(--cream); color:var(--green); min-height:245px; padding:28px; position:relative; }.whatsapp-card span { font-size:10px; font-weight:bold; letter-spacing:1.2px; }.whatsapp-card strong { font-size:30px; display:block; line-height:1.04; margin-top:72px; letter-spacing:-1.5px; }.whatsapp-card b { position:absolute; right:25px; bottom:20px; font-size:28px; }.contact-details { display:flex; flex-direction:column; gap:13px; font-size:14px; word-break:break-word; }.contact-details a:hover { text-decoration:underline; } footer { padding:24px max(7vw,36px); background:var(--green); color:#d6ead1; display:flex; justify-content:space-between; font-size:11px; letter-spacing:1.3px; }
@media(max-width:760px) { .topbar { padding:0 20px; height:70px; }.topbar nav { display:none; }.brand strong { font-size:24px; }.hero { grid-template-columns:1fr; }.hero-copy { padding:72px 26px; }.hero h1 { letter-spacing:-2.5px; }.hero-panel { min-height:340px; padding:48px 28px; }.hero-panel strong { font-size:94px; }.intro,.method { padding:70px 26px; grid-template-columns:1fr; gap:25px; }.video-showcase { padding:70px 26px; }.video-showcase-heading { grid-template-columns:1fr; gap:18px; margin-bottom:35px; }.video-grid { grid-template-columns:1fr; }.services { padding:70px 26px; }.section-heading { display:block; }.service-grid { grid-template-columns:1fr; }.service-card,.service-card:nth-child(3n) { border-right:0; }.trust { grid-template-columns:1fr; }.contact { padding:70px 26px; grid-template-columns:1fr; gap:30px; }.hero-actions { flex-direction:column; align-items:flex-start; }.contact .whatsapp-card { max-width:360px; } footer { padding:20px 26px; } }
