/*
Theme Name: Summit Road Landscaping
Author: Summit Road Landscaping
Description: Editable one-page theme for Summit Road Landscaping. Homepage content is a normal WordPress Page built from standard blocks — edit anytime in the Block Editor. Asymmetric, editorial layout with a dark green / gray palette and one light contrast panel.
Version: 3.0
Requires at least: 6.0
Requires PHP: 7.4
License: GPL v2 or later
Text Domain: summit-road
*/

:root{
  --bg-ink:#0E1913;
  --bg-panel:#1F3226;
  --paper:#F2EEE2;
  --paper-ink:#1A2019;
  --slate:#54615A;
  --slate-light:#95A197;
  --paper-dim:#C9C4B6;
  --accent:#8EA87E;
  --accent-deep:#5C7350;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg-ink);
  color:var(--paper-dim);
  font-family:'Inter',sans-serif;
  line-height:1.6;
  margin:0;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,.wp-block-heading{
  font-family:'Fraunces',serif; font-weight:500; line-height:1.02;
  letter-spacing:-0.015em; color:var(--paper);
}
a{color:inherit;}
img{max-width:100%; height:auto; display:block; border-radius:2px;}
p{color:var(--paper-dim);}

/* ---------- NAV ---------- */
header.site-header{position:fixed; top:0; left:0; right:0; z-index:50; background:rgba(14,25,19,0.82); backdrop-filter:blur(6px);}
.navwrap{max-width:1120px; margin:0 auto; padding:16px 32px; display:flex; align-items:center; justify-content:space-between;}
.brand{display:flex; align-items:center; gap:10px;}
.brand svg{width:32px; height:32px;}
.brand .name{font-family:'Fraunces',serif; font-size:16px; color:var(--paper);}
.brand .name span{display:block; font-family:'Inter',sans-serif; font-size:9.5px; letter-spacing:0.1em; color:var(--slate-light); margin-top:1px;}
.site-header nav ul{display:flex; gap:32px; list-style:none; margin:0; padding:0;}
.site-header nav a{font-size:14px; color:var(--paper-dim); text-decoration:none;}
.site-header nav a:hover{color:var(--paper);}
.navcta{border:1px solid var(--accent-deep); padding:8px 18px; border-radius:2px; font-size:13.5px; color:var(--accent); text-decoration:none;}
.navcta:hover{background:var(--accent-deep); color:var(--paper);}
@media(max-width:760px){ .site-header nav ul{display:none;} }
body.admin-bar header.site-header{top:32px;}
@media screen and (max-width:782px){ body.admin-bar header.site-header{top:46px;} }

/* ---------- PAGE WRAPPER ---------- */
.page-content{padding-top:110px;}
.page-content > .wp-block-group{max-width:1120px; margin-left:auto; margin-right:auto; padding:70px 32px;}
.page-content > .wp-block-group.is-style-full{max-width:none; padding-left:0; padding-right:0;}
.page-content > .wp-block-group.is-style-full > .wp-block-group__inner-container{max-width:1120px; margin:0 auto; padding:0 32px;}

/* Background rhythm */
.page-content > .wp-block-group.is-style-hero{background:var(--bg-ink); position:relative; overflow:hidden; padding-top:20px;}
.page-content > .wp-block-group.is-style-panel{background:var(--bg-panel) !important;}
.page-content > .wp-block-group.is-style-light{background:var(--paper) !important; color:var(--paper-ink); padding:100px 32px 120px;}
.page-content > .wp-block-group.is-style-light h2,
.page-content > .wp-block-group.is-style-light h3{color:var(--paper-ink);}
.page-content > .wp-block-group.is-style-light p{color:#3E463F;}
.page-content > .wp-block-group.is-style-ink{background:var(--bg-ink) !important;}

/* horizon-line divider before a section */
.has-divider{position:relative;}
.has-divider::before{
  content:""; position:absolute; top:0; left:0; right:0; height:56px;
  background-repeat:no-repeat; background-size:100% 100%;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1120 56' preserveAspectRatio='none'%3E%3Cpath d='M0 16 Q280 50 560 20 T1120 24 V56 H0 Z' fill='%231F3226'/%3E%3C/svg%3E");
}
.is-style-light.has-divider::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1120 56' preserveAspectRatio='none'%3E%3Cpath d='M0 16 Q280 50 560 20 T1120 24 V56 H0 Z' fill='%23F2EEE2'/%3E%3C/svg%3E");
}
.is-style-ink.has-divider::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1120 56' preserveAspectRatio='none'%3E%3Cpath d='M0 16 Q280 50 560 20 T1120 24 V56 H0 Z' fill='%230E1913'/%3E%3C/svg%3E");
}

/* ---------- HERO ---------- */
.hero-inner{display:grid; grid-template-columns:1.3fr 0.7fr; gap:20px; align-items:end; padding-top:40px;}
.hero-inner h1{font-size:clamp(40px,7.2vw,84px); max-width:11ch; margin:0;}
.hero-sub p{font-size:15.5px; color:var(--slate-light); max-width:30ch;}
@media(max-width:800px){ .hero-inner{grid-template-columns:1fr;} }

/* Buttons */
.wp-block-buttons{gap:14px !important; margin-top:22px !important;}
.wp-block-button__link{border-radius:2px !important; font-size:14.5px !important; font-weight:500 !important; padding:13px 26px !important;}
.wp-block-button.btn-primary .wp-block-button__link{background:var(--accent-deep) !important; color:var(--paper) !important;}
.wp-block-button.btn-primary .wp-block-button__link:hover{background:var(--accent) !important;}
.wp-block-button.btn-ghost .wp-block-button__link{background:transparent !important; color:var(--paper-dim) !important; border:1px solid rgba(242,238,226,0.25);}
.wp-block-button.btn-ghost .wp-block-button__link:hover{border-color:var(--paper-dim); color:var(--paper) !important;}

/* ---------- SERVICES: editorial rows, not cards ---------- */
.service-row{display:grid; grid-template-columns:0.9fr 1.6fr; gap:40px; padding:34px 0; border-top:1px solid rgba(242,238,226,0.1);}
.service-row:last-child{border-bottom:1px solid rgba(242,238,226,0.1);}
.service-row h3{font-size:26px; font-weight:400; margin:0;}
.service-row p{font-size:15px; max-width:52ch; align-self:center; margin:0;}
@media(max-width:760px){ .service-row{grid-template-columns:1fr; gap:8px;} }

/* ---------- WHY: overlapping image + card ---------- */
.why-grid{display:grid; grid-template-columns:1.05fr 0.95fr; gap:0; align-items:center;}
.why-copy{position:relative; z-index:2; background:var(--paper); padding-right:44px; margin-right:-60px;}
.why-copy p{max-width:42ch; margin-bottom:16px;}
@media(max-width:860px){ .why-grid{grid-template-columns:1fr; gap:24px;} .why-copy{margin-right:0; padding-right:0;} }

/* photo placeholder (swap for a real <img> block) */
.photo-placeholder{
  aspect-ratio:4/3; border-radius:2px; overflow:hidden;
  background:rgba(84,97,90,0.15); border:1.5px dashed var(--slate);
  display:flex; align-items:center; justify-content:center; text-align:center; padding:16px;
}
.is-style-light .photo-placeholder{background:rgba(84,97,90,0.08);}
.photo-placeholder p{font-size:13px; color:var(--slate-light); margin:0;}

/* ---------- GALLERY: masonry via CSS multi-column ---------- */
.masonry{columns:3 220px; column-gap:14px;}
.masonry > *{break-inside:avoid; margin-bottom:14px;}
.masonry .photo-placeholder{aspect-ratio:auto; min-height:180px;}
.masonry .wp-block-group:nth-child(2) .photo-placeholder,
.masonry .wp-block-group:nth-child(5) .photo-placeholder{min-height:260px;}
@media(max-width:700px){ .masonry{columns:2 160px;} }

/* ---------- CONTACT: overlapping card ---------- */
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:start;}
.contact-info h2{font-size:clamp(30px,4.4vw,46px); max-width:9ch;}
.contact-card{background:var(--bg-ink); border:1px solid rgba(242,238,226,0.08); border-radius:2px; padding:36px; margin-top:-30px;}
.info-row{display:flex; gap:12px; align-items:flex-start; margin-bottom:16px; font-size:14.5px;}
@media(max-width:860px){ .contact-grid{grid-template-columns:1fr;} .contact-card{margin-top:24px;} }

.contact-form-wrap{display:grid; gap:16px;}
.contact-form-wrap .row2{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.contact-form-wrap label{font-size:12px; color:var(--slate-light); display:block; margin-bottom:6px;}
.contact-form-wrap input,
.contact-form-wrap select,
.contact-form-wrap textarea{
  width:100%; background:var(--bg-panel); border:1px solid var(--slate); color:var(--paper);
  padding:12px 13px; font-size:14.5px; border-radius:2px; font-family:'Inter',sans-serif;
}
.contact-form-wrap input:focus,
.contact-form-wrap select:focus,
.contact-form-wrap textarea:focus{outline:none; border-color:var(--accent);}
.contact-form-wrap textarea{resize:vertical; min-height:90px;}
.contact-form-wrap .submit{
  background:var(--accent-deep); border:none; color:var(--paper); padding:13px 24px;
  border-radius:2px; font-size:14.5px; font-weight:500; cursor:pointer; width:fit-content;
}
.contact-form-wrap .submit:hover{background:var(--accent);}
.form-notice{padding:12px 14px; border-radius:2px; font-size:14px; margin-bottom:6px;}
.form-notice.success{background:rgba(142,168,126,0.15); border:1px solid var(--accent-deep);}
.form-notice.error{background:rgba(180,90,80,0.15); border:1px solid #a85c50;}
@media(max-width:760px){ .contact-form-wrap .row2{grid-template-columns:1fr;} }

/* ---------- FOOTER ---------- */
footer.site-footer{background:var(--bg-ink); border-top:1px solid rgba(242,238,226,0.08); padding:32px 0; font-size:13px; color:var(--slate-light);}
.footwrap{max-width:1120px; margin:0 auto; padding:0 32px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px;}
.footbrand{display:flex; align-items:center; gap:9px;}
.footbrand svg{width:20px; height:20px;}

/* ---------- ADMIN NOTICE / SETUP PAGE (wp-admin only, not front end) ---------- */
.summitroad-setup-wrap{max-width:640px;}
.summitroad-setup-wrap .card{background:#fff; border:1px solid #dcdcde; padding:20px; border-radius:4px; margin-top:16px;}