/* ════════════════════════════════════════════════════════════ Gadovia Energy — component styles theme.json owns the palette and the fonts. The short names below are aliases onto the presets it generates, so a colour or font changed in Global Styles reaches these component rules. The literal values are fallbacks for when global styles are absent (e.g. a bare pattern preview); they must stay in step with theme.json. Shape, shadow and timing tokens have no theme.json equivalent and are declared outright. ════════════════════════════════════════════════════════════ */ *,*::before,*::after{box-sizing:border-box;margin:0;padding:0} :root{ --verde:var(--wp--preset--color--verde,#1C4B35); --verde-mid:var(--wp--preset--color--verde-mid,#2A6649); --verde-light:var(--wp--preset--color--verde-light,#3A8060); --verde-pale:var(--wp--preset--color--verde-pale,#EAF4EF); --auriu:var(--wp--preset--color--auriu,#E8A800); --auriu-light:var(--wp--preset--color--auriu-light,#FFF3CC); --auriu-dark:var(--wp--preset--color--auriu-dark,#C48F00); --alb:var(--wp--preset--color--alb,#FFFFFF); --gri-bg:var(--wp--preset--color--gri-bg,#F4F6F8); --gri-border:var(--wp--preset--color--gri-border,#DDE2E8); --gri-text:var(--wp--preset--color--gri-text,#5A6472); --text-dark:var(--wp--preset--color--text-dark,#1A2332); --font-body:var(--wp--preset--font-family--body,'Source Sans 3',sans-serif); --font-heading:var(--wp--preset--font-family--heading,'Raleway',sans-serif); --r:8px;--r-lg:16px;--sh:0 2px 12px rgba(0,0,0,.08);--sh-lg:0 8px 40px rgba(0,0,0,.14);--tr:.22s ease; } html{scroll-behavior:smooth} body{font-family:var(--font-body);color:var(--text-dark);background:var(--alb);overflow-x:hidden} h1,h2,h3,h4,h5{font-family:var(--font-heading);font-weight:700;line-height:1.2} a{color:var(--verde-mid);text-decoration:none;transition:color var(--tr)} a:hover{color:var(--auriu-dark)} button{font-family:inherit;cursor:pointer} .skip-link{position:absolute;left:-9999px;top:0;z-index:1100;background:var(--auriu);color:var(--verde);padding:.6rem 1rem;font-family:var(--font-heading);font-weight:700;border-radius:0 0 var(--r) 0} .skip-link:focus{left:0} /* ── UTILITIES ── */ .wrap{max-width:1120px;margin:0 auto;padding:0 1.5rem} .sec{padding:5rem 0} .sec--alt{background:var(--gri-bg)} .eyebrow{display:inline-block;font-family:var(--font-heading);font-size:.72rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--verde-mid);background:var(--verde-pale);padding:.28em .9em;border-radius:20px;margin-bottom:.75rem} .sec-head{text-align:center;margin-bottom:3rem} .sec-head h2{font-size:clamp(1.7rem,3vw,2.4rem);color:var(--verde)} /* The eyebrow is a paragraph block, so exclude it from the description styling. */ .sec-head p:not(.eyebrow){max-width:580px;margin:.6rem auto 0;color:var(--gri-text);font-size:1.05rem} /* Buttons come in two shapes: bare in plugin-rendered markup, and core/button, which wraps its link in .wp-block-button. The .btn-* class lands on that wrapper, so each rule below carries a companion selector for the inner link. */ .btn,.wp-block-button.btn-gold>.wp-block-button__link,.wp-block-button.btn-ghost>.wp-block-button__link{display:inline-flex;align-items:center;gap:.45rem;padding:.72rem 1.7rem;border-radius:var(--r);font-family:var(--font-heading);font-weight:700;font-size:.9rem;border:2px solid transparent;cursor:pointer;transition:all var(--tr);text-align:center;white-space:nowrap} .btn-gold,.wp-block-button.btn-gold>.wp-block-button__link{background:var(--auriu);color:var(--verde);border-color:var(--auriu)} .btn-gold:hover,.wp-block-button.btn-gold>.wp-block-button__link:hover{background:var(--auriu-dark);border-color:var(--auriu-dark);color:var(--verde);transform:translateY(-2px);box-shadow:0 6px 18px rgba(232,168,0,.35)} .btn-verde{background:var(--verde);color:var(--alb);border-color:var(--verde)} .btn-verde:hover{background:var(--verde-mid);border-color:var(--verde-mid);color:var(--alb);transform:translateY(-2px)} .btn-ghost,.wp-block-button.btn-ghost>.wp-block-button__link{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)} .btn-ghost:hover,.wp-block-button.btn-ghost>.wp-block-button__link:hover{background:rgba(255,255,255,.1);color:#fff} .btn-sm{padding:.45rem 1rem;font-size:.82rem} /* ── FUNDING LOGO CARDS ── The four mandatory logos sit on white plates in the hero, the footer and both bars of the project modal. Only the logo height differs per location: each card sets --fm-logo-h and these shared rules do the rest. */ .fm-logo-box,.ffml,.mtl-box,.fm2-box{background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:6px;display:flex;align-items:center;justify-content:center;padding:.35rem .5rem} .fm-logo-box img,.ffml img,.mtl-box img,.fm2-box img{display:block;width:auto;height:var(--fm-logo-h,32px)} /* ── HEADER ── Skin on .site-header, fixed positioning on #hdr: the id only exists on the front end, and pinning the header inside the editor canvas would obscure it. */ .site-header{background:var(--verde)} #hdr{position:fixed;top:0;left:0;right:0;z-index:900;transition:box-shadow var(--tr)} #hdr.scrolled{box-shadow:0 3px 20px rgba(0,0,0,.25)} .hdr-inner{max-width:1120px;margin:0 auto;padding:0 1.5rem;height:66px} .logo-link{flex-shrink:0} .logo-emblem{width:38px;height:38px;border-radius:8px;background:var(--auriu);display:flex;align-items:center;justify-content:center;font-size:1.25rem;flex-shrink:0} .logo-main{display:block;font-family:var(--font-heading);font-weight:900;font-size:1.05rem;color:#fff} /* The wordmark carries the home link; it must not pick up the global link hue. */ .logo-main a,.logo-main a:hover{color:inherit} .logo-sub{display:block;font-size:.65rem;color:rgba(255,255,255,.55);letter-spacing:.1em;text-transform:uppercase} .main-nav a{display:block;padding:.5rem .9rem;border-radius:6px;font-family:var(--font-heading);font-weight:600;font-size:.88rem;color:rgba(255,255,255,.75);transition:all var(--tr)} .main-nav a:hover,.main-nav a.on{color:var(--auriu);background:rgba(255,255,255,.07)} .hbg{display:none;flex-direction:column;gap:5px;background:none;border:none;padding:6px} .hbg span{display:block;width:22px;height:2px;background:#fff;border-radius:2px} /* ── HERO ── */ /* Hero is a full-width Cover block; the photo/video background is set in the editor. */ .wp-block-cover.hero-cover{background:var(--verde);overflow:hidden;padding:0} .wp-block-cover.hero-cover::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(ellipse 70% 55% at 80% 35%,rgba(232,168,0,.18) 0%,transparent 65%),radial-gradient(ellipse 40% 40% at 10% 85%,rgba(232,168,0,.07) 0%,transparent 60%)} .wp-block-cover.hero-cover .wp-block-cover__inner-container{position:relative;z-index:3;width:100%;max-width:none;margin:0;display:flex;flex-direction:column;justify-content:center;min-height:100vh;padding-top:66px} .hero-inner{position:relative;z-index:2;max-width:740px;margin:0 auto;padding:5rem 1.5rem 4rem;text-align:center} .hero-kicker{display:inline-block;font-family:var(--font-heading);font-size:.74rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--auriu);margin-bottom:1.25rem} .hero-h1{font-size:clamp(2.2rem,5vw,3.8rem);font-weight:900;color:#fff;line-height:1.1;margin-bottom:1.25rem} .hero-h1 em{font-style:normal;color:var(--auriu)} .hero-lead{color:rgba(255,255,255,.72);font-size:1.1rem;max-width:520px;margin:0 auto 2.5rem;line-height:1.7} .hero-kpi{margin-bottom:2.5rem} /* Bound each tile so a long label wraps instead of pushing the row past the hero's column and dropping a KPI onto a second line. stretch (over the flex layout's default centring) keeps the tiles equal height, so the dividers and the values stay on one line. */ .wp-block-group.hero-kpi{align-items:stretch} .kpi{max-width:210px} /* The rule between KPIs is drawn on the KPI rather than sitting in the markup as an empty div, so the row is three clean blocks in the editor. It is placed 1px back from the block gap's left edge, where the old divider stood. */ .kpi{text-align:center;position:relative} .hero-kpi>.kpi+.kpi::before{content:"";position:absolute;left:calc(-2.5rem - 1px);top:50%;transform:translateY(-50%);width:1px;height:44px;background:rgba(255,255,255,.18)} .kpi-val{font-family:var(--font-heading);font-size:2.1rem;font-weight:900;color:var(--auriu);display:block} /* Inline, so the line box is sized by .kpi's strut rather than by the label's own 0.76rem font. A block paragraph here shortens the row ~6px and lifts the text off its baseline. */ .kpi-lbl{display:inline;font-size:.76rem;color:rgba(255,255,255,.6);text-transform:uppercase;letter-spacing:.07em} /* Opaque: the funding disclosure must not have the hero video showing through it. #163C2A is exactly what rgba(0,0,0,.2) resolved to over --verde, so the look is unchanged; color-mix keeps it tracking a palette change, and the hex before it is the fallback. */ .fm-strip{position:relative;z-index:2;background:#163C2A;background:color-mix(in srgb,var(--verde) 80%,#000);border-top:1px solid rgba(255,255,255,.1);padding:.85rem 1.5rem} .fm-strip-inner{max-width:1120px;margin:0 auto} /* Caption on its own line, so the logo group gets the full width and stays centred. The doubled class outranks the block layout engine. */ .wp-block-group.fm-strip-inner{flex-direction:column;gap:.55rem} /* The chip rows are server-rendered by gadovia/fm-logos, so they carry no block layout classes and declare their own flex here. */ .fm-logos,.ffm-logos{display:flex;gap:.75rem;flex-wrap:wrap;justify-content:center} .fm-logo-box{--fm-logo-h:36px} .fm-text{font-size:.8rem;color:rgba(255,255,255,.6);font-style:italic;text-align:center} /* ── DESPRE ── Built from core blocks. Flex/grid layout and the gaps between items come from the blocks' own layout attributes, so they stay adjustable in the Site Editor; only the visual skin lives here. */ .sec--despre{background:var(--alb)} /* core/columns declares align-items and flex-wrap with !important, so matching it needs both the extra class and !important. */ .despre-grid.wp-block-columns{align-items:flex-start!important} .despre-lead{font-size:1.15rem;font-weight:600;color:var(--verde);margin-bottom:1rem;line-height:1.5} .despre-body{color:var(--gri-text);line-height:1.75} .despre-body strong{color:var(--text-dark)} .valori{margin-top:1.75rem} .val-icon{width:40px;height:40px;flex-shrink:0;background:var(--verde-pale);border-radius:var(--r);display:flex;align-items:center;justify-content:center;font-size:1.2rem} .val-title{font-weight:700;color:var(--text-dark);font-size:.95rem;margin-bottom:.15rem} .val-desc{font-size:.88rem;color:var(--gri-text)} .parc-card{border-radius:var(--r-lg);overflow:hidden;border:2px solid var(--verde);box-shadow:var(--sh-lg)} .parc-head{background:var(--verde);padding:1.1rem 1.4rem} .badge-op{display:inline-block;background:var(--auriu);color:var(--verde);font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;padding:.15em .6em;border-radius:4px;margin-bottom:.35rem} .parc-head h3{color:#fff;font-size:1.1rem} .parc-map{height:185px;overflow:hidden} .parc-map iframe,.proj-map iframe{width:100%;height:100%;border:0;display:block} .parc-facts{padding:1rem 1.4rem 1.4rem;background:var(--alb)} .fact-row{font-size:.9rem;padding-bottom:.4rem;border-bottom:1px solid var(--gri-border)} .fact-row:last-child{border:none;padding:0} .fact-lbl{color:var(--gri-text)} /* :not() so a colour picked in the editor (has-text-color) is not overridden. */ .fact-val{font-weight:600} .fact-val:not(.has-text-color){color:var(--text-dark)} /* ── INVESTITII ── */ #investitii{background:var(--gri-bg)} .progress-timeline{display:flex;align-items:flex-start;justify-content:center;gap:0;margin-bottom:3.5rem;position:relative} .pt-step{text-align:center;flex:1;min-width:110px;position:relative} .pt-step::after{content:'';position:absolute;top:16px;left:50%;right:-50%;height:2px;background:var(--gri-border);z-index:0} .pt-step:last-child::after{display:none} .pt-dot{width:34px;height:34px;border-radius:50%;background:var(--alb);border:2px solid var(--gri-border);display:flex;align-items:center;justify-content:center;margin:0 auto .6rem;font-size:.8rem;position:relative;z-index:1;font-family:var(--font-heading);font-weight:800;color:var(--gri-text);transition:all var(--tr)} .pt-step.done .pt-dot{background:var(--verde);border-color:var(--verde);color:#fff} .pt-step.active .pt-dot{background:var(--auriu);border-color:var(--auriu);color:var(--verde);box-shadow:0 0 0 5px rgba(232,168,0,.22)} .pt-step.done::after{background:var(--verde)} .pt-lbl{font-size:.73rem;font-family:var(--font-heading);font-weight:700;color:var(--gri-text);line-height:1.3} .pt-step.done .pt-lbl{color:var(--verde)} .pt-step.active .pt-lbl{color:var(--auriu-dark)} .proiecte-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem} .proj-card{background:var(--alb);border-radius:var(--r-lg);border:1.5px solid var(--gri-border);box-shadow:var(--sh);overflow:hidden;display:flex;flex-direction:column;transition:transform var(--tr),box-shadow var(--tr),border-color var(--tr)} .proj-card:hover{transform:translateY(-6px);box-shadow:var(--sh-lg);border-color:var(--verde-light)} .proj-map{height:155px;overflow:hidden} .proj-body{padding:1.2rem 1.2rem .8rem;flex:1;display:flex;flex-direction:column} .proj-status{display:inline-block;margin-bottom:.6rem;font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;padding:.18em .65em;border-radius:4px;background:var(--auriu-light);color:var(--auriu-dark);border:1px solid rgba(232,168,0,.4)} .proj-title{font-size:1.05rem;color:var(--verde);margin-bottom:.25rem} .proj-loc{font-size:.84rem;color:var(--gri-text);margin-bottom:.85rem} .proj-meta{display:flex;flex-direction:column;gap:.45rem;flex:1;margin-bottom:1rem} .pm-row{display:flex;justify-content:space-between;font-size:.87rem;padding-bottom:.4rem;border-bottom:1px solid var(--gri-border)} .pm-row:last-child{border:none;padding:0} .pm-lbl{color:var(--gri-text)} .pm-val{font-weight:600;color:var(--text-dark)} .proj-card>.btn{border-radius:0;width:100%;justify-content:center;margin-top:auto} /* The card itself lifts on hover; the flush footer button must not, or it slides up and exposes a thin strip of the card background beneath it. */ .proj-card>.btn:hover{transform:none} /* ── MODAL ── */ .modal-bg{display:none;position:fixed;inset:0;background:rgba(14,28,22,.65);backdrop-filter:blur(5px);z-index:1000;padding:1.5rem 1rem;overflow-y:auto} .modal-bg.open{display:flex;align-items:flex-start;justify-content:center} .modal-box{background:var(--alb);border-radius:var(--r-lg);max-width:820px;width:100%;box-shadow:0 24px 80px rgba(0,0,0,.3);overflow:hidden;animation:mdIn .22s ease} @keyframes mdIn{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}} /* Symmetric inline padding keeps the stack centred; the close button is out of flow so it cannot pull the logo row off-centre. */ .modal-topbar{position:relative;background:var(--verde);padding:.55rem 3rem;display:flex;flex-direction:column;align-items:center;gap:.4rem} .modal-topbar-logos,.modal-fm-logos{display:flex;gap:.6rem;flex-wrap:wrap;justify-content:center} .mtl-box{--fm-logo-h:26px} .modal-topbar-text{font-size:.76rem;color:rgba(255,255,255,.7);font-style:italic;text-align:center} .modal-close-btn{position:absolute;top:.5rem;right:.75rem;background:none;border:none;font-size:1.2rem;color:rgba(255,255,255,.7);cursor:pointer;padding:.25rem;line-height:1;transition:color var(--tr)} .modal-close-btn:hover{color:#fff} .modal-head{padding:1.75rem 2rem 1.25rem;border-bottom:1px solid var(--gri-border)} .modal-head h2{font-size:1.5rem;color:var(--verde);margin:.5rem 0 .3rem} .modal-head .loc{font-size:.9rem;color:var(--gri-text)} .modal-tabs{display:flex;gap:0;border-bottom:2px solid var(--gri-border);overflow-x:auto} .mtab{background:none;border:none;border-bottom:3px solid transparent;padding:.9rem 1.3rem;font-family:var(--font-heading);font-weight:700;font-size:.84rem;color:var(--gri-text);cursor:pointer;white-space:nowrap;margin-bottom:-2px;transition:all var(--tr)} .mtab:hover{color:var(--verde)} .mtab.on{color:var(--verde);border-color:var(--verde)} .modal-tab-body{padding:1.75rem 2rem} .tab-pane{display:none} .tab-pane.on{display:block} .prez-kpis{display:flex;gap:1.25rem;flex-wrap:wrap;margin-bottom:1.5rem} .pkpi{background:var(--verde-pale);border-radius:var(--r);padding:.9rem 1.25rem;text-align:center;flex:1;min-width:110px} /* The funding source may be spelled out in full rather than abbreviated, so a value can be longer than the tile is wide. */ .pkpi-val{font-family:var(--font-heading);font-weight:900;font-size:1.5rem;color:var(--verde);display:block;overflow-wrap:break-word;line-height:1.2} .pkpi-lbl{font-size:.73rem;color:var(--gri-text);text-transform:uppercase;letter-spacing:.06em;margin-top:.15rem} .prez-text{color:var(--gri-text);line-height:1.75;font-size:.97rem} .prez-text p+p{margin-top:.75rem} /* Block content the client adds in the project editor (images, links, lists…). */ .prez-text img{max-width:100%;height:auto;border-radius:var(--r)} .prez-text figure{margin:1.1rem 0} .prez-text figcaption,.prez-text .wp-element-caption{font-size:.82rem;color:var(--gri-text);text-align:center;margin-top:.45rem} .prez-text a{color:var(--verde-mid);text-decoration:underline;font-weight:600} .prez-text a:hover{color:var(--verde)} .prez-text h2,.prez-text h3,.prez-text h4{color:var(--verde);line-height:1.3;margin:1.5rem 0 .6rem} .prez-text h2{font-size:1.2rem} .prez-text h3{font-size:1.05rem} .prez-text h4{font-size:.97rem} .prez-text ul,.prez-text ol{margin:.75rem 0 .75rem 1.4rem} .prez-text li{margin-bottom:.4rem} .prez-text blockquote{margin:1.1rem 0;padding:.75rem 1.1rem;background:var(--gri-bg);border-left:4px solid var(--auriu);font-style:italic} .prez-text blockquote p+p{margin-top:.5rem} .prez-text .aligncenter{text-align:center} .prez-text .wp-block-button__link,.prez-text .wp-element-button{display:inline-block;background:var(--auriu);color:#3a2e00;padding:.5rem 1.1rem;border-radius:6px;text-decoration:none;font-weight:700} .prez-text .wp-block-button__link:hover,.prez-text .wp-element-button:hover{color:#3a2e00;filter:brightness(.95)} .doc-list{display:flex;flex-direction:column;gap:.75rem} .doc-row{display:flex;align-items:center;gap:1rem;padding:.85rem 1rem;border-radius:var(--r);background:var(--gri-bg);border:1px solid var(--gri-border);transition:border-color var(--tr)} .doc-row:hover{border-color:var(--verde-mid)} .doc-ico{font-size:1.4rem;flex-shrink:0} .doc-info{flex:1} .doc-name{font-weight:600;font-size:.9rem;color:var(--text-dark)} .doc-meta{font-size:.78rem;color:var(--gri-text);margin-top:.1rem} .doc-dl{font-size:.82rem;font-weight:700;color:var(--verde-mid);padding:.35rem .8rem;border-radius:6px;border:1.5px solid var(--verde-mid);white-space:nowrap;transition:all var(--tr)} .doc-dl:hover{background:var(--verde);color:#fff;border-color:var(--verde)} .doc-placeholder{border:2px dashed var(--gri-border);border-radius:var(--r);padding:2rem;text-align:center;color:var(--gri-text);font-size:.9rem} .doc-placeholder label{cursor:pointer;color:var(--verde-mid);font-weight:600} .doc-placeholder input[type=file]{display:none} .link-achizitii{display:flex;align-items:center;gap:1rem;padding:1.1rem 1.25rem;border-radius:var(--r);background:var(--verde-pale);border:1.5px solid var(--verde-light);color:var(--verde);font-weight:600;font-size:.95rem;transition:all var(--tr);margin-bottom:1.25rem} .link-achizitii:hover{background:var(--verde);color:#fff} .modal-fm-footer{background:var(--gri-bg);padding:.9rem 2rem;border-top:1px solid var(--gri-border);display:flex;flex-direction:column;align-items:center;gap:.5rem} .fm2-box{--fm-logo-h:26px} .modal-fm-footer p{font-size:.76rem;color:var(--gri-text);font-style:italic;text-align:center} /* ── ANUNTURI ── */ #anunturi{background:var(--alb)} .anunt-tabs{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1.75rem} .atab{background:var(--alb);border:1.5px solid var(--gri-border);border-radius:20px;padding:.38rem 1.1rem;font-family:var(--font-heading);font-weight:700;font-size:.83rem;color:var(--gri-text);cursor:pointer;transition:all var(--tr)} .atab:hover,.atab.on{background:var(--verde);color:#fff;border-color:var(--verde)} #anunt-list{display:flex;flex-direction:column;gap:.85rem;min-height:80px} .anunt-row{display:flex;align-items:center;gap:1.25rem;padding:1rem 1.25rem;border-radius:var(--r);background:var(--gri-bg);border:1.5px solid var(--gri-border);transition:border-color var(--tr),box-shadow var(--tr)} .anunt-row:hover{border-color:var(--verde-mid);box-shadow:var(--sh)} .ar-ico{font-size:1.4rem;flex-shrink:0} .ar-info{flex:1} .ar-title{font-weight:600;font-size:.95rem;color:var(--text-dark)} .ar-sub{font-size:.78rem;color:var(--gri-text);margin-top:.1rem;display:flex;gap:.75rem;flex-wrap:wrap;align-items:center} .ar-badge{font-size:.66rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;padding:.12em .5em;border-radius:3px} .badge-caiet{background:#EAF4EF;color:#1C4B35} .badge-clarif{background:#FFF3CC;color:#7A5C00} .badge-raport{background:#EEF2FF;color:#3730A3} .badge-atribuire{background:#ECFDF5;color:#065F46} .badge-general{background:var(--gri-bg);color:var(--gri-text)} .ar-desc{font-size:.85rem;color:var(--gri-text);margin-top:.5rem;line-height:1.55;max-width:64ch} .ar-desc p{margin:0 0 .5rem} .ar-desc p:last-child{margin-bottom:0} .ar-desc a{color:var(--verde-mid);text-decoration:underline} .ar-dl{font-size:.82rem;font-weight:700;color:var(--verde-mid);padding:.35rem .85rem;border-radius:6px;border:1.5px solid var(--verde-mid);white-space:nowrap;transition:all var(--tr)} .ar-dl:hover{background:var(--verde);color:#fff;border-color:var(--verde)} .anunt-empty{text-align:center;padding:2.5rem;color:var(--gri-text);font-style:italic;font-size:.95rem} .admin-wrap{margin-top:2.5rem} .admin-toggle-btn{background:none;border:1.5px solid var(--gri-border);border-radius:var(--r);padding:.5rem 1.1rem;font-size:.82rem;color:var(--gri-text);cursor:pointer;display:inline-flex;align-items:center;gap:.5rem;transition:all var(--tr)} .admin-toggle-btn:hover{border-color:var(--verde);color:var(--verde)} .admin-panel{display:none;margin-top:1.25rem;background:var(--gri-bg);border:2px dashed var(--gri-border);border-radius:var(--r-lg);padding:1.5rem} .admin-panel.open{display:block} .admin-panel h4{font-size:1rem;color:var(--verde);margin-bottom:1.25rem} .admin-gate{display:flex;gap:.75rem;align-items:center;margin-bottom:1rem} .admin-gate input{flex:1;padding:.55rem .9rem;border:1.5px solid var(--gri-border);border-radius:var(--r);font-size:.9rem;font-family:inherit} .admin-gate input:focus{outline:none;border-color:var(--verde-mid)} .admin-form{display:grid;grid-template-columns:1fr 1fr;gap:1rem} .frow{display:flex;flex-direction:column;gap:.3rem} .frow label{font-size:.76rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--gri-text)} .frow input,.frow select,.frow textarea{padding:.6rem .85rem;border:1.5px solid var(--gri-border);border-radius:var(--r);font-family:inherit;font-size:.9rem;background:var(--alb);color:var(--text-dark);transition:border-color var(--tr)} .frow input:focus,.frow select:focus,.frow textarea:focus{outline:none;border-color:var(--verde-mid);box-shadow:0 0 0 3px rgba(42,102,73,.1)} .frow.full{grid-column:1/-1} .admin-form>.btn{grid-column:1/-1;justify-self:start} /* ── CONTACT ── The details column is core blocks; the form is the server-rendered gadovia/contact-form block, whose markup site.js binds to by id. */ .sec--contact{background:var(--verde)} .sec--contact .eyebrow{background:rgba(232,168,0,.2);color:var(--auriu)} .sec--contact .sec-head h2{color:#fff} .sec--contact .sec-head p:not(.eyebrow){color:rgba(255,255,255,.65)} .contact-grid.wp-block-columns{align-items:flex-start!important} /* 1fr / 1.4fr. Expressed as flex-grow rather than column widths: a flex-basis percentage measures the full track, while a grid divides what is left after the gap. The guard lets a width set in the editor take over. */ .contact-grid>.wp-block-column:not([style*="flex-basis"]):first-child{flex-grow:1} .contact-grid>.wp-block-column:not([style*="flex-basis"]):last-child{flex-grow:1.4} .contact-items{padding-top:.25rem} /* A flex layout zeroes its children's margins via `.wp-container-… > *`, at the same specificity as a lone `.ci-ico`. The parent class restores the nudge. */ .ci-ico{font-size:1.3rem} .ci .ci-ico{margin-top:.1rem} .ci-lbl{display:block;font-weight:700;color:var(--auriu);font-size:.78rem;text-transform:uppercase;letter-spacing:.09em;margin-bottom:.25rem} .ci-val,.ci-val a{color:rgba(255,255,255,.78);font-size:.97rem} .ci-val a:hover{color:var(--auriu)} .contact-form-box{background:var(--alb);border-radius:var(--r-lg);padding:2rem;box-shadow:var(--sh-lg)} .contact-form-box h3{color:var(--verde);font-size:1.2rem;margin-bottom:1.5rem} .contact-form-box .frow{margin-bottom:.9rem} .frow-check label{flex-direction:row;align-items:center;gap:.5rem;font-size:.82rem;font-weight:600;text-transform:none;letter-spacing:0;color:var(--gri-text);cursor:pointer} .frow-check input[type=checkbox]{width:auto;margin:0;accent-color:var(--verde-mid)} .contact-form-box .btn{width:100%;justify-content:center;margin-top:.25rem} .form-foot{text-align:center;font-size:.82rem;color:var(--gri-text);margin-top:.75rem} .form-foot a{color:var(--verde-mid);font-weight:600} /* ── FOOTER ── */ /* .site-footer carries the skin: the