/* ART_IN'RELVA — targeted improvements, November 2026. The original design system stays intact. */
:root{--draft-line:#b1cda0;--draft-text:#d7e6c8}
html{scroll-padding-top:94px}
/* Full-bleed fixed navigation. Transparent over the first slide; solid as soon as the reader scrolls. */
.site-header,.site-header.is-scrolled{
 position:fixed;inset:0 0 auto;top:0;left:0;right:0;width:100%;max-width:none;margin:0;height:96px;padding:12px clamp(24px,5.6vw,100px);
 border:0;border-radius:0;display:flex;align-items:center;gap:clamp(18px,2.5vw,45px);
 background:transparent;box-shadow:none;backdrop-filter:none;
 transition:background .32s ease,box-shadow .32s ease,height .3s ease,color .3s ease;
 z-index:100;color:#fff;
}
.site-header .brand{position:relative;z-index:103}
.site-header .brand img{width:clamp(177px,16vw,228px);height:auto;max-height:79px;object-fit:contain;filter:brightness(0) invert(1);transition:filter .3s,transform .3s}
.site-header .brand:hover img{transform:translateY(-1px)}
.site-header .nav{gap:clamp(14px,1.8vw,30px);font-size:11px;font-weight:600}
.site-header .nav a{color:inherit}
.site-header .nav a:after{background:currentColor}
.site-header .header-cta{position:relative;z-index:103}
.site-header.is-scrolled,.inner-page .site-header{background:#fffffff8;color:var(--green-deep);box-shadow:0 9px 30px #102b1720;backdrop-filter:blur(16px)}
.site-header.is-scrolled .brand img,.inner-page .site-header .brand img{filter:none}
.inner-page main{padding-top:96px}
.hero{margin:0;width:100%;height:100svh;min-height:700px;max-height:none;border-radius:0}
.hero-content{bottom:clamp(60px,10vh,126px)}
.hero-scroll{display:none!important}
.mobile-menu-meta{display:none}
/* 2007 becomes an independent, properly aligned editorial date plate. */
.about-stack{overflow:visible}
.since-box,.since-box:nth-child(n){position:absolute;z-index:3;top:34px;right:calc(100% + 26px);left:auto;width:216px;min-height:102px;margin:0;padding:22px 25px;transform:none;
 display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:6px;border-radius:2px;border-left:3px solid var(--bright);box-shadow:0 14px 30px #0b211536}
.since-box strong{font-size:43px;letter-spacing:-1.8px;line-height:1}
.since-box>span{max-width:none;line-height:1.55;font-size:8px;letter-spacing:1.4px}
/* Architectural concept drawing: three actual plans, not moving decorative arcs. */
.transform-banner{min-height:475px;background:#112117;padding:84px 25px}
.blueprint{z-index:-1;inset:0;overflow:hidden}
.draft-grid{position:absolute;inset:0;background-image:linear-gradient(#b5cfaa0c 1px,transparent 1px),linear-gradient(90deg,#b5cfaa0c 1px,transparent 1px);background-size:25px 25px;opacity:.75}
.blueprint:after{content:'';position:absolute;inset:0;z-index:1;background:radial-gradient(ellipse at center,#112117f2 0%,#112117bc 28%,#11211725 74%,#1121178f 100%);pointer-events:none}
.blueprint .garden-plan{position:absolute;inset:0;height:100%;width:100%;max-width:none;left:0;overflow:visible}
.draft-framework{fill:none;stroke:var(--draft-line);stroke-width:1;stroke-opacity:.31}
.draft-framework text,.draft-north text{fill:var(--draft-text);stroke:none;font:11px 'Montserrat',sans-serif;letter-spacing:2px}
.draft-framework .draft-measure,.draft-measure{stroke:#c7d9b2;stroke-opacity:.55;stroke-dasharray:4 5;fill:none;stroke-width:1;marker-start:url(#arrow-m);marker-end:url(#arrow-m)}
.blueprint-plan{opacity:0;transform:translateY(12px) scale(.988);transform-origin:center;transition:opacity 1.25s ease,transform 1.25s cubic-bezier(.2,.7,.2,1)}
.blueprint-plan.active{opacity:.88;transform:none}
.blueprint-plan .plot-fill{fill:#91c65b08;stroke:#d8ebbc52;stroke-width:1}
.blueprint-plan .lawn{fill:url(#draft-hatch);stroke:#92c97094;stroke-width:2}
.blueprint-plan .deck{fill:url(#draft-deck);stroke:#d5dfb366;stroke-width:2}
.blueprint-plan .pool{fill:#9fc9e11a;stroke:#b2dce9b8;stroke-width:2.2}
.blueprint-plan .pathway{fill:none;stroke:#e2e9c0b2;stroke-width:16;stroke-dasharray:3 8}
.blueprint-plan .tree{fill:#92c5680a;stroke:#a8cf878c;stroke-width:1.5;stroke-dasharray:6 6}
.blueprint-plan text{font:10px 'Montserrat',sans-serif;letter-spacing:2px;fill:#d0e6ba}
.blueprint-plan .plan-label{font-size:9px;font-weight:700;letter-spacing:2px}
.draft-north{fill:none;stroke:#cbd7a8b3;stroke-width:1.6}
.draft-caption{position:absolute;bottom:20px;left:clamp(25px,5.5vw,96px);right:clamp(25px,5.5vw,96px);z-index:2;color:#cbd8be;display:flex;justify-content:space-between;gap:15px;align-items:center;font-size:9px;letter-spacing:1.4px;font-weight:600;opacity:.85}
.draft-caption b{font-weight:700;color:#b7d889}
.transform-content{z-index:3}
/* Use the exact grass silhouette from the logo — not a generic leaf. */
.services .leaf-mark{width:142px;height:52px;display:flex;justify-content:center;align-items:center;margin:0 auto 8px}
.services .leaf-mark img{display:block;width:142px;height:49px;object-fit:contain}
/* One continuously animated tuft. No swapping or crossfading three images. */
.grass-photo-area{overflow:visible}
.grass-images.grass-growth-scene{position:relative;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 50% 85%,#eef5e5 0%,#fff 65%)}
.grass-scene-stage{position:absolute;inset:0;overflow:hidden}
.grass-growth-img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center bottom;
 transform-origin:50% 91%;transform:scaleY(var(--grass-scale,.64));transition:transform 1050ms cubic-bezier(.18,.83,.27,1);will-change:transform;mix-blend-mode:multiply}
.grass-guide-rule{position:absolute;left:6%;right:6%;bottom:9%;height:1px;background:linear-gradient(90deg,transparent,#d8e5d3,transparent)}
.grass-ground-line{position:absolute;bottom:7%;height:2px;width:58%;left:21%;background:linear-gradient(90deg,transparent,#9fc56b99,transparent)}
.height-display{z-index:2}
/* The WhatsApp badge uses an actual filled mark rather than two thin, inaccurate strokes. */
.floating-contact{background:#195335;right:23px;bottom:23px;box-shadow:0 9px 24px #163c2e46;border:2px solid #ffffff8a}
.floating-contact svg{width:27px;height:27px;display:block;stroke:none;fill:#fff}
/* Deepen the four existing service pages with genuine company-project imagery and practical guidance. */
.detail-journey{background:#f2f5ee;padding-top:100px;padding-bottom:105px}
.detail-section-head{max-width:780px;margin-bottom:50px}
.detail-section-head h2{font-size:clamp(38px,4.2vw,61px);margin-bottom:14px}
.detail-section-head>p:last-child{font-size:13px;color:#697c68}
.detail-journey-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.detail-journey-grid article{background:#fff;padding:38px 30px 33px;border-top:3px solid #8bb65e;min-height:253px;box-shadow:0 14px 30px #142a1710}
.detail-step-count{display:block;font-family:var(--display);font-size:43px;font-weight:700;color:#91b15d;line-height:1;margin-bottom:27px}
.detail-journey-grid h3{font-size:23px;letter-spacing:-.6px;margin-bottom:13px}
.detail-journey-grid p{color:#6b7b6c;font-size:12px;line-height:1.85;margin:0}
.detail-inspiration{padding-top:105px;padding-bottom:75px}
.detail-inspiration-heading{display:grid;grid-template-columns:48% 45%;column-gap:7%;align-items:end;margin-bottom:43px}
.detail-inspiration-heading .eyebrow{grid-column:1/3;margin:0 0 15px}
.detail-inspiration-heading h2{font-size:clamp(40px,4.4vw,62px);margin:0}
.detail-inspiration-heading>p:last-child{margin:0;color:#64766a;font-size:14px;line-height:1.85}
.detail-editorial-gallery{display:grid;grid-template-columns:1.18fr .82fr;grid-template-rows:270px 270px;gap:15px}
.detail-photo-card{margin:0;position:relative;overflow:hidden;background:#163a29;border-radius:4px}
.detail-photo-card:first-child{grid-row:span 2}
.detail-photo-card img{width:100%;height:100%;object-fit:cover;transition:transform .85s cubic-bezier(.2,.7,.25,1)}
.detail-photo-card:hover img{transform:scale(1.035)}
.detail-photo-card:after{content:'';position:absolute;inset:35% 0 0;background:linear-gradient(0deg,#0c251fcf,transparent);pointer-events:none}
.detail-photo-card figcaption{position:absolute;bottom:20px;left:24px;right:20px;z-index:1;color:#fff}
.detail-photo-card figcaption span{display:block;font-size:20px;font-weight:750;line-height:1.35;letter-spacing:-.6px}
.detail-photo-card figcaption small{display:block;color:#e5ece0;font-size:11px;line-height:1.6;margin-top:5px}
.detail-gallery-disclaimer{color:#758572;font-size:10px;margin:17px 0 0}
.detail-photos{padding-top:40px;padding-bottom:85px}
.detail-photos img{height:clamp(280px,30vw,475px)}
.detail-brief{background:#173728;color:#fff;display:grid;grid-template-columns:.95fr 1fr;gap:9%;align-items:center;padding-top:85px;padding-bottom:90px}
.detail-brief .eyebrow{color:#bad09d}
.detail-brief-copy h2{font-size:clamp(38px,4.3vw,61px);line-height:1.1;margin-bottom:22px}
.detail-brief-copy h2 span{color:#afd66e}
.detail-brief-copy>p:not(.eyebrow){font-size:13px;color:#d6e0d2;line-height:1.85;max-width:450px;margin-bottom:26px}
.detail-brief-copy .button{font-size:11px;max-width:100%}
.detail-brief-items{border-top:1px solid #ffffff33}
.detail-brief-items>div{display:grid;grid-template-columns:50px minmax(0,1fr);gap:0 14px;padding:24px 0;border-bottom:1px solid #ffffff33}
.detail-brief-items span{grid-row:span 2;font-family:var(--display);font-size:27px;color:#a4c96b;line-height:1}
.detail-brief-items strong{font-size:16px;line-height:1.35}
.detail-brief-items p{color:#c9d8c8;font-size:11px;line-height:1.8;margin:7px 0 0}
.detail-questions{display:grid;grid-template-columns:39% 54%;justify-content:space-between;padding-top:100px;padding-bottom:100px}
.detail-questions h2{font-size:clamp(35px,3.8vw,54px)}
.detail-question-list details{border-bottom:1px solid #dce5d6}
.detail-question-list summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:15px;padding:21px 0;font-weight:700;font-size:13px;cursor:pointer;line-height:1.5}
.detail-question-list summary::-webkit-details-marker{display:none}
.detail-question-list summary span{font-size:24px;font-weight:300;color:#7c9e58;transition:transform .25s}
.detail-question-list details[open] summary span{transform:rotate(45deg)}
.detail-question-list details p{color:#627666;font-size:12px;line-height:1.9;padding:0 35px 17px 0;margin:0}
.detail-related{background:#f5f6f1;padding-top:78px;padding-bottom:100px}
.detail-related-header h2{font-size:clamp(35px,3.6vw,52px);margin-bottom:35px}
.detail-related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}
.detail-related-grid a{display:block;position:relative;overflow:hidden;min-height:235px;background:#133422;border-radius:3px;color:#fff}
.detail-related-grid a:after{content:'';position:absolute;inset:30% 0 0;background:linear-gradient(0deg,#102a1ce6,transparent)}
.detail-related-grid img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .65s}
.detail-related-grid a:hover img{transform:scale(1.07)}
.detail-related-grid a>span{position:absolute;bottom:24px;left:25px;right:25px;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:10px;font-weight:700;font-size:16px}
.detail-related-grid a b{font-size:24px;font-weight:400}
@media(min-width:1600px){.site-header,.site-header.is-scrolled{height:104px}.inner-page main{padding-top:104px}}
@media(max-width:980px){
 .site-header,.site-header.is-scrolled{height:86px;padding:9px 5%}
 .site-header .brand img{width:187px}
 .site-header .nav{gap:15px;font-size:10px}
 .site-header .header-cta{font-size:10px;padding:12px 17px}
 .inner-page main{padding-top:86px}
 .since-box,.since-box:nth-child(n){right:calc(100% + 10px);width:145px;min-height:87px;padding:18px 15px}
 .since-box strong{font-size:35px}
 .since-box>span{font-size:6px}
}
@media(max-width:850px){
 .site-header,.site-header.is-scrolled,.inner-page .site-header{height:79px;padding:9px 5%;width:100%;margin:0;top:0;border-radius:0;gap:14px}
 .site-header .brand img{width:174px;height:61px}
 .site-header .header-cta{margin-left:auto}
 .site-header .menu-toggle{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:none;z-index:104;margin-left:0;width:45px;height:45px;padding:8px;border-radius:50%}
 .menu-toggle span{display:block;width:24px;height:2px;background:currentColor;margin:3px 0;transition:transform .27s ease}
 .menu-toggle[aria-expanded=true] span:first-child{transform:translateY(4px) rotate(45deg)}
 .menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-4px) rotate(-45deg)}
 .site-header .nav,.site-header .nav.open{position:fixed;z-index:101;inset:0;top:0;left:0;right:0;width:100vw;height:100dvh;min-height:100svh;margin:0;border:0;border-radius:0;background:#f3f6ef;color:#1c3b2b;box-shadow:none;padding:clamp(110px,15vh,170px) 9% 36px;display:flex;align-items:flex-start;justify-content:center;flex-direction:column;gap:0;font-size:clamp(29px,5vw,48px);font-weight:800;line-height:1.16;overflow:auto;
 opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-18px);transition:opacity .35s,visibility .35s,transform .45s cubic-bezier(.2,.7,.2,1)}
 .site-header .nav.open{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
 .site-header .nav>a{display:block;width:100%;padding:10px 0;opacity:0;transform:translateY(18px);transition:opacity .37s,transform .37s;color:#193b28}
 .site-header .nav.open>a{opacity:1;transform:none}
 .site-header .nav.open>a:nth-child(1){transition-delay:.07s}
 .site-header .nav.open>a:nth-child(2){transition-delay:.11s}
 .site-header .nav.open>a:nth-child(3){transition-delay:.15s}
 .site-header .nav.open>a:nth-child(4){transition-delay:.19s}
 .site-header .nav.open>a:nth-child(5){transition-delay:.23s}
 .site-header .nav a:after{display:none}
 .mobile-menu-open{overflow:hidden}
 .site-header.menu-open,.site-header.menu-open.is-scrolled{background:transparent;color:var(--green-deep);box-shadow:none;backdrop-filter:none}
 .site-header.menu-open .brand img{filter:none}
 .site-header.menu-open .header-cta{opacity:0;pointer-events:none}
 .mobile-menu-meta{display:flex;width:100%;flex-direction:column;align-items:flex-start;gap:15px;margin-top:30px;padding-top:27px;border-top:1px solid #cdddc6;opacity:0;transform:translateY(12px);transition:opacity .4s .25s,transform .4s .25s}
 .site-header .nav.open .mobile-menu-meta{opacity:1;transform:none}
 .mobile-menu-meta>span{font-size:8px;letter-spacing:2px;color:#6b815f;font-weight:700}
 .mobile-menu-meta a{font-size:15px;font-weight:700;background:#76a63f;color:#fff!important;border-radius:40px;padding:13px 20px}
 .mobile-menu-meta small{font-size:10px;color:#71816f;font-weight:500}
 .hero{margin:0;height:100svh;min-height:670px;border-radius:0}
 .since-box,.since-box:nth-child(n){right:auto;left:5%;top:-60px;width:215px;min-height:84px;padding:16px 22px;gap:3px;flex-direction:row;align-items:center;justify-content:flex-start;gap:16px}
 .since-box strong{font-size:36px}
 .since-box>span{font-size:7px;max-width:90px}
 .about-stack{margin-top:-42px}
 .detail-journey-grid article{padding:30px 22px}
 .detail-journey-grid h3{font-size:19px}
 .detail-inspiration-heading{display:block}
 .detail-inspiration-heading .eyebrow{margin-bottom:15px}
 .detail-inspiration-heading h2{margin-bottom:20px}
 .detail-brief{gap:5%}
 .detail-questions{gap:30px}
}
@media(max-width:600px){
 html{scroll-padding-top:79px}
 .site-header,.site-header.is-scrolled,.inner-page .site-header{height:75px;padding:7px 5%}
 .site-header .brand img{width:149px;height:62px}
 .site-header .header-cta{display:none}
 .site-header .menu-toggle{margin-left:auto}
 .site-header .nav,.site-header .nav.open{padding:110px 8% 28px;justify-content:flex-start;font-size:clamp(31px,8.4vw,42px)}
 .site-header .nav>a{padding:12px 0}
 .mobile-menu-meta{margin-top:18px;padding-top:23px;gap:13px}
 .inner-page main{padding-top:75px}
 .hero{height:100svh;min-height:650px;margin:0;border-radius:0}
 .hero-content{bottom:108px;left:7%;width:88%}
 .hero-note{bottom:29px}
 .since-box,.since-box:nth-child(n){top:-53px;left:0;width:200px;min-height:79px;margin:0}
 .since-box strong{font-size:37px}
 .about-stack{margin-top:-42px}
 .transform-banner{min-height:370px;padding:65px 6% 76px}
 .blueprint .garden-plan{width:210%;left:-55%}
 .draft-caption{bottom:15px;left:6%;right:6%;font-size:6px;letter-spacing:.9px;flex-direction:column;gap:4px}
 .transform-content h2{font-size:43px}
 .services .leaf-mark{height:46px;margin-bottom:8px}
 .services .leaf-mark img{width:115px;height:41px}
 .grass-guide{gap:18px}
 .grass-copy,.project-intro,.comparison-copy,.process-heading,.faq-intro,.contact-copy{text-align:center}
 .grass-copy h2,.project-intro h2,.comparison-copy h2,.process-heading h2,.faq-intro h2,.contact-copy h2{margin-left:auto;margin-right:auto}
 .grass-copy>p:not(.eyebrow){margin-left:auto;margin-right:auto;max-width:420px}
 .grass-copy .text-link,.project-intro .text-link,.faq-intro .text-link{margin-left:auto;margin-right:auto}
 .grass-copy .guide-note{margin-left:auto;margin-right:auto}
 .grass-description{text-align:center}
 .grass-images.grass-growth-scene{height:320px}
 .grass-photo-area{max-width:520px;margin-left:auto;margin-right:auto}
 .grass-guide-rule{bottom:12%}
 .grass-ground-line{bottom:9%}
 .height-display{top:4px;right:5px}
 .height-display>span:first-child{font-size:36px}
 .project-intro p:not(.eyebrow){margin-left:auto;margin-right:auto;max-width:380px}
 .comparison-copy>p{margin-left:auto;margin-right:auto;max-width:400px}
 .process-heading{display:flex;align-items:center;flex-direction:column;justify-content:flex-start}
 .process-heading .text-link{position:static;margin:9px auto 0}
 .process-progress{justify-content:center;margin-left:auto;margin-right:auto}
 .faq-intro>p:not(.eyebrow){margin-left:auto;margin-right:auto}
 .contact-data{display:flex;align-items:center;flex-direction:column}
 .contact-data>p{margin-left:auto;margin-right:auto}
 .contact-copy .button{margin-left:auto;margin-right:auto}
 .footer{text-align:center;padding-top:45px}
 .footer-top{grid-template-columns:1fr;gap:29px;padding-bottom:29px}
 .footer-brand{grid-column:1;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px}
 .footer-brand img{width:205px;height:auto}
 .footer-brand p{font-size:10px;margin:0 auto 6px}
 .footer-brand .social-link{margin:0 auto;font-size:10px;justify-content:center}
 .footer-links{grid-column:1}
 .footer h3{font-size:12px;margin-bottom:12px}
 .footer-links>a{font-size:11px;line-height:1.8}
 .footer-contacts{grid-column:1;border-top:1px solid #dce4d3;padding-top:30px}
 .footer-contacts>p{display:block;margin:12px auto 0}
 .footer-bottom{flex-direction:column;align-items:center;gap:15px}
 .footer-bottom>div{order:1;display:flex;justify-content:center;gap:9px 15px}
 .footer-bottom>span{order:0}
 .footer-bottom>.back-top{order:2}
 .floating-contact{right:15px;bottom:17px;width:51px;height:51px}
 .floating-contact svg{width:28px;height:28px}
 .detail-journey{padding-top:65px;padding-bottom:70px}
 .detail-section-head{margin-bottom:30px;text-align:center}
 .detail-section-head h2{font-size:38px}
 .detail-journey-grid{grid-template-columns:1fr;gap:9px}
 .detail-journey-grid article{min-height:auto;padding:26px 25px 27px;display:grid;grid-template-columns:52px 1fr;column-gap:9px}
 .detail-step-count{grid-row:span 2;font-size:37px;margin:4px 0 0}
 .detail-journey-grid h3{margin-bottom:9px;font-size:19px}
 .detail-journey-grid p{font-size:11px}
 .detail-inspiration{padding-top:70px;padding-bottom:50px}
 .detail-inspiration-heading{text-align:center;margin-bottom:30px}
 .detail-inspiration-heading h2{font-size:39px}
 .detail-inspiration-heading p{font-size:12px}
 .detail-editorial-gallery{grid-template-columns:1fr 1fr;grid-template-rows:330px 220px;gap:8px}
 .detail-photo-card:first-child{grid-column:1/3;grid-row:1}
 .detail-photo-card:nth-child(2),.detail-photo-card:nth-child(3){grid-row:2}
 .detail-photo-card figcaption{bottom:13px;left:13px;right:11px}
 .detail-photo-card figcaption span{font-size:14px}
 .detail-photo-card figcaption small{font-size:8px;line-height:1.45}
 .detail-photos{padding-top:10px;padding-bottom:55px;gap:9px}
 .detail-photos img{height:210px}
 .detail-brief{display:flex;flex-direction:column;align-items:stretch;gap:25px;padding-top:65px;padding-bottom:70px}
 .detail-brief-copy{text-align:center}
 .detail-brief-copy h2{font-size:40px}
 .detail-brief-copy .button{font-size:10px;padding:13px 17px}
 .detail-brief-items strong{font-size:15px}
 .detail-questions{display:flex;flex-direction:column;gap:25px;padding-top:65px;padding-bottom:70px}
 .detail-questions>div:first-child{text-align:center}
 .detail-questions h2{font-size:38px}
 .detail-question-list summary{font-size:12px}
 .detail-related{padding-top:60px;padding-bottom:70px}
 .detail-related-header{text-align:center}
 .detail-related-header h2{font-size:37px}
 .detail-related-grid{grid-template-columns:1fr;gap:11px}
 .detail-related-grid a{min-height:200px}
}
@media(prefers-reduced-motion:reduce){
 .blueprint-plan{transition:none!important}
 .grass-growth-img{transition:none!important;will-change:auto}
 .site-header .nav,.site-header .nav a,.mobile-menu-meta{transition:none!important}
}