.woocommerce-variation-add-to-cart,form.cart{flex-wrap:wrap!important}.wapf{width:100%}.wapf-hide{display:none}.wapf-wrapper{width:100%}[data-wapf-variation-rules]{display:none}[data-wapf-variation-rules].wapf-show{display:block}.wapf-field-row{display:flex;flex-wrap:wrap;margin-left:-5px}.wapf-field-row .wapf-field-container:last-child{padding-right:0}.wapf-field-container{padding:0 5px 15px 5px;box-sizing:border-box}.wapf-field-description{font-size:85%;opacity:.8;padding:0;margin:0;padding-top:5px}.wapf-field-container label[for]{cursor:pointer}.wapf-field-input input[type=email],.wapf-field-input input[type=number],.wapf-field-input input[type=text],.wapf-field-input input[type=url],.wapf-field-input select,.wapf-field-input textarea{width:100%;box-sizing:border-box}.wapf-field-input input[type=checkbox],.wapf-field-input input[type=radio]{float:left;margin-top:5px}.wapf-input-label{font-weight:400}.wapf-label-text{padding-left:10px}.wapf-pricing-hint{opacity:.7}.wapf-product-totals{display:none;width:100%}.wapf-product-totals .wapf--inner{padding:20px 0}.wapf-product-totals .wapf--inner>div{padding-bottom:10px;clear:both}.wapf-product-totals .wapf--inner>div:last-child{padding-bottom:0}.wapf-product-totals div span:first-child{font-weight:700}.wapf-product-totals div span:last-child{float:right}.oben-awpf{--oben-awpf-cols:3;--oben-awpf-cols-mobile:1;font-family:inherit;color:var(--oben-awpf-font);}
.oben-awpf__fields{display:flex;flex-wrap:wrap;gap:var(--oben-awpf-gap);align-items:flex-end;}
.oben-awpf--vertical .oben-awpf__fields{flex-direction:column;align-items:stretch;}
.oben-awpf--align-left .oben-awpf__fields{justify-content:flex-start;}
.oben-awpf--align-center .oben-awpf__fields{justify-content:center;}
.oben-awpf--align-right .oben-awpf__fields{justify-content:flex-end;}
.oben-awpf__field{min-width:180px;flex:1;}
.oben-awpf--vertical .oben-awpf__field{width:100%;}
.oben-waf__label{display:block;margin:0 0 6px;font-weight:600;font-size:var(--oben-awpf-label-size) !important;color:var(--oben-awpf-font) !important;}
.oben-waf__select, .oben-waf__input{
width:100%;
padding:10px 12px;
border-radius:var(--oben-awpf-radius) !important;
background-color:var(--oben-awpf-field-bg) !important;
border:1px solid var(--oben-awpf-field-border) !important;
color:var(--oben-awpf-font) !important;
}
.oben-awpf__button{
padding:11px 16px;
border-radius:var(--oben-awpf-radius) !important;
background:var(--oben-awpf-button-bg) !important;
color:var(--oben-awpf-button-text) !important;
border:1px solid var(--oben-awpf-button-bg) !important;
cursor:pointer;
}
.oben-awpf-results{margin-top:16px;}
.oben-awpf-grid{display:grid;grid-template-columns:repeat(var(--oben-awpf-cols), minmax(0,1fr));gap:14px;}
@media (max-width: 767px){
.oben-awpf-grid{grid-template-columns:repeat(var(--oben-awpf-cols-mobile, 1), minmax(0,1fr));}
}
.oben-awpf-card{border:1px solid #e6e6e6;border-radius:14px;padding:12px;background:#fff;}
.oben-awpf-card h3{margin:10px 0 0;font-size:16px;}
.oben-awpf-thumb img{width:100%;height:auto;display:block;border-radius:12px;}
.oben-awpf-table{width:100%;border-collapse:collapse;}
.oben-awpf-table th,.oben-awpf-table td{border:1px solid #e6e6e6;padding:10px;} .oben-awpf-tablelist{display:flex;flex-direction:column;gap:10px;}
.oben-awpf-tablerow{display:grid;grid-template-columns:120px 1fr auto;gap:14px;align-items:center;padding:14px 14px;border:1px solid #e6e6e6;border-radius:8px;background:#fff;}
.oben-awpf-tablerow:hover{border-color:#cfe0ff;}
.oben-awpf-tablerow__thumb img{width:120px;height:80px;object-fit:cover;border-radius:6px;display:block;}
.oben-awpf-tablerow--no-thumb{grid-template-columns:1fr auto;}
.oben-awpf-tablerow__title{font-weight:600;text-decoration:none;display:inline-block;margin-bottom:4px;}
.oben-awpf-tablerow__meta{display:flex;flex-wrap:wrap;gap:8px 12px;font-size:13px;color:#50575e;}
.oben-awpf-tablerow__meta span strong{color:#111;}
.oben-awpf-tablerow__excerpt{margin-top:6px;font-size:13px;color:#50575e;}
.oben-awpf-tablerow__action a{white-space:nowrap;text-decoration:none;padding:8px 12px;border:1px solid #c3c4c7;border-radius:999px;display:inline-block;}
.oben-awpf-tablerow__action a:hover{border-color:#2271b1;color:#2271b1;}
@media (max-width: 640px){
.oben-awpf-tablerow{grid-template-columns:1fr;align-items:start;}
.oben-awpf-tablerow__thumb img{width:100%;height:180px;}
.oben-awpf-tablerow__action{margin-top:8px;}
}
.oben-awpf-pagination ul{display:flex;gap:8px;flex-wrap:wrap;list-style:none;padding:0;margin:14px 0;}
.oben-awpf-pagination a, .oben-awpf-pagination span{display:inline-block;padding:8px 10px;border:1px solid #e6e6e6;border-radius:10px;}
.oben-awpf-cardfields{margin:10px 0 0;padding:0;list-style:none;font-size:14px;opacity:.9}
.oben-awpf-cardfields li{margin:4px 0}
.oben-awpf-cardfields__label{font-weight:600} .oben-awpf-loader-overlay{
position:fixed;
inset:0;
display:none;
align-items:center;
justify-content:center;
z-index:999999;
background:rgba(10,12,16,.42);
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px);
} .oben-awpf-loader-overlay--main{
position:fixed;
}
.oben-awpf-loader-overlay--refine{
position:fixed;
inset:0;
z-index:999999;
} .oben-awpf-results-main{
position:relative;
}
.oben-awpf-loader-overlay.is-active{ display:flex; }
.oben-awpf-loader-overlay.is-visible{ display:flex; }
.oben-awpf-loader-box{
width:min(520px, calc(100vw - 32px));
padding:22px 22px 18px;
border-radius:18px;
background:rgba(255,255,255,.12);
border:1px solid rgba(255,255,255,.18);
box-shadow: 0 10px 40px rgba(0,0,0,.25);
text-align:center;
}
.oben-awpf-loader-text{
margin-top:14px;
font-size:15px;
line-height:1.3;
color:rgba(255,255,255,.92);
font-weight:600;
letter-spacing:.2px;
} .oben-awpf-loader-anim{ display:none; }
.oben-awpf-loader-overlay.oben-awpf-loader-style-siri .oben-awpf-loader-anim--siri{ display:flex; }
.oben-awpf-loader-overlay.oben-awpf-loader-style-spinner .oben-awpf-loader-anim--spinner{ display:block; }
.oben-awpf-loader-anim--siri{
height:44px;
gap:10px;
align-items:flex-end;
justify-content:center;
filter: drop-shadow(0 10px 18px rgba(0,0,0,.25));
}
.oben-awpf-loader-anim--siri span{
width:8px;
border-radius:999px;
background:rgba(255,255,255,.9);
transform-origin: bottom;
animation: awpfSiri 1.1s ease-in-out infinite;
}
.oben-awpf-loader-anim--siri span:nth-child(1){ animation-delay: 0s; }
.oben-awpf-loader-anim--siri span:nth-child(2){ animation-delay: .12s; }
.oben-awpf-loader-anim--siri span:nth-child(3){ animation-delay: .24s; }
.oben-awpf-loader-anim--siri span:nth-child(4){ animation-delay: .36s; }
.oben-awpf-loader-anim--siri span:nth-child(5){ animation-delay: .48s; }
@keyframes awpfSiri{
0%{ height:10px; opacity:.55; }
25%{ height:40px; opacity:1; }
50%{ height:14px; opacity:.7; }
75%{ height:34px; opacity:1; }
100%{ height:10px; opacity:.55; }
} .oben-awpf-loader-anim--spinner{
width:44px;
height:44px;
margin:0 auto;
}
.oben-awpf-loader-anim--spinner div{
width:44px;
height:44px;
border-radius:999px;
border:3px solid rgba(255,255,255,.25);
border-top-color: rgba(255,255,255,.92);
animation: awpfSpin .9s linear infinite;
}
@keyframes awpfSpin{
to{ transform:rotate(360deg); }
} .oben-awpf-loadmore-wrap{display:flex;justify-content:center;gap:10px;margin:18px 0;}
.oben-awpf-loadmore-btn{padding:10px 18px;border-radius:999px;border:1px solid currentColor;background:transparent;cursor:pointer;font:inherit;}
.oben-awpf-loadmore-btn.is-loading{opacity:.7;cursor:wait;}
.oben-awpf-loadmore-btn.is-loading:after{content:" …";}
.oben-awpf-count{margin:10px 0;font-size:14px;opacity:.85;text-align:left;}
.oben-awpf-count--bottom{text-align:center;margin-top:18px;} .oben-awpf-results-layout{display:grid;grid-template-columns:320px 1fr;gap:24px;align-items:start}
.oben-awpf-results-sidebar{position:sticky;top:var(--oben-awpf-sticky-top,24px)}
.oben-awpf-sidebar-title{margin:0 0 12px 0;font-size:18px;font-weight:700}
.oben-awpf-refine-form{background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:8px;padding:14px}
.oben-awpf-refine-form .oben-awpf-fields{margin:0}
.oben-awpf-refine-form .oben-awpf-actions{display:flex;gap:10px;align-items:center;margin-top:12px}
.oben-awpf-refine-btn{padding:10px 14px;border-radius:6px;border:1px solid rgba(0,0,0,.2);background:#f5f5f5;cursor:pointer;font:inherit}
.oben-awpf-refine-btn:hover{filter:brightness(.98)}
.oben-awpf-refine-clear{font-size:13px;opacity:.85;text-decoration:underline}
@media (max-width: 900px){
.oben-awpf-results-layout{grid-template-columns:1fr}
.oben-awpf-results-sidebar{position:static}
} .oben-awpf-results-layout .elementor-icon-wrapper,
.oben-awpf-results-layout .elementor-icon {
line-height: 1;
}
.oben-awpf-results-layout .elementor-widget-icon .elementor-icon {
font-size: 24px !important;
}
.oben-awpf-results-layout .elementor-icon svg {
width: 1em !important;
height: 1em !important;
max-width: 1em !important;
max-height: 1em !important;
display: inline-block !important;
} .oben-awpf-results .elementor-icon-list-items,
.oben-awpf-results .elementor-icon-list-item{
list-style: none !important;
}
.oben-awpf-results .elementor-icon-list-items{
padding-left: 0 !important;
margin-left: 0 !important;
padding-bottom: 0 !important;
}
.oben-awpf-results .elementor-icon-list-icon{
display: inline-flex;
align-items: center;
justify-content: center;
}
.oben-awpf-results .elementor-icon-list-icon svg,
.oben-awpf-results .e-font-icon-svg{
width: 1em !important;
height: 1em !important;
max-width: 1em !important;
max-height: 1em !important;
flex: 0 0 1em !important;
} .oben-awpf-results-wrap.awpf-is-loading .oben-awpf-results{
opacity: .35;
filter: grayscale(.15);
transition: opacity .18s ease, filter .18s ease;
}
.oben-awpf-results-wrap.awpf-is-loading{
position: relative;
}
.oben-awpf-skeleton{
position: absolute;
inset: 0;
padding: 10px 0;
pointer-events: none;
}
.oben-awpf-skeleton-grid{
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 16px;
}
@media (max-width: 1024px){
.oben-awpf-skeleton-grid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px){
.oben-awpf-skeleton-grid{ grid-template-columns: 1fr; }
}
.oben-awpf-skeleton-card,
.oben-awpf-skeleton-row{
border-radius: 10px;
background: #f3f5f8;
overflow: hidden;
position: relative;
}
.oben-awpf-skeleton-card{ height: 260px; }
.oben-awpf-skeleton-row{ height: 52px; margin-bottom: 10px; }
.oben-awpf-skeleton-card::before,
.oben-awpf-skeleton-row::before{
content: '';
position: absolute;
inset: 0;
background: linear-gradient(90deg, rgba(243,245,248,0) 0%, rgba(230,234,240,.9) 50%, rgba(243,245,248,0) 100%);
transform: translateX(-100%);
animation: obenAwpfShimmer 1.05s linear infinite;
}
@keyframes obenAwpfShimmer{
0%{ transform: translateX(-100%); }
100%{ transform: translateX(100%); }
} .oben-awpf-results.awpf-animate-in{
animation: obenAwpfFadeUp .22s ease both;
}
@keyframes obenAwpfFadeUp{
from{ opacity: 0; transform: translateY(8px); }
to{ opacity: 1; transform: translateY(0); }
} .oben-awpf-checklist{
display:flex;
flex-direction:column;
gap:8px;
margin-top:6px;
}
.oben-awpf-check{
display:flex;
align-items:center;
gap:8px;
font-size:14px;
line-height:1.2;
}
.oben-awpf-check input[type="checkbox"]{
width:16px;
height:16px;
} .oben-awpf-results .elementor-icon-list-items{ padding-bottom:0 !important; }
.oben-awpf-results .elementor-icon-list-items,
.oben-awpf-results .elementor-icon-list-item{ list-style:none !important; }  .oben-awpf-loader-overlay{
position: fixed;
inset: 0;
z-index: 999999;
background: rgba(0,0,0,.35);
display: none;
align-items: center;
justify-content: center;
}
.oben-awpf-loader-overlay.is-visible{ display:flex; }
.oben-awpf-loader-inner{color:#fff;
min-width: 220px;
max-width: 90vw;
padding: 18px 20px;
border-radius: 10px;
background: rgba(255,255,255,.95);
box-shadow: 0 10px 30px rgba(0,0,0,.25);
text-align: center;
}
.oben-awpf-loader-anim-wrap{ margin-bottom: 10px; }
.oben-awpf-loader-text{ font-size: 14px; line-height: 1.3; } .oben-awpf-loader-anim--classic{
width: 44px;
height: 44px;
border-radius: 50%;
border: 4px solid rgba(0,0,0,.15);
border-top-color: rgba(0,0,0,.65);
margin: 0 auto;
animation: oben-awpf-spin 0.9s linear infinite;
}
@keyframes oben-awpf-spin{ to{ transform: rotate(360deg);} } .oben-awpf-loader-anim--dots{
display: inline-flex;
gap: 6px;
align-items: center;
justify-content: center;
height: 18px;
}
.oben-awpf-loader-anim--dots span{
width: 8px;
height: 8px;
border-radius: 50%;
background: rgba(0,0,0,.6);
animation: oben-awpf-bounce 0.8s infinite ease-in-out;
}
.oben-awpf-loader-anim--dots span:nth-child(2){ animation-delay: .12s; }
.oben-awpf-loader-anim--dots span:nth-child(3){ animation-delay: .24s; }
@keyframes oben-awpf-bounce{
0%, 80%, 100%{ transform: translateY(0); opacity:.35; }
40%{ transform: translateY(-6px); opacity:1; }
} .oben-awpf-loader-anim--siri{
display: inline-flex;
gap: 4px;
align-items: flex-end;
justify-content: center;
height: 22px;
}
.oben-awpf-loader-anim--siri span{
width: 4px;
height: 8px;
border-radius: 2px;
background: rgba(0,0,0,.6);
animation: oben-awpf-bars 0.9s infinite ease-in-out;
}
.oben-awpf-loader-anim--siri span:nth-child(1){ animation-delay: 0s; }
.oben-awpf-loader-anim--siri span:nth-child(2){ animation-delay: .08s; }
.oben-awpf-loader-anim--siri span:nth-child(3){ animation-delay: .16s; }
.oben-awpf-loader-anim--siri span:nth-child(4){ animation-delay: .24s; }
@keyframes oben-awpf-bars{
0%, 100%{ height: 7px; opacity:.35; }
50%{ height: 20px; opacity:1; }
}
.oben-awpf-overlay{
position: fixed;
inset: 0;
z-index: 999999;
background: rgba(0,0,0,.35);
display: flex;
align-items: center;
justify-content: center;
padding: 24px;
}
.oben-awpf-overlay[hidden]{
display: none !important;
}
.oben-awpf-overlay__inner{
display: grid;
gap: 12px;
justify-items: center;
text-align: center; background: rgba(0,0,0,.55);
color: #fff;
padding: 18px 24px;
border-radius: 12px;
box-shadow: 0 8px 30px rgba(0,0,0,.25);
}
.oben-awpf-overlay__text{
color: #fff;
font-size: 15px;
line-height: 1.3;
text-shadow: 0 1px 2px rgba(0,0,0,.4);
}
.oben-awpf-overlay__anim{
width: 56px;
height: 56px;
} .oben-awpf-overlay__anim.is-classic{
border: 4px solid rgba(255,255,255,.35);
border-top-color: rgba(255,255,255,1);
border-radius: 50%;
animation: oben-awpf-spin 0.9s linear infinite;
}
@keyframes oben-awpf-spin{
to { transform: rotate(360deg); }
} .oben-awpf-overlay__anim.is-dots{
display: flex;
align-items: center;
justify-content: center;
gap: 6px;
}
.oben-awpf-overlay__anim.is-dots span{
width: 10px;
height: 10px;
border-radius: 999px;
background: rgba(255,255,255,1);
opacity: .35;
animation: oben-awpf-dot 1s ease-in-out infinite;
}
.oben-awpf-overlay__anim.is-dots span:nth-child(2){ animation-delay: .15s; }
.oben-awpf-overlay__anim.is-dots span:nth-child(3){ animation-delay: .3s; }
@keyframes oben-awpf-dot{
0%, 100% { transform: translateY(0); opacity: .35; }
50% { transform: translateY(-6px); opacity: 1; }
} .oben-awpf-overlay__anim.is-siri{
display: flex;
align-items: flex-end;
justify-content: center;
gap: 4px;
}
.oben-awpf-overlay__anim.is-siri span{
width: 6px;
height: 14px;
border-radius: 999px;
background: rgba(255,255,255,1);
opacity: .45;
animation: oben-awpf-bar 0.9s ease-in-out infinite;
}
.oben-awpf-overlay__anim.is-siri span:nth-child(2){ animation-delay: .1s; }
.oben-awpf-overlay__anim.is-siri span:nth-child(3){ animation-delay: .2s; }
.oben-awpf-overlay__anim.is-siri span:nth-child(4){ animation-delay: .3s; }
.oben-awpf-overlay__anim.is-siri span:nth-child(5){ animation-delay: .4s; }
@keyframes oben-awpf-bar{
0%, 100% { height: 14px; opacity: .35; }
50% { height: 34px; opacity: 1; }
} #oben-awpf-global-loader.oben-awpf-loader-overlay,
.oben-awpf-loader-overlay{ }
.oben-awpf-loader-inner{
width:min(520px, calc(100vw - 32px));
padding:22px 22px 18px;
border-radius:18px;
background:#000 !important;
border:1px solid rgba(255,255,255,.18);
box-shadow: 0 10px 40px rgba(0,0,0,.35);
text-align:center;
}
.oben-awpf-loader-text{
margin-top:14px;
font-size:15px;
line-height:1.35;
color:#fff !important;
font-weight:600;
letter-spacing:.2px;
} .oben-awpf-loader-anim{
display:flex !important;
align-items:center;
justify-content:center;
} .oben-awpf-loader-anim--spinner{
width:44px;
height:44px;
margin:0 auto;
border-radius:999px;
border:3px solid rgba(255,255,255,.25);
border-top-color: rgba(255,255,255,.92);
animation: awpfSpin .9s linear infinite;
} .oben-awpf-loader-anim--siri{
width:48px;
height:48px;
margin:0 auto;
position:relative;
transform: rotateZ(45deg);
perspective: 1000px;
border-radius: 50%;
color:#fff;
} .oben-awpf-loader-anim--siri > span{ display:none !important; }
.oben-awpf-loader-anim--siri::before,
.oben-awpf-loader-anim--siri::after{
content:'';
display:block;
position:absolute;
top:0; left:0;
width:inherit; height:inherit;
border-radius:50%;
transform: rotateX(70deg);
animation: awpfSiri3D 1s linear infinite;
}
.oben-awpf-loader-anim--siri::after{
color:#FF3D00;
transform: rotateY(70deg);
animation-delay:.4s;
}
@keyframes awpfSiri3D{
0%,100%{ box-shadow: .2em 0px 0 0px currentcolor; }
12%{ box-shadow: .2em .2em 0 0 currentcolor; }
25%{ box-shadow: 0 .2em 0 0px currentcolor; }
37%{ box-shadow: -.2em .2em 0 0 currentcolor; }
50%{ box-shadow: -.2em 0 0 0 currentcolor; }
62%{ box-shadow: -.2em -.2em 0 0 currentcolor; }
75%{ box-shadow: 0px -.2em 0 0 currentcolor; }
87%{ box-shadow: .2em -.2em 0 0 currentcolor; }
} .oben-awpf-refine-search{margin-bottom:12px}
.oben-awpf-refine-search__input{width:100%;box-sizing:border-box;padding:10px 12px;border:1px solid #d0d7de;border-radius:6px;font-size:15px}
.oben-awpf-refine-search__input:focus{outline:0;border-color:#8c9aa8;box-shadow:0 0 0 2px rgba(30,136,229,.12)} .oben-awpf__field--ui-checkboxes .oben-awpf__choices{
display:block;
padding:6px 0 0;
}
.oben-awpf__choice{
display:flex;
align-items:center;
gap:8px;
padding:6px 0;
font-size:14px;
line-height:1.2;
}
.oben-awpf__choice input[type="checkbox"]{
width:16px;
height:16px;
margin:0;
}
.oben-awpf__field--ui-checkboxes .oben-waf__label{
margin-bottom:6px;
display:block;
} .oben-awpf-refine-top{
display:flex;
justify-content:flex-end;
margin:0 0 10px;
}
.oben-awpf-refine-clear-btn{
background:transparent;
border:0;
padding:0;
font:inherit;
cursor:pointer;
text-decoration:underline;
opacity:.85;
}
.oben-awpf-refine-clear-btn:hover{opacity:1}
.oben-awpf__section{
border:1px solid rgba(0,0,0,.10);
border-radius:8px;
margin:10px 0;
overflow:hidden;
}
.oben-awpf__sectionhead{
width:100%;
display:flex;
align-items:center;
justify-content:space-between;
gap:10px;
padding:12px;
background:#fff;
border:0;
cursor:pointer;
font:inherit;
}
.oben-awpf__sectiontitle{
font-weight:700;
text-transform:uppercase;
letter-spacing:.02em;
font-size:12px;
opacity:.95;
}
.oben-awpf__sectioncount{
min-width:20px;
height:20px;
line-height:20px;
text-align:center;
border-radius:999px;
border:1px solid rgba(0,0,0,.18);
font-size:12px;
padding:0 6px;
opacity:.85;
}
.oben-awpf__sectionchev{
width:10px;height:10px;
border-right:2px solid currentcolor;
border-bottom:2px solid currentcolor;
transform:rotate(45deg);
opacity:.7;
transition:transform .18s ease;
}
.oben-awpf__sectionhead[aria-expanded="true"] .oben-awpf__sectionchev{
transform:rotate(-135deg);
}
.oben-awpf__sectionbody{
padding:8px 12px 10px;
border-top:1px solid rgba(0,0,0,.08);
}
.oben-awpf__sectionbody .oben-awpf__field{ margin:0; } .oben-awpf-results-topbar{
display:flex;
justify-content:flex-end;
align-items:center;
margin: 0 0 16px;
}
.oben-awpf-sort-form{
display:flex;
align-items:center;
gap:12px;
}
.oben-awpf-sort-label{
font-weight:600;
}
.oben-awpf-sort-select{
min-width: 220px;
padding: 10px 12px;
border:1px solid rgba(0,0,0,.18);
border-radius: 8px;
background:#fff;
}.pvc_clear{clear:both}.clear{clear:both}.nobr{white-space:nowrap}.pvc_stats{float:left;padding:5px!important}.pvc_stats.total_only .views_today{display:none}.pvc_stats .pvc-stats-icon{vertical-align:middle}.pvc_stats .pvc-stats-icon svg{display:initial}.pvc_stats .pvc-stats-icon.small svg{width:18px}.pvc_stats .pvc-stats-icon.medium svg{width:24px}.pvc_stats .pvc-stats-icon.large svg{width:30px}.leaflet-pane,
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-tile-container,
.leaflet-pane > svg,
.leaflet-pane > canvas,
.leaflet-zoom-box,
.leaflet-image-layer,
.leaflet-layer {
position: absolute;
left: 0;
top: 0;
}
.leaflet-container {
overflow: hidden;
}
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow {
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
-webkit-user-drag: none;
} .leaflet-tile::selection {
background: transparent;
} .leaflet-safari .leaflet-tile {
image-rendering: -webkit-optimize-contrast;
} .leaflet-safari .leaflet-tile-container {
width: 1600px;
height: 1600px;
-webkit-transform-origin: 0 0;
}
.leaflet-marker-icon,
.leaflet-marker-shadow {
display: block;
}  .leaflet-container .leaflet-overlay-pane svg {
max-width: none !important;
max-height: none !important;
}
.leaflet-container .leaflet-marker-pane img,
.leaflet-container .leaflet-shadow-pane img,
.leaflet-container .leaflet-tile-pane img,
.leaflet-container img.leaflet-image-layer,
.leaflet-container .leaflet-tile {
max-width: none !important;
max-height: none !important;
width: auto;
padding: 0;
}
.leaflet-container img.leaflet-tile { mix-blend-mode: plus-lighter;
}
.leaflet-container.leaflet-touch-zoom {
-ms-touch-action: pan-x pan-y;
touch-action: pan-x pan-y;
}
.leaflet-container.leaflet-touch-drag {
-ms-touch-action: pinch-zoom; touch-action: none;
touch-action: pinch-zoom;
}
.leaflet-container.leaflet-touch-drag.leaflet-touch-zoom {
-ms-touch-action: none;
touch-action: none;
}
.leaflet-container {
-webkit-tap-highlight-color: transparent;
}
.leaflet-container a {
-webkit-tap-highlight-color: rgba(51, 181, 229, 0.4);
}
.leaflet-tile {
filter: inherit;
visibility: hidden;
}
.leaflet-tile-loaded {
visibility: inherit;
}
.leaflet-zoom-box {
width: 0;
height: 0;
-moz-box-sizing: border-box;
box-sizing: border-box;
z-index: 800;
} .leaflet-overlay-pane svg {
-moz-user-select: none;
}
.leaflet-pane         { z-index: 400; }
.leaflet-tile-pane    { z-index: 200; }
.leaflet-overlay-pane { z-index: 400; }
.leaflet-shadow-pane  { z-index: 500; }
.leaflet-marker-pane  { z-index: 600; }
.leaflet-tooltip-pane   { z-index: 650; }
.leaflet-popup-pane   { z-index: 700; }
.leaflet-map-pane canvas { z-index: 100; }
.leaflet-map-pane svg    { z-index: 200; }
.leaflet-vml-shape {
width: 1px;
height: 1px;
}
.lvml {
behavior: url(#default#VML);
display: inline-block;
position: absolute;
} .leaflet-control {
position: relative;
z-index: 800;
pointer-events: visiblePainted; pointer-events: auto;
}
.leaflet-top,
.leaflet-bottom {
position: absolute;
z-index: 1000;
pointer-events: none;
}
.leaflet-top {
top: 0;
}
.leaflet-right {
right: 0;
}
.leaflet-bottom {
bottom: 0;
}
.leaflet-left {
left: 0;
}
.leaflet-control {
float: left;
clear: both;
}
.leaflet-right .leaflet-control {
float: right;
}
.leaflet-top .leaflet-control {
margin-top: 10px;
}
.leaflet-bottom .leaflet-control {
margin-bottom: 10px;
}
.leaflet-left .leaflet-control {
margin-left: 10px;
}
.leaflet-right .leaflet-control {
margin-right: 10px;
} .leaflet-fade-anim .leaflet-popup {
opacity: 0;
-webkit-transition: opacity 0.2s linear;
-moz-transition: opacity 0.2s linear;
transition: opacity 0.2s linear;
}
.leaflet-fade-anim .leaflet-map-pane .leaflet-popup {
opacity: 1;
}
.leaflet-zoom-animated {
-webkit-transform-origin: 0 0;
-ms-transform-origin: 0 0;
transform-origin: 0 0;
}
svg.leaflet-zoom-animated {
will-change: transform;
}
.leaflet-zoom-anim .leaflet-zoom-animated {
-webkit-transition: -webkit-transform 0.25s cubic-bezier(0,0,0.25,1);
-moz-transition:    -moz-transform 0.25s cubic-bezier(0,0,0.25,1);
transition:         transform 0.25s cubic-bezier(0,0,0.25,1);
}
.leaflet-zoom-anim .leaflet-tile,
.leaflet-pan-anim .leaflet-tile {
-webkit-transition: none;
-moz-transition: none;
transition: none;
}
.leaflet-zoom-anim .leaflet-zoom-hide {
visibility: hidden;
} .leaflet-interactive {
cursor: pointer;
}
.leaflet-grab {
cursor: -webkit-grab;
cursor:    -moz-grab;
cursor:         grab;
}
.leaflet-crosshair,
.leaflet-crosshair .leaflet-interactive {
cursor: crosshair;
}
.leaflet-popup-pane,
.leaflet-control {
cursor: auto;
}
.leaflet-dragging .leaflet-grab,
.leaflet-dragging .leaflet-grab .leaflet-interactive,
.leaflet-dragging .leaflet-marker-draggable {
cursor: move;
cursor: -webkit-grabbing;
cursor:    -moz-grabbing;
cursor:         grabbing;
} .leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-image-layer,
.leaflet-pane > svg path,
.leaflet-tile-container {
pointer-events: none;
}
.leaflet-marker-icon.leaflet-interactive,
.leaflet-image-layer.leaflet-interactive,
.leaflet-pane > svg path.leaflet-interactive,
svg.leaflet-image-layer.leaflet-interactive path {
pointer-events: visiblePainted; pointer-events: auto;
} .leaflet-container {
background: #ddd;
outline-offset: 1px;
}
.leaflet-container a {
color: #0078A8;
}
.leaflet-zoom-box {
border: 2px dotted #38f;
background: rgba(255,255,255,0.5);
} .leaflet-container {
font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
font-size: 12px;
font-size: 0.75rem;
line-height: 1.5;
} .leaflet-bar {
box-shadow: 0 1px 5px rgba(0,0,0,0.65);
border-radius: 4px;
}
.leaflet-bar a {
background-color: #fff;
border-bottom: 1px solid #ccc;
width: 26px;
height: 26px;
line-height: 26px;
display: block;
text-align: center;
text-decoration: none;
color: black;
}
.leaflet-bar a,
.leaflet-control-layers-toggle {
background-position: 50% 50%;
background-repeat: no-repeat;
display: block;
}
.leaflet-bar a:hover,
.leaflet-bar a:focus {
background-color: #f4f4f4;
}
.leaflet-bar a:first-child {
border-top-left-radius: 4px;
border-top-right-radius: 4px;
}
.leaflet-bar a:last-child {
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
border-bottom: none;
}
.leaflet-bar a.leaflet-disabled {
cursor: default;
background-color: #f4f4f4;
color: #bbb;
}
.leaflet-touch .leaflet-bar a {
width: 30px;
height: 30px;
line-height: 30px;
}
.leaflet-touch .leaflet-bar a:first-child {
border-top-left-radius: 2px;
border-top-right-radius: 2px;
}
.leaflet-touch .leaflet-bar a:last-child {
border-bottom-left-radius: 2px;
border-bottom-right-radius: 2px;
} .leaflet-control-zoom-in,
.leaflet-control-zoom-out {
font: bold 18px 'Lucida Console', Monaco, monospace;
text-indent: 1px;
}
.leaflet-touch .leaflet-control-zoom-in, .leaflet-touch .leaflet-control-zoom-out  {
font-size: 22px;
} .leaflet-control-layers {
box-shadow: 0 1px 5px rgba(0,0,0,0.4);
background: #fff;
border-radius: 5px;
}
.leaflet-control-layers-toggle {
background-image: url(//sierradeguadarrama.online/wp-content/plugins/sg-red-ayuda/assets/vendor/leaflet/images/layers.png);
width: 36px;
height: 36px;
}
.leaflet-retina .leaflet-control-layers-toggle {
background-image: url(//sierradeguadarrama.online/wp-content/plugins/sg-red-ayuda/assets/vendor/leaflet/images/layers-2x.png);
background-size: 26px 26px;
}
.leaflet-touch .leaflet-control-layers-toggle {
width: 44px;
height: 44px;
}
.leaflet-control-layers .leaflet-control-layers-list,
.leaflet-control-layers-expanded .leaflet-control-layers-toggle {
display: none;
}
.leaflet-control-layers-expanded .leaflet-control-layers-list {
display: block;
position: relative;
}
.leaflet-control-layers-expanded {
padding: 6px 10px 6px 6px;
color: #333;
background: #fff;
}
.leaflet-control-layers-scrollbar {
overflow-y: scroll;
overflow-x: hidden;
padding-right: 5px;
}
.leaflet-control-layers-selector {
margin-top: 2px;
position: relative;
top: 1px;
}
.leaflet-control-layers label {
display: block;
font-size: 13px;
font-size: 1.08333em;
}
.leaflet-control-layers-separator {
height: 0;
border-top: 1px solid #ddd;
margin: 5px -10px 5px -6px;
} .leaflet-default-icon-path { background-image: url(//sierradeguadarrama.online/wp-content/plugins/sg-red-ayuda/assets/vendor/leaflet/images/marker-icon.png);
} .leaflet-container .leaflet-control-attribution {
background: #fff;
background: rgba(255, 255, 255, 0.8);
margin: 0;
}
.leaflet-control-attribution,
.leaflet-control-scale-line {
padding: 0 5px;
color: #333;
line-height: 1.4;
}
.leaflet-control-attribution a {
text-decoration: none;
}
.leaflet-control-attribution a:hover,
.leaflet-control-attribution a:focus {
text-decoration: underline;
}
.leaflet-attribution-flag {
display: inline !important;
vertical-align: baseline !important;
width: 1em;
height: 0.6669em;
}
.leaflet-left .leaflet-control-scale {
margin-left: 5px;
}
.leaflet-bottom .leaflet-control-scale {
margin-bottom: 5px;
}
.leaflet-control-scale-line {
border: 2px solid #777;
border-top: none;
line-height: 1.1;
padding: 2px 5px 1px;
white-space: nowrap;
-moz-box-sizing: border-box;
box-sizing: border-box;
background: rgba(255, 255, 255, 0.8);
text-shadow: 1px 1px #fff;
}
.leaflet-control-scale-line:not(:first-child) {
border-top: 2px solid #777;
border-bottom: none;
margin-top: -2px;
}
.leaflet-control-scale-line:not(:first-child):not(:last-child) {
border-bottom: 2px solid #777;
}
.leaflet-touch .leaflet-control-attribution,
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
box-shadow: none;
}
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
border: 2px solid rgba(0,0,0,0.2);
background-clip: padding-box;
} .leaflet-popup {
position: absolute;
text-align: center;
margin-bottom: 20px;
}
.leaflet-popup-content-wrapper {
padding: 1px;
text-align: left;
border-radius: 12px;
}
.leaflet-popup-content {
margin: 13px 24px 13px 20px;
line-height: 1.3;
font-size: 13px;
font-size: 1.08333em;
min-height: 1px;
}
.leaflet-popup-content p {
margin: 17px 0;
margin: 1.3em 0;
}
.leaflet-popup-tip-container {
width: 40px;
height: 20px;
position: absolute;
left: 50%;
margin-top: -1px;
margin-left: -20px;
overflow: hidden;
pointer-events: none;
}
.leaflet-popup-tip {
width: 17px;
height: 17px;
padding: 1px;
margin: -10px auto 0;
pointer-events: auto;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
background: white;
color: #333;
box-shadow: 0 3px 14px rgba(0,0,0,0.4);
}
.leaflet-container a.leaflet-popup-close-button {
position: absolute;
top: 0;
right: 0;
border: none;
text-align: center;
width: 24px;
height: 24px;
font: 16px/24px Tahoma, Verdana, sans-serif;
color: #757575;
text-decoration: none;
background: transparent;
}
.leaflet-container a.leaflet-popup-close-button:hover,
.leaflet-container a.leaflet-popup-close-button:focus {
color: #585858;
}
.leaflet-popup-scrolled {
overflow: auto;
}
.leaflet-oldie .leaflet-popup-content-wrapper {
-ms-zoom: 1;
}
.leaflet-oldie .leaflet-popup-tip {
width: 24px;
margin: 0 auto;
-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)";
filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678);
}
.leaflet-oldie .leaflet-control-zoom,
.leaflet-oldie .leaflet-control-layers,
.leaflet-oldie .leaflet-popup-content-wrapper,
.leaflet-oldie .leaflet-popup-tip {
border: 1px solid #999;
} .leaflet-div-icon {
background: #fff;
border: 1px solid #666;
}  .leaflet-tooltip {
position: absolute;
padding: 6px;
background-color: #fff;
border: 1px solid #fff;
border-radius: 3px;
color: #222;
white-space: nowrap;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
pointer-events: none;
box-shadow: 0 1px 3px rgba(0,0,0,0.4);
}
.leaflet-tooltip.leaflet-interactive {
cursor: pointer;
pointer-events: auto;
}
.leaflet-tooltip-top:before,
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
position: absolute;
pointer-events: none;
border: 6px solid transparent;
background: transparent;
content: "";
} .leaflet-tooltip-bottom {
margin-top: 6px;
}
.leaflet-tooltip-top {
margin-top: -6px;
}
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-top:before {
left: 50%;
margin-left: -6px;
}
.leaflet-tooltip-top:before {
bottom: 0;
margin-bottom: -12px;
border-top-color: #fff;
}
.leaflet-tooltip-bottom:before {
top: 0;
margin-top: -12px;
margin-left: -6px;
border-bottom-color: #fff;
}
.leaflet-tooltip-left {
margin-left: -6px;
}
.leaflet-tooltip-right {
margin-left: 6px;
}
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
top: 50%;
margin-top: -6px;
}
.leaflet-tooltip-left:before {
right: 0;
margin-right: -12px;
border-left-color: #fff;
}
.leaflet-tooltip-right:before {
left: 0;
margin-left: -12px;
border-right-color: #fff;
} @media print { .leaflet-control {
-webkit-print-color-adjust: exact;
print-color-adjust: exact;
}
}.sgra-root {
--sgra-pine-950: #0f2e28;
--sgra-pine-900: #173b32;
--sgra-pine-800: #245447;
--sgra-pine-700: #31695a;
--sgra-sage: #e4ebe4;
--sgra-ivory: #f7f4ed;
--sgra-paper: #fffdf8;
--sgra-ink: #18201d;
--sgra-muted: #68736e;
--sgra-line: #d6ded9;
--sgra-emergency: #d55532;
--sgra-need: #a64532;
position: relative;
isolation: isolate;
width: 100vw;
max-width: none !important;
margin-right: calc(50% - 50vw);
margin-left: calc(50% - 50vw);
overflow: hidden;
background: var(--sgra-ivory);
color: var(--sgra-ink);
font-family: Inter, Manrope, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
font-size: 16px;
line-height: 1.5;
} .elementor-widget-shortcode:has(.sgra-root),
.elementor-widget-shortcode:has(.sgra-root) > .elementor-widget-container {
width: 100% !important;
max-width: none !important;
}
.sgra-root *,
.sgra-root *::before,
.sgra-root *::after {
box-sizing: border-box;
}
.sgra-root button,
.sgra-root input,
.sgra-root select,
.sgra-root textarea {
font: inherit;
}
.sgra-root button:focus-visible,
.sgra-root a:focus-visible,
.sgra-root input:focus-visible,
.sgra-root select:focus-visible,
.sgra-root textarea:focus-visible {
outline: 3px solid #e89a60;
outline-offset: 3px;
}
.sgra-root .screen-reader-text,
.sgra-root .sgra-honeypot {
position: absolute !important;
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: -1px !important;
overflow: hidden !important;
clip: rect(0, 0, 0, 0) !important;
white-space: nowrap !important;
border: 0 !important;
}
.sgra-skip-link {
position: absolute;
z-index: 100;
top: 8px;
left: 8px;
padding: 9px 14px;
transform: translateY(-150%);
border-radius: 8px;
background: #fff;
color: var(--sgra-pine-950);
font-weight: 800;
}
.sgra-skip-link:focus {
transform: translateY(0);
}
.sgra-emergency {
min-height: 48px;
background: var(--sgra-emergency);
color: #fff;
}
.sgra-emergency a {
min-height: 48px;
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
padding: 8px 24px;
color: inherit;
text-decoration: none;
}
.sgra-emergency a > span {
width: 25px;
height: 25px;
display: grid;
place-items: center;
border: 2px solid currentColor;
border-radius: 50%;
font-weight: 900;
line-height: 1;
}
.sgra-emergency strong {
font-size: 15px;
}
.sgra-emergency small {
opacity: .86;
font-size: 13px;
}
.sgra-header {
width: min(100% - 48px, 1380px);
min-height: 78px;
margin-inline: auto;
display: flex;
align-items: center;
justify-content: space-between;
gap: 30px;
}
.sgra-brand {
display: inline-flex;
align-items: center;
gap: 12px;
color: var(--sgra-pine-950);
}
.sgra-brand-mark {
font-size: 39px;
line-height: 1;
transform: rotate(-8deg);
}
.sgra-brand > span:last-child {
display: flex;
align-items: baseline;
gap: 8px;
}
.sgra-brand strong {
font-family: Georgia, "Times New Roman", serif;
font-size: 21px;
}
.sgra-brand small {
padding-left: 8px;
border-left: 1px solid var(--sgra-line);
color: var(--sgra-muted);
font-size: 13px;
font-weight: 700;
}
.sgra-header nav {
display: flex;
gap: 30px;
}
.sgra-header nav a {
color: var(--sgra-ink);
font-size: 14px;
font-weight: 650;
text-decoration: none;
}
.sgra-header-button {
padding: 11px 18px;
border: 1px solid var(--sgra-pine-900);
border-radius: 999px;
background: transparent;
color: var(--sgra-pine-900);
cursor: pointer;
font-size: 13px;
font-weight: 800;
}
.sgra-hero {
position: relative;
min-height: 690px;
display: grid;
grid-template-columns: minmax(0, 46%) minmax(0, 54%);
overflow: hidden;
border-top: 1px solid rgb(23 59 50 / 8%);
background: radial-gradient(circle at 13% 48%, rgb(222 211 188 / 35%), transparent 31%), var(--sgra-paper);
}
.sgra-hero::after {
content: "";
position: absolute;
z-index: 1;
top: 126px;
left: 44%;
width: 170px;
height: 440px;
pointer-events: none;
background: linear-gradient(90deg, transparent, rgb(255 253 248 / 92%) 48%, transparent);
filter: blur(28px);
transform: translateX(-50%);
}
.sgra-hero-copy {
position: relative;
z-index: 2;
padding: 82px clamp(40px, 6vw, 102px);
}
.sgra-eyebrow {
margin: 0 0 20px !important;
color: var(--sgra-pine-700);
font-size: 12px;
font-weight: 850;
letter-spacing: .18em;
text-transform: uppercase;
}
.sgra-root h1,
.sgra-root h2 {
margin: 0;
color: var(--sgra-pine-950);
font-family: Georgia, "Times New Roman", serif;
font-weight: 500;
letter-spacing: -.04em;
}
.sgra-root h1 {
max-width: 660px;
font-size: clamp(54px, 6vw, 94px);
line-height: .95;
}
.sgra-intro {
max-width: 650px;
margin: 36px 0 26px !important;
color: #3f4b47;
font-size: clamp(18px, 1.5vw, 22px);
line-height: 1.55;
}
.sgra-hero-actions {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 16px;
}
.sgra-button {
min-height: 62px;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 12px;
padding: 14px 22px;
border: 1px solid transparent;
border-radius: 14px;
cursor: pointer;
font-weight: 800;
text-decoration: none;
transition: transform 180ms ease, background 180ms ease, box-shadow 180ms ease;
}
.sgra-button:hover {
transform: translateY(-2px);
}
.sgra-button span {
font-size: 24px;
}
.sgra-button-primary {
background: var(--sgra-pine-900);
box-shadow: 0 10px 28px rgb(23 59 50 / 20%);
color: #fff;
}
.sgra-button-primary:hover {
background: var(--sgra-pine-800);
}
.sgra-button-secondary {
border-color: var(--sgra-pine-900);
background: var(--sgra-paper);
color: var(--sgra-pine-950);
}
.sgra-button-secondary:hover {
background: var(--sgra-sage);
}
.sgra-response-note {
margin: 12px 0 0 !important;
color: var(--sgra-muted);
font-size: 12px;
text-align: center;
}
.sgra-stats {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 16px;
margin-top: 30px;
}
.sgra-stats > div {
min-height: 88px;
display: flex;
align-items: center;
gap: 15px;
padding: 16px 19px;
border: 1px solid var(--sgra-line);
border-radius: 14px;
background: rgb(255 253 248 / 72%);
}
.sgra-stats > div > span {
width: 46px;
height: 46px;
display: grid;
place-items: center;
border-radius: 50%;
background: var(--sgra-sage);
color: var(--sgra-pine-800);
font-size: 24px;
}
.sgra-stats p {
margin: 0 !important;
}
.sgra-stats strong,
.sgra-stats small {
display: block;
}
.sgra-stats strong {
color: var(--sgra-pine-900);
font-family: Georgia, "Times New Roman", serif;
font-size: 34px;
font-weight: 500;
line-height: 1;
}
.sgra-stats small {
margin-top: 5px;
color: var(--sgra-muted);
font-size: 12px;
}
.sgra-territory {
position: relative;
isolation: isolate;
min-height: 690px;
overflow: hidden;
background: radial-gradient(circle at 46% 37%, rgb(107 143 112 / 80%), transparent 25%), radial-gradient(circle at 20% 75%, rgb(63 102 82 / 80%), transparent 29%), linear-gradient(135deg, #395e4b, #0f352e 76%);
}
.sgra-territory::before {
box-shadow:
0 0 0 26px rgb(236 226 204 / 4%),
0 0 0 52px rgb(236 226 204 / 3%),
0 0 0 78px rgb(236 226 204 / 2%);
}
.sgra-territory::before,
.sgra-territory::after,
.sgra-topo {
content: "";
position: absolute;
border: 1px solid rgb(236 226 204 / 18%);
border-radius: 48% 52% 46% 54% / 40% 46% 54% 60%;
transform: rotate(-14deg);
}
.sgra-territory::before {
width: 760px;
height: 520px;
top: -70px;
left: -100px;
}
.sgra-territory::after {
width: 610px;
height: 440px;
bottom: -155px;
left: 90px;
}
.sgra-topo-a {
width: 650px;
height: 450px;
top: -30px;
left: -45px;
}
.sgra-topo-b {
width: 510px;
height: 350px;
top: 12px;
left: 28px;
}
.sgra-map-label {
position: absolute;
z-index: 3;
top: 34px;
left: 38px;
display: flex;
align-items: center;
gap: 9px;
padding: 9px 13px;
border: 1px solid rgb(255 255 255 / 22%);
border-radius: 999px;
background: rgb(15 46 40 / 45%);
color: #fff;
font-size: 12px;
font-weight: 750;
backdrop-filter: blur(10px);
}
.sgra-map-label i {
width: 7px;
height: 7px;
border-radius: 50%;
background: #d8e8bf;
box-shadow: 0 0 0 5px rgb(216 232 191 / 13%);
}
.sgra-map-points i {
position: absolute;
z-index: 2;
width: 13px;
height: 13px;
border: 3px solid var(--sgra-paper);
border-radius: 50%;
background: #9dbb8d;
box-shadow: 0 0 0 6px rgb(255 255 255 / 8%);
}
.sgra-map-points i:nth-child(1) { top: 170px; left: 29%; }
.sgra-map-points i:nth-child(2) { top: 310px; left: 48%; }
.sgra-map-points i:nth-child(3) { top: 475px; left: 33%; }
.sgra-map-points i:nth-child(4) { top: 235px; left: 65%; }
.sgra-map-points i:nth-child(5) { top: 545px; left: 58%; }
.sgra-resource-chips {
position: absolute;
z-index: 4;
top: 135px;
right: clamp(26px, 4vw, 70px);
width: min(300px, 43%);
display: grid;
gap: 12px;
}
.sgra-resource-chips button {
min-height: 64px;
display: grid;
grid-template-columns: 42px 1fr auto;
align-items: center;
gap: 12px;
padding: 9px 14px 9px 10px;
border: 1px solid rgb(255 255 255 / 20%);
border-radius: 16px;
background: rgb(239 244 235 / 84%);
box-shadow: 0 12px 32px rgb(7 29 24 / 15%);
color: var(--sgra-pine-950);
cursor: pointer;
text-align: left;
backdrop-filter: blur(12px);
transition: transform 180ms ease, background 180ms ease;
}
.sgra-resource-chips button:hover {
transform: translateX(-5px);
background: #fff;
}
.sgra-resource-chips button > span {
width: 42px;
height: 42px;
display: grid;
place-items: center;
border-radius: 50%;
background: #fff;
color: var(--sgra-pine-800);
font-size: 23px;
}
.sgra-resource-chips strong {
font-size: 14px;
}
.sgra-resource-chips small {
min-width: 27px;
padding: 4px 7px;
border-radius: 999px;
background: rgb(23 59 50 / 10%);
color: var(--sgra-pine-800);
font-size: 11px;
text-align: center;
}
.sgra-map-note {
position: absolute;
z-index: 3;
right: 38px;
bottom: 22px;
max-width: 410px;
margin: 0 !important;
color: rgb(255 255 255 / 70%);
font-size: 11px;
text-align: right;
}
.sgra-list-section,
.sgra-how,
.sgra-safety {
width: min(100% - 48px, 1320px);
margin-inline: auto;
}
.sgra-list-section {
padding: 96px 0 105px;
}
.sgra-section-heading {
display: flex;
align-items: end;
justify-content: space-between;
gap: 40px;
}
.sgra-section-heading h2,
.sgra-how h2,
.sgra-safety h2 {
font-size: clamp(42px, 5vw, 66px);
line-height: 1;
}
.sgra-section-heading > div:first-child > p:last-child {
max-width: 620px;
margin: 18px 0 0 !important;
color: var(--sgra-muted);
line-height: 1.65;
}
.sgra-tabs,
.sgra-form-switch {
display: inline-flex;
padding: 5px;
border: 1px solid var(--sgra-line);
border-radius: 12px;
background: var(--sgra-paper);
}
.sgra-tabs button,
.sgra-form-switch button {
min-height: 40px;
padding: 8px 15px;
border: 0;
border-radius: 8px;
background: transparent;
color: var(--sgra-muted);
cursor: pointer;
font-size: 13px;
font-weight: 750;
}
.sgra-tabs button.is-active,
.sgra-form-switch button.is-active {
background: var(--sgra-pine-900);
color: #fff;
}
.sgra-filters {
display: grid;
grid-template-columns: minmax(260px, 1fr) minmax(210px, 270px) auto;
gap: 12px;
margin-top: 40px;
}
.sgra-filters input,
.sgra-filters select,
.sgra-form-grid input,
.sgra-form-grid select,
.sgra-form-grid textarea,
.sgra-manage-dialog input {
width: 100%;
border: 1px solid var(--sgra-line);
border-radius: 12px;
background: var(--sgra-paper);
color: var(--sgra-ink);
}
.sgra-filters input,
.sgra-filters select {
min-height: 54px;
padding: 0 16px;
}
.sgra-clear {
padding-inline: 16px;
border: 0;
background: transparent;
color: var(--sgra-pine-700);
cursor: pointer;
font-size: 13px;
font-weight: 800;
}
.sgra-results-meta {
min-height: 18px;
margin: 24px 0 15px;
color: var(--sgra-muted);
font-size: 12px;
font-weight: 650;
}
.sgra-grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 18px;
}
.sgra-card {
position: relative;
min-height: 360px;
padding: 24px;
overflow: hidden;
border: 1px solid var(--sgra-line);
border-radius: 18px;
background: var(--sgra-paper);
box-shadow: 0 10px 30px rgb(15 46 40 / 5%);
}
.sgra-card::before {
content: "";
position: absolute;
inset: 0 auto 0 0;
width: 4px;
background: var(--sgra-pine-700);
}
.sgra-card-need::before {
background: var(--sgra-need);
}
.sgra-card-top {
min-height: 28px;
display: flex;
align-items: center;
gap: 7px;
}
.sgra-card-top time {
margin-left: auto;
color: var(--sgra-muted);
font-size: 11px;
}
.sgra-kind,
.sgra-urgent {
padding: 5px 8px;
border-radius: 999px;
font-size: 10px;
font-weight: 850;
letter-spacing: .04em;
text-transform: uppercase;
}
.sgra-kind-need {
background: #f8e6df;
color: #8c3524;
}
.sgra-kind-offer {
background: var(--sgra-sage);
color: var(--sgra-pine-700);
}
.sgra-urgent {
background: var(--sgra-emergency);
color: #fff;
}
.sgra-card-category {
display: flex;
align-items: center;
gap: 9px;
margin-top: 23px;
color: var(--sgra-pine-700);
font-size: 12px;
font-weight: 800;
}
.sgra-card-category span {
width: 30px;
height: 30px;
display: grid;
place-items: center;
border-radius: 50%;
background: var(--sgra-sage);
}
.sgra-card h3 {
margin: 16px 0 9px !important;
color: var(--sgra-pine-950);
font-family: Georgia, "Times New Roman", serif;
font-size: 25px;
font-weight: 500;
line-height: 1.12;
}
.sgra-location {
margin: 0 !important;
color: var(--sgra-pine-700);
font-size: 12px;
font-weight: 750;
}
.sgra-card-description {
min-height: 70px;
margin: 15px 0 !important;
color: #56615d;
font-size: 13px;
line-height: 1.55;
}
.sgra-card-actions {
display: flex;
gap: 8px;
}
.sgra-card-actions a {
flex: 1;
padding: 10px 12px;
border: 1px solid var(--sgra-pine-900);
border-radius: 9px;
color: var(--sgra-pine-900);
font-size: 12px;
font-weight: 850;
text-align: center;
text-decoration: none;
}
.sgra-card-actions a:hover {
background: var(--sgra-sage);
}
.sgra-card-actions .sgra-whatsapp {
border-color: #2d7854;
background: #2d7854;
color: #fff;
}
.sgra-contact-name {
margin: 8px 0 0 !important;
color: #8a9490;
font-size: 10px;
text-align: center;
}
.sgra-empty {
grid-column: 1 / -1;
padding: 65px 24px;
border: 1px dashed var(--sgra-line);
border-radius: 18px;
color: var(--sgra-muted);
text-align: center;
}
.sgra-empty strong {
display: block;
color: var(--sgra-pine-900);
}
.sgra-empty p {
margin: 6px 0 0 !important;
}
.sgra-load-more {
min-width: 210px;
min-height: 49px;
display: block;
margin: 30px auto 0;
border: 1px solid var(--sgra-pine-900);
border-radius: 12px;
background: transparent;
color: var(--sgra-pine-900);
cursor: pointer;
font-weight: 800;
}
.sgra-how {
display: grid;
grid-template-columns: .75fr 1.25fr;
gap: 70px;
padding: 96px 0;
border-top: 1px solid var(--sgra-line);
}
.sgra-how ol {
margin: 0;
padding: 0;
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 14px;
list-style: none;
}
.sgra-how li {
min-height: 255px;
padding: 24px;
border: 1px solid var(--sgra-line);
border-radius: 18px;
background: var(--sgra-paper);
}
.sgra-how li > span {
display: block;
margin-bottom: 68px;
color: var(--sgra-pine-700);
font-family: Georgia, "Times New Roman", serif;
font-size: 20px;
}
.sgra-how li strong {
display: block;
color: var(--sgra-pine-950);
font-size: 18px;
}
.sgra-how li p {
margin: 11px 0 0 !important;
color: var(--sgra-muted);
font-size: 13px;
line-height: 1.55;
}
.sgra-safety {
margin-bottom: 70px;
padding: 50px;
border-radius: 24px;
background: var(--sgra-pine-950);
color: #fff;
}
.sgra-safety-title {
display: flex;
align-items: center;
gap: 22px;
}
.sgra-safety-title > span {
width: 58px;
height: 58px;
flex: 0 0 auto;
display: grid;
place-items: center;
border: 2px solid var(--sgra-emergency);
border-radius: 50%;
color: #f7a481;
font-size: 25px;
font-weight: 900;
}
.sgra-safety .sgra-eyebrow {
margin-bottom: 10px !important;
color: #9fc4b6;
}
.sgra-safety h2 {
max-width: 800px;
color: #fff;
}
.sgra-safety ul {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 15px 35px;
margin: 40px 0 28px;
padding: 0;
list-style: none;
}
.sgra-safety li {
position: relative;
padding-left: 25px;
color: #d8e3de;
font-size: 14px;
line-height: 1.55;
}
.sgra-safety li::before {
content: "✓";
position: absolute;
left: 0;
color: #9fc4b6;
font-weight: 900;
}
.sgra-safety > p {
margin: 0 !important;
padding-top: 21px;
border-top: 1px solid rgb(255 255 255 / 13%);
color: #9dafaa;
font-size: 12px;
}
.sgra-manage-callout {
display: grid;
grid-template-columns: auto minmax(0, 1fr) auto;
align-items: center;
gap: 20px;
margin-top: 42px;
padding: 24px;
border: 1px solid #cbd9d3;
border-radius: 20px;
background: linear-gradient(135deg, #f5f8f5 0%, #e8f0ec 100%);
box-shadow: 0 14px 35px rgb(22 67 55 / 8%);
}
.sgra-manage-callout__icon {
width: 54px;
height: 54px;
display: grid;
flex: 0 0 auto;
place-items: center;
border-radius: 17px;
background: var(--sgra-pine-900);
color: #fff;
font-size: 23px;
font-weight: 900;
}
.sgra-manage-callout__kicker {
display: block;
margin-bottom: 4px;
color: var(--sgra-pine-700);
font-size: 11px;
font-weight: 900;
letter-spacing: .12em;
text-transform: uppercase;
}
.sgra-manage-callout strong {
display: block;
color: var(--sgra-pine-950);
font-size: 18px;
line-height: 1.25;
}
.sgra-manage-callout p {
margin: 6px 0 0 !important;
color: var(--sgra-muted);
font-size: 13px;
line-height: 1.5;
}
.sgra-button-manage {
min-height: 50px;
padding-inline: 22px;
border: 1px solid var(--sgra-pine-900);
background: var(--sgra-pine-900);
color: #fff;
white-space: nowrap;
}
.sgra-dialog {
width: min(720px, calc(100% - 28px));
max-height: min(88vh, 850px);
padding: 0;
overflow: auto;
border: 0;
border-radius: 22px;
background: var(--sgra-paper);
box-shadow: 0 25px 100px rgb(3 21 17 / 35%);
color: var(--sgra-ink);
}
.sgra-dialog::backdrop {
background: rgb(10 32 27 / 72%);
backdrop-filter: blur(4px);
}
.sgra-dialog-header {
position: sticky;
z-index: 2;
top: 0;
display: flex;
align-items: center;
justify-content: space-between;
gap: 20px;
padding: 26px 30px 21px;
border-bottom: 1px solid var(--sgra-line);
background: rgb(255 253 248 / 95%);
backdrop-filter: blur(12px);
}
.sgra-dialog-header .sgra-eyebrow {
margin-bottom: 8px !important;
}
.sgra-dialog-header h2 {
font-size: 37px;
}
.sgra-dialog-header > button {
width: 42px;
height: 42px;
border: 1px solid var(--sgra-line);
border-radius: 50%;
background: transparent;
color: var(--sgra-pine-900);
cursor: pointer;
font-size: 29px;
}
.sgra-dialog form {
padding: 28px 30px 32px;
}
.sgra-form-switch {
width: 100%;
display: grid;
grid-template-columns: 1fr 1fr;
margin-bottom: 25px;
}
.sgra-form-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 17px;
}
.sgra-form-grid label > span,
.sgra-manage-dialog label > span {
display: block;
margin-bottom: 7px;
color: var(--sgra-pine-950);
font-size: 12px;
font-weight: 800;
}
.sgra-form-grid input,
.sgra-form-grid select,
.sgra-form-grid textarea,
.sgra-manage-dialog input {
min-height: 49px;
padding: 12px 13px;
}
.sgra-form-grid textarea {
resize: vertical;
}
.sgra-form-grid label > small {
display: block;
margin-top: 7px;
color: var(--sgra-muted);
font-size: 11px;
line-height: 1.45;
}
.sgra-full {
grid-column: 1 / -1;
}
.sgra-check {
display: flex !important;
align-items: flex-start;
gap: 10px;
margin-top: 15px;
color: #505c57;
font-size: 12px;
line-height: 1.5;
}
.sgra-check input {
width: 17px;
height: 17px;
flex: 0 0 auto;
margin-top: 1px;
accent-color: var(--sgra-pine-800);
}
.sgra-consent {
padding-top: 15px;
border-top: 1px solid var(--sgra-line);
}
.sgra-consent a {
color: var(--sgra-pine-700);
}
.sgra-submit-error {
margin-top: 18px;
padding: 13px 15px;
border: 1px solid rgb(180 61 42 / 25%);
border-left: 4px solid var(--sgra-need);
border-radius: 10px;
background: #fff0eb;
color: #813322;
font-size: 13px;
font-weight: 700;
line-height: 1.45;
}
.sgra-form-actions {
display: grid;
grid-template-columns: .7fr 1.3fr;
gap: 12px;
margin-top: 25px;
}
.sgra-form-actions .sgra-button {
min-height: 54px;
}
.sgra-form-feedback {
padding: 50px 32px;
text-align: center;
}
.sgra-form-feedback h3 {
margin: 0 0 10px;
color: var(--sgra-pine-950);
font-family: Georgia, "Times New Roman", serif;
font-size: 30px;
font-weight: 500;
}
.sgra-form-feedback p {
margin: 8px auto !important;
color: var(--sgra-muted);
}
.sgra-manage-code {
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
margin: 20px auto;
padding: 14px;
border: 1px dashed var(--sgra-pine-700);
border-radius: 12px;
background: var(--sgra-sage);
color: var(--sgra-pine-950);
font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
font-size: 19px;
font-weight: 800;
}
.sgra-manage-code button {
padding: 6px 10px;
border: 1px solid var(--sgra-line);
border-radius: 7px;
background: #fff;
cursor: pointer;
font-family: inherit;
font-size: 11px;
}
.sgra-manage-dialog {
width: min(540px, calc(100% - 28px));
}
.sgra-manage-dialog form > p {
color: var(--sgra-muted);
font-size: 12px;
}
.sgra-manage-dialog .sgra-button {
width: 100%;
min-height: 54px;
margin-top: 18px;
}
.sgra-manage-dialog [data-sgra-manage-feedback] {
margin-top: 12px;
color: var(--sgra-need);
font-size: 12px;
font-weight: 700;
}
@media (max-width: 760px) {
.sgra-manage-callout {
grid-template-columns: auto minmax(0, 1fr);
padding: 19px;
}
.sgra-manage-callout .sgra-button-manage {
width: 100%;
grid-column: 1 / -1;
}
}
@media (max-width: 480px) {
.sgra-manage-callout {
grid-template-columns: 1fr;
text-align: left;
}
.sgra-manage-callout__icon {
width: 46px;
height: 46px;
}
}
.sgra-is-loading {
opacity: .58;
pointer-events: none;
} .sgra-live-map-panel {
min-height: 690px;
display: grid;
grid-template-rows: auto minmax(480px, 1fr) auto;
gap: 15px;
padding: 24px;
background: #e7ece7;
}
.sgra-live-map-panel::before,
.sgra-live-map-panel::after {
display: none;
}
.sgra-map-toolbar {
z-index: 3;
display: flex;
align-items: center;
justify-content: space-between;
gap: 22px;
padding: 2px 3px;
}
.sgra-map-kicker {
margin: 0 0 3px !important;
color: var(--sgra-pine-700);
font-size: 10px;
font-weight: 850;
letter-spacing: .15em;
text-transform: uppercase;
}
.sgra-map-toolbar > div:first-child > strong {
color: var(--sgra-pine-950);
font-family: Georgia, "Times New Roman", serif;
font-size: 20px;
font-weight: 500;
}
.sgra-map-legend {
display: flex;
align-items: center;
gap: 12px;
padding: 8px 11px;
border: 1px solid rgb(23 59 50 / 10%);
border-radius: 999px;
background: rgb(255 253 248 / 76%);
}
.sgra-map-legend span {
display: inline-flex;
align-items: center;
gap: 6px;
color: var(--sgra-muted);
font-size: 10px;
font-weight: 800;
}
.sgra-map-legend i {
width: 9px;
height: 9px;
border-radius: 50%;
box-shadow: 0 0 0 3px rgb(23 59 50 / 6%);
}
.sgra-legend-need {
background: #d94f36;
}
.sgra-legend-offer {
background: #2e8a61;
}
.sgra-map-canvas {
z-index: 2;
width: 100%;
min-height: 500px;
overflow: hidden;
border: 1px solid rgb(23 59 50 / 13%);
border-radius: 23px;
background: #dfe7df;
box-shadow: 0 20px 50px rgb(15 46 40 / 12%);
}
.sgra-map-canvas .leaflet-control-zoom {
overflow: hidden;
border: 0;
border-radius: 12px;
box-shadow: 0 8px 25px rgb(15 46 40 / 18%);
}
.sgra-map-canvas .leaflet-control-zoom a {
width: 35px;
height: 35px;
border-color: var(--sgra-line);
background: var(--sgra-paper);
color: var(--sgra-pine-900);
line-height: 35px;
}
.sgra-map-canvas .leaflet-control-attribution {
border-radius: 8px 0 0;
background: rgb(255 255 255 / 82%);
color: #66706c;
font-size: 9px;
}
.sgra-map-canvas .leaflet-control-attribution a {
color: var(--sgra-pine-700);
}
.sgra-map-canvas .leaflet-control-layers {
margin: 12px 12px 0 0;
padding: 5px;
border: 1px solid rgb(23 59 50 / 14%);
border-radius: 12px;
background: rgb(255 253 248 / 92%);
box-shadow: 0 8px 25px rgb(15 46 40 / 14%);
backdrop-filter: blur(8px);
}
.sgra-map-canvas .leaflet-control-layers-list {
margin: 0;
}
.sgra-map-canvas .leaflet-control-layers-base {
display: flex;
align-items: center;
gap: 3px;
}
.sgra-map-canvas .leaflet-control-layers-base label {
margin: 0;
cursor: pointer;
}
.sgra-map-canvas .leaflet-control-layers-base span {
display: flex;
align-items: center;
gap: 5px;
padding: 7px 9px;
border-radius: 8px;
color: var(--sgra-pine-900);
font-size: 10px;
font-weight: 850;
letter-spacing: .04em;
}
.sgra-map-canvas .leaflet-control-layers-base input {
width: 12px;
height: 12px;
margin: 0;
accent-color: var(--sgra-pine-700);
}
@media (max-width: 520px) {
.sgra-map-canvas .leaflet-control-layers {
margin: 8px 8px 0 0;
}
.sgra-map-canvas .leaflet-control-layers-base span {
padding: 6px;
font-size: 9px;
}
}
.sgra-map-footer {
z-index: 3;
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
}
.sgra-map-footer p {
max-width: 510px;
margin: 0 !important;
color: var(--sgra-muted);
font-size: 10px;
line-height: 1.45;
}
.sgra-map-footer button {
flex: 0 0 auto;
padding: 8px 11px;
border: 1px solid var(--sgra-line);
border-radius: 9px;
background: var(--sgra-paper);
color: var(--sgra-pine-800);
cursor: pointer;
font-size: 10px;
font-weight: 800;
}
.sgra-map-empty {
z-index: 2;
display: grid;
place-content: center;
min-height: 500px;
padding: 30px;
border: 1px dashed #9eaea5;
border-radius: 23px;
background:
radial-gradient(circle at 30% 28%, rgb(125 157 133 / 18%), transparent 28%),
var(--sgra-sage);
color: var(--sgra-muted);
text-align: center;
}
.sgra-map-empty[hidden] {
display: none;
}
.sgra-map-empty strong {
color: var(--sgra-pine-900);
font-family: Georgia, "Times New Roman", serif;
font-size: 23px;
font-weight: 500;
}
.sgra-map-empty p {
margin: 8px 0 0 !important;
font-size: 12px;
}
.sgra-leaflet-marker {
border: 0;
background: transparent;
}
.sgra-map-marker {
position: relative;
width: 42px;
height: 42px;
display: grid;
place-items: center;
border: 4px solid #fff;
border-radius: 50% 50% 50% 10%;
box-shadow: 0 8px 22px rgb(12 42 34 / 28%);
transform: rotate(-45deg);
}
.sgra-map-marker::after {
content: "";
position: absolute;
inset: -9px;
z-index: -1;
border: 2px solid currentColor;
border-radius: 50%;
opacity: .17;
}
.sgra-map-marker i {
color: #fff;
font-size: 17px;
font-style: normal;
font-weight: 900;
transform: rotate(45deg);
}
.sgra-map-marker-need {
background: #d94f36;
color: #d94f36;
}
.sgra-map-marker-offer {
background: #2e8a61;
color: #2e8a61;
}
.sgra-map-marker.is-urgent::after {
animation: sgra-pin-pulse 1.6s ease-out infinite;
opacity: .42;
}
@keyframes sgra-pin-pulse {
0% { transform: scale(.72); opacity: .5; }
100% { transform: scale(1.35); opacity: 0; }
}
.sgra-map-canvas .leaflet-popup-content-wrapper {
border: 1px solid var(--sgra-line);
border-radius: 16px;
background: var(--sgra-paper);
box-shadow: 0 18px 55px rgb(15 46 40 / 20%);
color: var(--sgra-ink);
}
.sgra-map-canvas .leaflet-popup-content {
margin: 16px;
}
.sgra-map-popup {
position: relative;
}
.sgra-popup-label {
display: inline-block;
margin-bottom: 9px;
padding: 4px 7px;
border-radius: 999px;
font-size: 9px;
font-weight: 850;
letter-spacing: .05em;
text-transform: uppercase;
}
.sgra-popup-label-need {
background: #f8e6df;
color: #8c3524;
}
.sgra-popup-label-offer {
background: var(--sgra-sage);
color: var(--sgra-pine-700);
}
.sgra-popup-urgent {
display: inline-block;
margin-left: 5px;
padding: 4px 7px;
border-radius: 999px;
background: var(--sgra-emergency);
color: #fff;
font-size: 9px;
font-weight: 850;
text-transform: uppercase;
}
.sgra-map-popup > strong {
display: block;
color: var(--sgra-pine-950);
font-family: Georgia, "Times New Roman", serif;
font-size: 18px;
font-weight: 500;
line-height: 1.2;
}
.sgra-map-popup p {
margin: 7px 0 12px !important;
color: var(--sgra-muted);
font-size: 11px;
}
.sgra-popup-link {
width: 100%;
min-height: 36px;
border: 0;
border-radius: 9px;
background: var(--sgra-pine-900);
color: #fff;
cursor: pointer;
font-size: 11px;
font-weight: 800;
}
.sgra-card {
min-height: 440px;
display: flex;
flex-direction: column;
padding: 22px;
}
.sgra-contact-block {
display: grid;
grid-template-columns: 44px minmax(0, 1fr) auto;
align-items: center;
gap: 12px;
margin: 20px 0 18px;
padding: 12px 13px;
border: 1px solid rgb(23 59 50 / 8%);
border-radius: 14px;
background: #f0f3ee;
}
.sgra-contact-avatar {
width: 44px;
height: 44px;
display: grid;
place-items: center;
border-radius: 13px;
background: var(--sgra-pine-800);
color: #fff;
font-family: Georgia, "Times New Roman", serif;
font-size: 21px;
}
.sgra-card-need .sgra-contact-avatar {
background: var(--sgra-need);
}
.sgra-contact-person {
min-width: 0;
}
.sgra-contact-person small,
.sgra-visible-phone small {
display: block;
margin-bottom: 2px;
color: var(--sgra-muted);
font-size: 9px;
font-weight: 800;
letter-spacing: .05em;
text-transform: uppercase;
}
.sgra-contact-person strong {
display: block;
overflow: hidden;
color: var(--sgra-pine-950);
font-size: 14px;
text-overflow: ellipsis;
white-space: nowrap;
}
.sgra-visible-phone {
padding-left: 13px;
border-left: 1px solid var(--sgra-line);
color: var(--sgra-pine-800);
text-align: right;
text-decoration: none;
}
.sgra-visible-phone strong {
font-size: 13px;
white-space: nowrap;
}
.sgra-visible-phone:hover strong {
text-decoration: underline;
}
.sgra-card-data {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 8px 15px;
}
.sgra-card-data .sgra-card-category {
margin: 0;
}
.sgra-card-data .sgra-card-category i {
width: 27px;
height: 27px;
display: grid;
place-items: center;
border-radius: 9px;
background: var(--sgra-sage);
font-style: normal;
}
.sgra-card-data .sgra-location {
margin: 0 !important;
}
.sgra-card h3 {
margin-top: 17px !important;
}
.sgra-card-description {
min-height: 62px;
}
.sgra-card-actions {
margin-top: auto;
}
.sgra-card-actions a {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 7px;
}
.sgra-card-highlight {
animation: sgra-card-focus 1.8s ease;
}
@keyframes sgra-card-focus {
0%, 100% { box-shadow: 0 10px 30px rgb(15 46 40 / 5%); }
35% { box-shadow: 0 0 0 5px rgb(213 85 50 / 22%), 0 22px 55px rgb(15 46 40 / 15%); }
}
@media (max-width: 1050px) {
.sgra-header nav { display: none; }
.sgra-hero { grid-template-columns: 1fr; }
.sgra-hero::after { display: none; }
.sgra-hero-copy { padding: 68px max(24px, 7vw); }
.sgra-territory { min-height: 620px; }
.sgra-live-map-panel { grid-template-rows: auto minmax(500px, 1fr) auto; }
.sgra-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.sgra-how { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
.sgra-root {
width: 100vw;
margin-right: calc(50% - 50vw);
margin-left: calc(50% - 50vw);
}
.sgra-emergency a { justify-content: flex-start; padding-inline: 18px; }
.sgra-emergency small { display: none; }
.sgra-header { width: min(100% - 32px, 1380px); min-height: 68px; }
.sgra-brand strong { font-size: 17px; }
.sgra-brand small,
.sgra-header-button { display: none; }
.sgra-hero-copy { padding: 56px 20px 46px; }
.sgra-root h1 { font-size: clamp(48px, 15vw, 67px); }
.sgra-intro { margin-top: 26px !important; font-size: 17px; }
.sgra-hero-actions,
.sgra-stats { grid-template-columns: 1fr; }
.sgra-response-note { text-align: left; }
.sgra-territory { min-height: 580px; }
.sgra-live-map-panel {
grid-template-rows: auto 440px auto;
padding: 15px;
}
.sgra-map-toolbar {
align-items: flex-start;
flex-direction: column;
gap: 10px;
}
.sgra-map-legend {
width: 100%;
justify-content: space-between;
}
.sgra-map-canvas,
.sgra-map-empty {
min-height: 440px;
}
.sgra-map-footer {
align-items: flex-start;
flex-direction: column;
}
.sgra-contact-block {
grid-template-columns: 40px minmax(0, 1fr);
}
.sgra-contact-avatar {
width: 40px;
height: 40px;
}
.sgra-visible-phone {
grid-column: 1 / -1;
padding: 10px 0 0;
border-top: 1px solid var(--sgra-line);
border-left: 0;
text-align: left;
}
.sgra-map-label { top: 22px; left: 18px; }
.sgra-resource-chips { top: 84px; right: 17px; left: 17px; width: auto; }
.sgra-resource-chips button { min-height: 58px; }
.sgra-map-note { right: 18px; left: 18px; text-align: left; }
.sgra-list-section,
.sgra-how,
.sgra-safety { width: min(100% - 32px, 1320px); }
.sgra-list-section { padding: 72px 0; }
.sgra-section-heading { align-items: start; flex-direction: column; }
.sgra-tabs { width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); }
.sgra-filters { grid-template-columns: 1fr; }
.sgra-clear { min-height: 42px; border: 1px solid var(--sgra-line); border-radius: 10px; }
.sgra-grid { grid-template-columns: 1fr; }
.sgra-how { gap: 38px; padding: 72px 0; }
.sgra-how ol { grid-template-columns: 1fr; }
.sgra-how li { min-height: auto; }
.sgra-how li > span { margin-bottom: 28px; }
.sgra-safety { margin-bottom: 50px; padding: 30px 21px; }
.sgra-safety-title { align-items: flex-start; }
.sgra-safety ul { grid-template-columns: 1fr; }
.sgra-form-grid,
.sgra-form-actions { grid-template-columns: 1fr; }
.sgra-full { grid-column: auto; }
.sgra-dialog form,
.sgra-dialog-header { padding-inline: 20px; }
}
@media (prefers-reduced-motion: reduce) {
.sgra-root *,
.sgra-root *::before,
.sgra-root *::after {
scroll-behavior: auto !important;
transition-duration: .01ms !important;
animation-duration: .01ms !important;
animation-iteration-count: 1 !important;
}
}