/*
Theme Name: Eco Green Power
Theme URI: https://ecogreenpower.com.au/
Author: Northscroll
Description: Custom one-page theme for Eco Green Power, Affordable and Quality Solar Services for Residential and Commercial purposes. Includes the brand logo, Clean Energy Council and Solar Victoria accreditation logos, all site photography, and a built-in contact form that emails the site admin address.
Version: 1.0.1
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ecogreenpower
*/

/* Layout: white header carrying the brand + accreditation logos, deep-eucalyptus hero, alternating paper / forest bands; sun-amber only for actions and numbers */
:root{
  --forest:#0D3A2B;
  --forest-2:#145240;
  --leaf:#2E9A4E;        /* from the EGP leaf */
  --sky:#1F5FA8;         /* from the EGP letterforms */
  --sun:#F6B21E;         /* from the EGP sun */
  --sun-hi:#FFC845;
  --paper:#F3F7F1;
  --white:#FFFFFF;
  --ink:#0F2019;
  --muted:#4B6157;
  --line:#DBE5DA;
  --on-forest:#E8F2EC;
  --on-forest-muted:#A8C3B5;
  --display:"Bricolage Grotesque","Segoe UI",system-ui,sans-serif;
  --body:"Figtree","Segoe UI",system-ui,-apple-system,sans-serif;
  --radius:18px;
  --wrap:1220px;
  --header-h:92px;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 12px)}
body{margin:0;font-family:var(--body);font-size:17px;line-height:1.65;color:var(--ink);background:var(--white);-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--white)}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--display);line-height:1.1;margin:0;text-wrap:balance;letter-spacing:-.02em}
h2{font-size:clamp(2rem,4vw,3rem);font-weight:700}
h3{font-size:1.28rem;font-weight:600;letter-spacing:-.01em}
p{margin:0}
.wrap{max-width:var(--wrap);margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--leaf)}
.eyebrow::before{content:"";width:22px;height:2px;background:currentColor;border-radius:2px}
.lead{font-size:1.12rem;color:var(--muted);max-width:60ch}
.btn{display:inline-flex;align-items:center;gap:10px;padding:15px 26px;border-radius:999px;font-weight:700;font-size:1rem;text-decoration:none;border:0;cursor:pointer;font-family:var(--body);transition:transform .2s ease,background .2s ease,box-shadow .2s ease}
.btn svg{width:18px;height:18px;transition:transform .2s ease}
.btn:hover svg{transform:translateX(3px)}
.btn-sun{background:var(--sun);color:var(--forest)}
.btn-sun:hover{background:var(--sun-hi);box-shadow:0 10px 26px -10px rgba(246,178,30,.85)}
.btn-forest{background:var(--forest);color:var(--white)}
.btn-forest:hover{background:var(--forest-2)}
.btn-ghost{background:transparent;color:var(--on-forest);box-shadow:inset 0 0 0 1.5px rgba(232,242,236,.4)}
.btn-ghost:hover{box-shadow:inset 0 0 0 1.5px var(--on-forest)}
:focus-visible{outline:3px solid var(--sun);outline-offset:3px;border-radius:6px}
.section{padding-block:clamp(72px,9vw,120px)}

/* Header */
.site-header{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:rgba(255,255,255,.95);backdrop-filter:saturate(160%) blur(12px);-webkit-backdrop-filter:saturate(160%) blur(12px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:20px;height:var(--header-h)}
.brand img{height:70px;width:auto}
.nav-links{display:flex;align-items:center;gap:4px;list-style:none;margin:0;padding:0}
.nav-links a{display:block;padding:10px 16px;border-radius:999px;text-decoration:none;font-weight:600;font-size:1rem;color:var(--ink);transition:background .2s,color .2s}
.nav-links a:hover{background:var(--paper);color:var(--forest)}
.accred{display:flex;align-items:center;gap:22px}
.accred img{height:58px;width:auto}
.accred img.sv{height:46px}
.accred-divider{width:1px;height:44px;background:var(--line)}
.menu-btn{display:none;background:none;border:0;padding:10px;cursor:pointer;color:var(--ink)}
.menu-btn svg{width:28px;height:28px}
.accred-strip{display:none;background:var(--white);border-bottom:1px solid var(--line)}
.accred-strip .wrap{display:flex;align-items:center;justify-content:center;gap:28px;padding-block:14px}
.accred-strip img{height:52px;width:auto}
.accred-strip img.sv{height:40px}

/* Hero */
.hero{background:var(--forest);color:var(--on-forest);position:relative;overflow:hidden;padding-block:clamp(56px,7vw,96px)}
.hero::before{content:"";position:absolute;right:-180px;top:-220px;width:640px;height:640px;border-radius:50%;background:radial-gradient(circle,rgba(246,178,30,.34),rgba(246,178,30,0) 65%);pointer-events:none}
.hero-grid{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(32px,5vw,72px);align-items:center}
.hero-grid > *{min-width:0}
.hero h1{font-size:clamp(2.3rem,5vw,4rem);font-weight:800;color:var(--white);letter-spacing:-.03em}
.hero h1 em{font-style:normal;color:var(--sun)}
.hero p{margin-top:22px;font-size:1.15rem;color:var(--on-forest-muted);max-width:52ch}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
.hero-trust{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:40px;padding-top:28px;border-top:1px solid rgba(232,242,236,.16);font-size:.9rem;color:var(--on-forest-muted)}
.hero-trust .chips{display:flex;gap:10px;flex-wrap:wrap}
.hero-trust .chip{background:var(--white);border-radius:12px;padding:8px 12px;display:flex;align-items:center}
.hero-trust .chip img{height:34px;width:auto}
.hero-trust .chip img.sv{height:28px}
.hero-media{position:relative}
.hero-media img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:28px 28px 28px 120px;box-shadow:0 40px 80px -30px rgba(0,0,0,.55)}
.sun-badge{position:absolute;left:-26px;bottom:34px;display:flex;align-items:center;gap:12px;background:var(--white);color:var(--ink);padding:12px 20px 12px 12px;border-radius:999px;box-shadow:0 18px 40px -16px rgba(0,0,0,.45);font-weight:700;font-size:.95rem}
.sun-badge .ic{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--sun);color:var(--forest)}
.sun-badge svg{width:22px;height:22px}
.rise{animation:rise .8s cubic-bezier(.2,.7,.2,1) both}
.rise.d2{animation-delay:.12s}.rise.d3{animation-delay:.24s}
@keyframes rise{from{transform:translateY(14px)}to{transform:none}}

/* Intro */
.intro-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(32px,6vw,90px);align-items:center}
.intro-grid > *{min-width:0}
.intro-copy{display:flex;flex-direction:column;gap:20px}
.mosaic{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:16px;height:540px}
.mosaic img{width:100%;height:100%;object-fit:cover;border-radius:var(--radius)}
.mosaic img:first-child{grid-row:span 2}

/* Heads + bands */
.head{display:flex;flex-direction:column;gap:16px;max-width:720px;margin-bottom:clamp(40px,5vw,60px)}
.head.center{margin-inline:auto;text-align:center;align-items:center}
.head.tight{margin-bottom:0}
.band-paper{background:var(--paper)}
.band-forest{background:var(--forest);color:var(--on-forest)}
.band-forest h2,.band-forest h3{color:var(--white)}
.band-forest .lead{color:var(--on-forest-muted)}
.band-forest .eyebrow{color:var(--sun)}

/* Feature split */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);align-items:center}
.split > *{min-width:0}
.split-img{width:100%;height:100%;min-height:460px;object-fit:cover;border-radius:var(--radius)}
.feature-list{display:flex;flex-direction:column;margin-top:20px}
.feature{display:grid;grid-template-columns:56px 1fr;gap:18px;padding:22px 0;border-bottom:1px solid var(--line)}
.feature:last-child{border-bottom:0}
.feature p{color:var(--muted);margin-top:6px}
.ic-box{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;background:var(--forest);color:var(--sun);flex:none}
.ic-box svg{width:26px;height:26px}
.split .btn{margin-top:22px}

/* Cards */
.cards-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.svc{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:34px 30px;display:flex;flex-direction:column;gap:14px;transition:transform .25s ease,box-shadow .25s ease,border-color .25s}
.svc:hover{transform:translateY(-4px);box-shadow:0 26px 50px -30px rgba(13,58,43,.45);border-color:transparent}
.svc .ic-box{background:var(--paper);color:var(--forest)}
.svc p{color:var(--muted)}

/* About */
.about-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(32px,6vw,90px);align-items:center}
.about-grid > *{min-width:0}
.about-img{width:100%;aspect-ratio:5/4;object-fit:cover;border-radius:var(--radius)}
.about-copy{display:flex;flex-direction:column;gap:20px}

/* Stats */
.stats-top{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);align-items:end;margin-bottom:clamp(40px,5vw,64px)}
.stats-top > *{min-width:0}
.stats-top img{width:100%;height:270px;object-fit:cover;border-radius:var(--radius)}
.stats{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(232,242,236,.18)}
.stat{padding:34px 28px 6px 0;display:flex;flex-direction:column;gap:10px}
.stat + .stat{padding-left:28px;border-left:1px solid rgba(232,242,236,.18)}
.stat .num{font-family:var(--display);font-weight:800;font-size:clamp(3.2rem,6vw,4.8rem);line-height:1;color:var(--sun);letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.stat .num small{font-size:.5em;margin-left:2px}
.stat h3{font-size:1.15rem}
.stat p{color:var(--on-forest-muted);font-size:.98rem}

/* Trust */
.trust{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.trust-item{background:var(--white);border-radius:var(--radius);padding:30px 26px;display:flex;flex-direction:column;gap:14px;border:1px solid var(--line)}
.trust-item p{color:var(--muted);font-size:.97rem}
.trust-item .ic-box{background:var(--sun);color:var(--forest)}
.accred-panel{margin-top:28px;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:24px 30px;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:20px 48px}
.accred-panel span{font-size:.8rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.accred-panel img{height:64px;width:auto}
.accred-panel img.sv{height:50px}

/* Service image cards */
.img-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.img-card{position:relative;border-radius:var(--radius);overflow:hidden;min-height:420px;display:flex;align-items:flex-end;color:var(--white);isolation:isolate}
.img-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .6s ease}
.img-card::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(13,58,43,0) 30%,rgba(8,34,25,.93) 100%)}
.img-card:hover img{transform:scale(1.05)}
.img-card .body{padding:28px;display:flex;flex-direction:column;gap:8px}
.img-card h3{color:var(--white)}
.img-card p{color:#D6E5DB}

/* Impact */
.impact{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(32px,5vw,72px);align-items:center}
.impact > *{min-width:0}
.impact-img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:28px 120px 28px 28px}
.impact-list{display:flex;flex-direction:column;gap:14px;margin-top:30px}
.impact-row{display:grid;grid-template-columns:48px 1fr;gap:16px;padding:20px;border-radius:16px;background:var(--paper)}
.impact-row .ic-box{width:48px;height:48px;border-radius:14px}
.impact-row .ic-box svg{width:22px;height:22px}
.impact-row p{color:var(--muted);margin-top:4px;font-size:.98rem}
.impact .btn{margin-top:30px}
.no-top{padding-top:0}

/* Testimonials */
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.quote{margin:0;background:var(--forest-2);border-radius:var(--radius);padding:32px 30px;display:flex;flex-direction:column;gap:26px;justify-content:space-between}
.quote .mark{color:var(--sun);width:38px;height:38px}
.quote blockquote{margin:14px 0 0;font-family:var(--display);font-size:1.28rem;line-height:1.38;font-weight:500;color:var(--white);letter-spacing:-.01em}
.who{display:flex;align-items:center;gap:14px;padding-top:20px;border-top:1px solid rgba(232,242,236,.16)}
.who img{width:48px;height:48px;border-radius:50%;object-fit:cover}
.who h4{font-size:1rem;color:var(--white);letter-spacing:0}
.who span{font-size:.9rem;color:var(--on-forest-muted)}

/* Contact */
.contact-card{display:grid;grid-template-columns:.9fr 1.1fr;border-radius:28px;overflow:hidden;background:var(--white);box-shadow:0 40px 80px -50px rgba(13,58,43,.5);border:1px solid var(--line)}
.contact-card > *{min-width:0}
.contact-side{position:relative;min-height:540px;color:var(--white);display:flex;align-items:flex-end;isolation:isolate}
.contact-side img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.contact-side::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(13,58,43,.1),rgba(13,58,43,.92))}
.contact-side .body{padding:36px;display:flex;flex-direction:column;gap:12px}
.contact-side .eyebrow{color:var(--sun)}
.contact-side h2{color:var(--white);font-size:clamp(1.9rem,3vw,2.5rem)}
.contact-side p{color:#D6E5DB}
.contact-form{padding:clamp(28px,4vw,48px);display:grid;grid-template-columns:1fr 1fr;gap:18px;align-content:start}
.field{display:flex;flex-direction:column;gap:8px;min-width:0}
.field.full{grid-column:1/-1}
.contact-form label{font-weight:600;font-size:.92rem}
.contact-form .req{color:#B4410C}
.contact-form input,.contact-form textarea{font:inherit;font-size:1rem;padding:14px 16px;border-radius:12px;border:1.5px solid var(--line);background:var(--paper);color:var(--ink);transition:border-color .2s,background .2s;width:100%}
.contact-form input:focus,.contact-form textarea:focus{outline:none;border-color:var(--leaf);background:var(--white)}
.contact-form textarea{min-height:150px;resize:vertical}
.contact-form .btn{justify-self:start}
.form-note{grid-column:1/-1;padding:14px 16px;border-radius:12px;font-weight:600;font-size:.95rem}
.form-note.ok{background:#E3F4E8;color:#14532D}
.form-note.err{background:#FDECEC;color:#8A1C1C}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* Footer */
.site-footer{background:var(--ink);color:#C7D6CD;padding-block:64px 30px}
.foot-top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:30px;padding-bottom:36px;border-bottom:1px solid rgba(255,255,255,.1)}
.foot-logo{background:var(--white);padding:10px 16px;border-radius:14px;display:inline-block}
.foot-logo img{height:64px;width:auto}
.foot-nav{display:flex;flex-wrap:wrap;gap:8px 28px;list-style:none;margin:0;padding:0}
.foot-nav a{text-decoration:none;font-weight:600}
.foot-nav a:hover{color:var(--sun)}
.foot-accred{display:flex;gap:10px}
.foot-accred span{background:var(--white);border-radius:10px;padding:6px 10px;display:flex;align-items:center}
.foot-accred img{height:36px;width:auto}
.foot-accred img.sv{height:28px}
.social{display:flex;gap:10px}
.social a{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(255,255,255,.18);transition:background .2s,color .2s,border-color .2s}
.social a:hover{background:var(--sun);color:var(--forest);border-color:var(--sun)}
.social svg{width:18px;height:18px}
.foot-bottom{padding-top:26px;font-size:.9rem;color:#8EA399;display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px}

/* Responsive */
@media (max-width:1140px){
  .accred{display:none}
  .accred-strip{display:block}
  .trust{grid-template-columns:repeat(2,1fr)}
  .cards-3,.img-cards,.quotes{grid-template-columns:1fr 1fr}
  .cards-3 > :last-child,.img-cards > :last-child,.quotes > :last-child{grid-column:1/-1}
}
@media (max-width:880px){
  :root{--header-h:76px}
  .brand img{height:56px}
  .nav-links{position:absolute;top:var(--header-h);left:0;right:0;flex-direction:column;align-items:stretch;background:var(--white);padding:12px max(20px,env(safe-area-inset-right,0px)) 20px max(20px,env(safe-area-inset-left,0px));border-bottom:1px solid var(--line);gap:4px;display:none}
  .nav-links.open{display:flex}
  .menu-btn{display:block}
  .hero-grid,.intro-grid,.split,.about-grid,.stats-top,.impact,.contact-card{grid-template-columns:1fr}
  .hero-media img{aspect-ratio:4/3}
  .sun-badge{left:16px;bottom:16px}
  .mosaic{height:440px}
  .split-img{min-height:300px}
  .about-img{order:-1}
  .stats{grid-template-columns:1fr}
  .stat,.stat + .stat{padding:26px 0;border-left:0;border-bottom:1px solid rgba(232,242,236,.18)}
  .contact-side{min-height:300px}
}
@media (max-width:640px){
  body{font-size:16px}
  .accred-strip .wrap{gap:18px}
  .accred-strip img{height:44px}
  .accred-strip img.sv{height:34px}
  .trust,.cards-3,.img-cards,.quotes{grid-template-columns:1fr}
  .cards-3 > :last-child,.img-cards > :last-child,.quotes > :last-child{grid-column:auto}
  .mosaic{height:360px;gap:10px}
  .contact-form{grid-template-columns:1fr}
  .img-card{min-height:340px}
  .sun-badge{font-size:.85rem}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
.foot-bottom .credit a{color:var(--white);font-weight:700;text-decoration:underline;text-decoration-color:var(--sun);text-underline-offset:4px;text-decoration-thickness:2px;transition:color .2s}
.foot-bottom .credit a:hover{color:var(--sun)}

/* WordPress pages and posts (fallback template) */
.wp-content{padding-block:clamp(56px,7vw,96px)}
.wp-content .entry{max-width:780px;margin:0 auto}
.wp-content .entry + .entry{margin-top:64px;padding-top:64px;border-top:1px solid var(--line)}
.wp-content .entry-title{font-size:clamp(2rem,4vw,3rem);margin-bottom:24px}
.wp-content .entry-title a{text-decoration:none}
.wp-content .entry-body > * + *{margin-top:1.1em}
.wp-content .entry-body img{border-radius:var(--radius);height:auto}
.wp-content .entry-body a{color:var(--leaf)}
.admin-bar .site-header{top:32px}
@media (max-width:782px){.admin-bar .site-header{top:46px}}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
.skip-link:focus{position:fixed;left:16px;top:16px;z-index:100;width:auto;height:auto;clip:auto;background:var(--white);padding:12px 18px;border-radius:10px;font-weight:700}