/* Ramos Landscaping and More — shared production styles
   Reproduces the state/responsive styling that the approved build computed at runtime. */

/* ---------- Header ---------- */
.rl-header{position:fixed;top:0;left:0;right:0;z-index:50;background:rgba(255,255,255,0.94);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);padding:18px 0;border-bottom:1px solid #EAF2DE;transform:translateY(0);transition:padding .3s ease, box-shadow .3s ease, transform .3s ease}
.rl-header.is-scrolled{padding:10px 0;box-shadow:0 6px 24px rgba(20,60,25,0.10);border-bottom:none}
.rl-header.is-hidden{transform:translateY(-100%)}
.rl-header-inner{max-width:1360px;margin:0 auto;padding:0 clamp(24px,3vw,44px);display:flex;align-items:center;justify-content:space-between;gap:clamp(16px,2vw,32px);position:relative}
.rl-burger{background:#F0F6EC;border:none;border-radius:14px;width:46px;height:46px;display:flex;align-items:center;justify-content:center;cursor:pointer;flex:none;position:relative;z-index:1;padding:0}
.rl-logo{display:flex;align-items:center;flex:none;text-decoration:none}
.rl-logo-img{display:block;height:44px;width:auto;min-width:0;flex:none;transition:height .28s cubic-bezier(.4,0,.2,1)}
.rl-header.is-scrolled .rl-logo-img{height:34px}
.rl-logo-text{display:block;min-width:0;margin-left:12px;font-size:31px;transition:font-size .28s cubic-bezier(.4,0,.2,1)}
.rl-header.is-scrolled .rl-logo-text{font-size:26px}
.rl-logo-name{display:block;font-family:'Outfit',sans-serif;font-weight:800;color:#14481A;letter-spacing:-0.5px;line-height:0.95;font-size:inherit}
.rl-logo-sub{display:block;font-family:'Outfit',sans-serif;font-weight:800;color:#5B9E2D;text-transform:uppercase;letter-spacing:1.2px;font-size:0.32em;line-height:1.1;margin-top:0;white-space:nowrap}
.rl-nav{margin-left:auto;display:flex;align-items:center;gap:clamp(12px,1.5vw,24px)}
.rl-navlink{color:#3B5540;font-weight:700;font-size:15px;white-space:nowrap;transition:color .2s ease;text-decoration:none}
.rl-navlink:hover{color:#2E7D32}
.rl-navlink.is-active{color:#2E7D32;font-weight:800;border-bottom:2px solid #72AF40;padding-bottom:2px}
.rl-navtel{color:#3B5540;font-weight:800;font-size:15px;white-space:nowrap;display:inline-flex;align-items:center;gap:7px;transition:color .2s ease;text-decoration:none}
.rl-navtel:hover{color:#2E7D32}
.rl-navcta{background:#72AF40;color:#FFFFFF;padding:12px 24px;border-radius:999px;font-weight:800;font-size:15px;white-space:nowrap;margin-left:2px;box-shadow:0 6px 16px rgba(18,50,20,0.18);transition:transform .2s ease, filter .2s ease;text-decoration:none}
.rl-navcta:hover{transform:translateY(-2px);filter:brightness(0.94);color:#FFFFFF}
@media (min-width:1200px){.rl-burger{display:none}}
@media (max-width:1199px){
  .rl-nav{display:none}
  .rl-logo{position:absolute;left:56%;transform:translateX(-50%);max-width:calc(100% - 30px)}
  .rl-logo-img{height:42px}
  .rl-header.is-scrolled .rl-logo-img{height:36px}
  .rl-logo-text{margin-left:9px;font-size:26px}
  .rl-header.is-scrolled .rl-logo-text{font-size:23px}
}
@media (max-width:399px){
  .rl-logo-img,.rl-header.is-scrolled .rl-logo-img{height:34px}
  .rl-logo-text,.rl-header.is-scrolled .rl-logo-text{font-size:21px}
}

/* ---------- Mobile menu ---------- */
.rl-menu{position:fixed;inset:0;background:#FFFFFF;z-index:70;display:flex;flex-direction:column;padding:16px 24px 28px;overflow:auto}
.rl-menu[hidden]{display:none}
.rl-menu-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}
.rl-menu-brand{display:flex;align-items:center;gap:10px}
.rl-menu-close{background:#F0F6EC;border:none;border-radius:12px;width:46px;height:46px;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.rl-menu-nav{display:flex;flex-direction:column;gap:4px}
.rl-menu-nav a{color:#14481A;font-family:'Outfit',sans-serif;font-weight:600;font-size:17px;padding:14px 6px;border-bottom:1px solid #EAF2DE;text-decoration:none}

/* ---------- Sticky mobile CTA ---------- */
.rl-sticky{position:fixed;left:0;right:0;bottom:0;z-index:55;background:rgba(255,255,255,0.97);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid #E2EDD6;box-shadow:0 -8px 24px rgba(20,60,25,0.10);padding:10px 16px calc(10px + env(safe-area-inset-bottom));display:none;gap:10px}
.rl-sticky.is-on{display:flex}
@media (min-width:1200px){.rl-sticky.is-on{display:none}}
.rl-sticky-call{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;background:#FFFFFF;border:1.5px solid #D6E7C6;color:#2E7D32;padding:14px;border-radius:999px;font-weight:800;font-size:15.5px;white-space:nowrap;text-decoration:none}
.rl-sticky-cta{flex:1.4;display:flex;align-items:center;justify-content:center;background:#72AF40;color:#FFFFFF;padding:14px;border-radius:999px;font-weight:800;font-size:15.5px;box-shadow:0 8px 18px rgba(114,175,64,0.32);white-space:nowrap;text-decoration:none}

/* ---------- Footer ---------- */
[data-fgrid]{display:grid;gap:44px 32px;grid-template-columns:1.5fr 0.95fr 1.25fr 0.95fr 1.3fr;align-items:start}
@media (max-width:1040px){[data-fgrid]{grid-template-columns:repeat(2,minmax(0,1fr))}[data-fbrand]{grid-column:1 / -1}}
@media (max-width:560px){[data-fgrid]{grid-template-columns:minmax(0,1fr)}}
.rl-bar-spacer{height:0}
@media (max-width:1199px){.rl-bar-spacer{height:74px}}

/* ---------- Trust bar ---------- */
[data-trust-grid]{display:grid;grid-template-columns:repeat(4,1fr);text-align:center}
[data-trust-item]{display:flex;flex-direction:column;align-items:center;gap:12px;padding:clamp(28px,3.4vw,40px) 20px;position:relative}
[data-trust-div]{position:absolute;left:0;top:24%;bottom:24%;width:1px;background:linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0.34) 50%, rgba(255,255,255,0) 100%)}
[data-trust-item]:first-child [data-trust-div]{display:none}
[data-trust-icon]{width:56px;height:56px;border-radius:14px;background:rgba(255,255,255,0.10);box-shadow:inset 0 0 0 1px rgba(255,255,255,0.22), 0 8px 20px rgba(0,0,0,0.18);display:flex;align-items:center;justify-content:center;flex:none;margin-top:0;transition:transform .25s cubic-bezier(.3,.8,.3,1), background .25s ease, box-shadow .25s ease}
[data-trust-text]{display:contents}
[data-trust-title]{font-family:'Outfit',sans-serif;font-weight:700;font-size:clamp(21px,2.2vw,25px);color:#FFFFFF;line-height:1.25;letter-spacing:-0.3px;margin-bottom:0}
[data-trust-desc]{color:#AECD91;font-weight:600;font-size:14.5px;line-height:1.45;letter-spacing:0.1px}
@media (max-width:1199px){
  [data-trust-grid]{grid-template-columns:repeat(1,1fr)}
  [data-trust-item]{flex-direction:row;align-items:flex-start;gap:18px;text-align:left;padding:20px 4px}
  [data-trust-div]{left:66px;right:0;top:0;bottom:auto;width:auto;height:1px;background:rgba(255,255,255,0.16)}
  [data-trust-icon]{width:44px;height:44px;margin-top:2px}
  [data-trust-text]{display:block}
  [data-trust-title]{font-size:17px;margin-bottom:3px}
  [data-trust-desc]{font-size:13.5px}
}

/* ---------- Process step connector ---------- */
[data-step-line]{flex:1;height:2px;background:#D6E7C6}
@media (max-width:1199px){[data-step-line]{background:transparent}}

/* ---------- FAQ accordions ---------- */
[data-faq-body]{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s ease}
[data-faq-item][data-open] [data-faq-body]{grid-template-rows:1fr}
[data-faq-chev]{transform:none;transition:transform .3s ease;flex:none;color:#8AA08E}
[data-faq-item][data-open] [data-faq-chev]{transform:rotate(180deg);color:#2E7D32}
[data-faq-q]{color:#14481A;transition:color .2s ease}
[data-faq-item][data-open] [data-faq-q]{color:#2E7D32}

/* ---------- Included tabs ---------- */
[data-tab]{padding:10px 20px;border-radius:999px;cursor:pointer;border:1.5px solid #D6E7C6;background:#FFFFFF;color:#4C6552;font-weight:700;font-size:15px;font-family:'Nunito Sans',sans-serif;transition:all .25s ease}
[data-tab][aria-selected="true"]{border-color:#2E7D32;background:#2E7D32;color:#FFFFFF}

/* ---------- Work gallery ---------- */
[data-gal-stage]{position:relative;width:100%;aspect-ratio:2.405;touch-action:pan-y}
@media (max-width:639px){[data-gal-stage]{aspect-ratio:1.727}}
[data-slide]{position:absolute;top:50%;left:50%;aspect-ratio:16/11;width:56%}
@media (max-width:639px){[data-slide]{width:78%}}
[data-gal-arrow]{flex:none;width:50px;height:50px;border-radius:50%;border:1.5px solid rgba(255,255,255,0.28);background:rgba(255,255,255,0.08);cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;transition:background .2s ease, border-color .2s ease, transform .2s ease}
[data-gal-arrow]:hover{background:rgba(255,255,255,0.18);border-color:rgba(255,255,255,0.5)}
@media (max-width:639px){[data-gal-arrow]{width:42px;height:42px}}
[data-gal-dots]{display:flex;align-items:center;gap:9px}
[data-gal-dots] button{height:10px;width:10px;border-radius:999px;border:none;cursor:pointer;padding:0;background:rgba(255,255,255,0.30);transition:width .3s ease, background .3s ease, opacity .3s ease}

/* ---------- Before / after ---------- */
[data-ba-grip]{position:absolute;top:50%;width:44px;height:44px;border-radius:50%;background:#FFFFFF;box-shadow:0 6px 18px rgba(0,0,0,0.32);display:flex;align-items:center;justify-content:center;cursor:ew-resize;touch-action:none;transform:translate(-50%,-50%);left:50%}
[data-ba-divider]{position:absolute;top:0;bottom:0;left:calc(50% - 1px);width:2px;background:#FFFFFF;pointer-events:none;box-shadow:0 0 6px rgba(0,0,0,0.35)}
[data-ba-clip]{position:absolute;inset:0;clip-path:inset(0 50% 0 0)}

/* ---------- Forms ---------- */
.rl-form{display:flex;flex-direction:column;gap:16px;margin:0}
.rl-form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));gap:16px}
.rl-field{display:flex;flex-direction:column;gap:7px}
.rl-label{font-family:'Nunito Sans',sans-serif;font-size:13.5px;font-weight:800;letter-spacing:0.2px;color:#3B5540}
.rl-label em{font-style:normal;color:#72AF40;margin-left:3px}
.rl-input{width:100%;font-family:'Nunito Sans',sans-serif;font-size:15.5px;color:#14481A;background:#FFFFFF;border:1.5px solid #D6E7C6;border-radius:14px;padding:13px 15px;transition:border-color .2s ease, box-shadow .2s ease;-webkit-appearance:none;appearance:none}
select.rl-input{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%238AA08E' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:42px}
textarea.rl-input{resize:vertical;min-height:104px;line-height:1.55}
.rl-input:hover{border-color:#A9C79A}
.rl-input:focus{outline:none;border-color:#72AF40;box-shadow:0 0 0 4px rgba(114,175,64,0.14)}
.rl-input:user-invalid{border-color:#C05B4D}
.rl-submit{margin-top:4px;padding:16px 24px;border-radius:999px;border:none;background:#72AF40;color:#FFFFFF;font-family:'Outfit',sans-serif;font-weight:700;font-size:16px;cursor:pointer;box-shadow:0 12px 24px -10px rgba(114,175,64,0.5);transition:transform .18s ease, box-shadow .18s ease, filter .18s ease}
.rl-submit:hover{transform:translateY(-2px);filter:brightness(0.95);box-shadow:0 16px 30px -10px rgba(114,175,64,0.6)}
.rl-form-msg{margin:4px 0 0;font-family:'Nunito Sans',sans-serif;font-size:15px;line-height:1.55;padding:14px 16px;border-radius:14px;background:#EFF7E7;border:1px solid #D6E7C6;color:#2E7D32}
.rl-form-msg[hidden]{display:none}
.rl-form-msg.is-error{background:#FCF1EF;border-color:#EBCBC5;color:#A8412F}

/* ---------- photo hover ---------- */
.rl-zoom-img{transition:transform .55s cubic-bezier(.2,.7,.25,1),filter .4s ease}
.rl-zoom:hover .rl-zoom-img,.rl-zoom:focus-within .rl-zoom-img{transform:scale(1.06);filter:saturate(1.06) brightness(1.02)}
.rl-lift{transition:transform .45s cubic-bezier(.2,.7,.25,1),filter .4s ease,box-shadow .45s ease}
.rl-lift:hover{transform:translateY(-5px) scale(1.01);filter:saturate(1.06) brightness(1.02)}
@media (hover:none){
  .rl-zoom:hover .rl-zoom-img,.rl-lift:hover{transform:none;filter:none}
}
@media (prefers-reduced-motion:reduce){
  .rl-zoom-img,.rl-lift{transition:filter .3s ease}
  .rl-zoom:hover .rl-zoom-img,.rl-lift:hover{transform:none}
}