:root { --orange:#E8541A; --orange-deep:#C94512; --black:#14110F; --text:#2D2822; --muted:#62594F; --line:#DED8CF; --bg:#FAF8F4; --radius:24px; }
    * { box-sizing:border-box; } body { margin:0; background:var(--bg); color:var(--text); font-family:"DM Sans",Arial,sans-serif; } button { font:inherit; }

    .reeds { padding:clamp(40px,5vw,64px) 24px; border-radius:32px 32px 0 0; background:var(--bg); }
    .reeds__inner { width:min(100%,1160px); margin:auto; }
    .hero-frame { position:relative; height:clamp(300px,34vw,410px); margin:0 0 clamp(32px,3.5vw,44px); overflow:hidden; border-radius:var(--radius); background:#D9D1C3; }
    .reeds__picture { display:block; height:100%; width:100%; }
    .reeds__image { display:block; width:100%; height:calc(100% + 84px); margin:-42px 0; object-fit:cover; object-position:center; transform:translate3d(0,var(--hero-shift,0px),0) scale(1.01); will-change:transform; }
    .reeds__grid { display:grid; grid-template-columns:minmax(0,1.22fr) minmax(0,1.38fr); gap:clamp(48px,5vw,66px); align-items:stretch; }
    .reeds__intro { display:flex; min-width:0; flex-direction:column; } .reeds__title { margin:0; color:var(--black); font:400 clamp(36px,calc(4.4vw + .528px),62px)/1 "Plus Jakarta Sans",Arial,sans-serif; letter-spacing:-.03em; white-space:nowrap; word-break:normal; overflow-wrap:normal; font-optical-sizing:auto; } .reeds__copy { max-width:365px; margin:17px 0 0; color:var(--text); font-size:16px; font-weight:500; line-height:1.55; }

    .services { min-width:0; } .section-title { margin:0 0 7px; color:var(--black); font:500 clamp(22px,2.3vw,28px)/1.2 Montserrat,Arial,sans-serif; letter-spacing:-.035em; font-optical-sizing:auto; } .section-lead { margin:0 0 14px; color:var(--text); font-size:14px; font-weight:500; line-height:1.5; text-wrap:pretty; }
    .service-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:0; padding:0; list-style:none; }
    .service-item { min-height:144px; padding:20px; border:1px solid var(--line); border-radius:17px; background:#FFFDFC; box-shadow:0 5px 15px rgba(62,47,31,.035); transition:transform 250ms cubic-bezier(.22,1,.36,1),border-color 250ms ease-out,box-shadow 250ms ease-out; } .service-item:hover { border-color:color-mix(in srgb,var(--orange) 55%,var(--line)); box-shadow:0 10px 20px rgba(62,47,31,.075); transform:translateY(-2px); } .service-item__icon-wrap { display:grid; width:56px; height:56px; place-items:center; margin:0 0 12px; border-radius:18px; background:color-mix(in srgb,var(--orange) 13%,var(--bg)); } .service-item__icon { color:var(--orange); font-size:28px; line-height:1; } .service-item__name { display:block; color:var(--black); font-size:17px; font-weight:500; line-height:1.38; text-wrap:pretty; } .service-item__note { display:flex; width:fit-content; margin-top:9px; padding:2px 7px; border:1px solid var(--orange); border-radius:999px; color:var(--orange-deep); font-size:13px; font-weight:600; line-height:1.25; }

    .process { --timeline-progress:0; --timeline-top:45px; --timeline-height:120px; position:relative; min-width:0; margin-top:50px; padding-top:0; } .process::after,.process::before { position:absolute; top:var(--timeline-top); left:5px; width:2px; height:var(--timeline-height); border-radius:2px; content:""; } .process::after { background:var(--line); } .process::before { z-index:1; background:var(--orange); transform:scaleY(var(--timeline-progress)); transform-origin:top; } .process__label { margin:0 0 18px; color:var(--orange-deep); font-size:13px; font-weight:700; letter-spacing:.13em; line-height:1.35; text-transform:uppercase; } .process__steps { display:grid; gap:17px; } .process__step { position:relative; display:grid; grid-template-columns:12px minmax(0,1fr); column-gap:12px; z-index:2; } .process__step::before { width:11px; height:11px; margin-top:5px; border:2px solid var(--line); border-radius:50%; background:var(--bg); content:""; transition:background-color 200ms ease-out,border-color 200ms ease-out; } .process__step h3 { grid-column:2; margin:0 0 3px; color:#70675D; font-size:19px; font-weight:600; line-height:1.3; transition:color 200ms ease-out; } .process__step p { grid-column:2; margin:0; color:#70675D; font-size:14px; font-weight:500; line-height:1.55; text-wrap:pretty; transition:color 200ms ease-out; } .process__step.is-active::before { border-color:var(--orange); background:var(--orange); } .process__step.is-active h3 { color:var(--black); } .process__step.is-active p { color:var(--muted); }

    .faq { margin-top:auto; padding-top:36px; } .faq__title { margin:0 0 13px; color:var(--black); font:500 clamp(20px,2vw,23px)/1.2 Montserrat,Arial,sans-serif; letter-spacing:-.03em; } .faq__list { border-top:1px solid var(--line); } .faq__item { border-bottom:1px solid var(--line); } .faq__question { display:flex; width:100%; min-height:54px; align-items:center; justify-content:space-between; gap:14px; padding:12px 0; border:0; background:transparent; color:var(--black); text-align:left; font-size:16px; font-weight:500; line-height:1.35; cursor:pointer; } .faq__question > span:first-child { text-wrap:pretty; } .faq__question:focus-visible { outline:2px solid var(--orange); outline-offset:4px; } .faq__trigger { display:grid; flex:0 0 36px; width:36px; height:36px; place-items:center; border:1px solid var(--line); border-radius:50%; color:var(--black); transition:background-color 220ms ease-out,border-color 220ms ease-out,color 220ms ease-out; } .faq__trigger svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.7; transition:transform 320ms cubic-bezier(.22,1,.36,1); } .faq__question:hover .faq__trigger { background:#F1ECE2; } .faq__question[aria-expanded="true"] .faq__trigger { border-color:var(--orange); background:var(--orange); color:#fff; } .faq__question[aria-expanded="true"] .faq__trigger svg { transform:rotate(180deg); } .faq__panel { display:grid; grid-template-rows:0fr; opacity:0; transition:grid-template-rows 360ms cubic-bezier(.22,1,.36,1),opacity 240ms ease-out; } .faq__question[aria-expanded="true"] + .faq__panel { grid-template-rows:1fr; opacity:1; } .faq__answer { min-height:0; overflow:hidden; } .faq__answer p { margin:0; padding:0 48px 18px 0; color:var(--muted); font-size:14px; font-weight:500; line-height:1.6; text-wrap:pretty; }

    .reeds__right { display:flex; min-width:0; flex-direction:column; gap:30px; } .practical { margin-top:auto; padding:27px 29px 26px; border:1px solid color-mix(in srgb,var(--line) 22%,var(--black)); border-radius:18px; background:color-mix(in srgb,var(--black) 85%,var(--muted)); box-shadow:0 4px 12px rgba(43,32,21,.08); } .practical h2 { margin:0 0 14px; color:#FFF8EE; font:500 22px/1.2 Montserrat,Arial,sans-serif; letter-spacing:-.03em; font-optical-sizing:auto; } .practical ul { display:grid; gap:11px; margin:0; padding:0; list-style:none; } .practical li { display:grid; grid-template-columns:18px minmax(0,1fr); column-gap:11px; align-items:start; color:#FFF8EE; font-size:14px; font-weight:400; line-height:1.58; text-wrap:balance; font-synthesis:none; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; } .practical li::before { width:18px; height:18px; align-self:start; margin-top:calc((1.58em - 18px) / 2); background:var(--orange); content:""; -webkit-mask:url("data:image/svg+xml,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3 10h13M12 5l5 5-5 5' fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.8'/%3E%3C/svg%3E") center/contain no-repeat; mask:url("data:image/svg+xml,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3 10h13M12 5l5 5-5 5' fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.8'/%3E%3C/svg%3E") center/contain no-repeat; }
    .cta-row { display:flex; flex-wrap:wrap; align-items:center; gap:9px; margin-top:24px; } .reeds__cta { display:inline-flex; min-height:34px; align-items:center; gap:8px; padding:9px 12px; border:1px solid var(--orange); border-radius:0; background:transparent; color:#FFF8EE; font:700 12px "DM Sans",Arial,sans-serif; letter-spacing:.07em; cursor:pointer; text-decoration:none; transition:background-color 180ms ease-out,color 180ms ease-out,border-color 180ms ease-out,transform 180ms ease-out; } .reeds__cta:hover,.reeds__cta:focus-visible { border-color:#FFF8EE; background:#FFF8EE; color:var(--black); outline:0; } .reeds__cta:active { transform:scale(.98); } .reeds__cta--primary { min-height:42px; padding:12px 15px; border-color:var(--orange-deep); background:var(--orange-deep); color:#fff; font-size:13px; } .reeds__cta--primary:hover,.reeds__cta--primary:focus-visible { border-color:color-mix(in srgb,var(--orange-deep) 88%,var(--orange)); background:color-mix(in srgb,var(--orange-deep) 88%,var(--orange)); color:#fff; transform:translateY(-1px); } .reeds__cta span { font-size:15px; font-weight:400; }

    .ui-arrow { display:inline-block; flex:0 0 auto; height:1em; position:relative; width:1.15em; } .ui-arrow::before { border-top:1.5px solid currentColor; content:""; left:0; position:absolute; top:50%; width:100%; } .ui-arrow::after { border-right:1.5px solid currentColor; border-top:1.5px solid currentColor; content:""; height:.4em; position:absolute; right:0; top:50%; transform:translateY(-50%) rotate(45deg); width:.4em; }
    @media (max-width:1050px) { .reeds__grid { display:flex; flex-direction:column; gap:30px; } .reeds__intro,.reeds__right { display:contents; } .reeds__title { order:1; font-size:clamp(36px,calc(4.4vw + .528px),62px); } .reeds__copy { order:2; max-width:560px; } .services { order:3; } .process { order:4; margin-top:0; } .faq { order:5; margin-top:0; padding-top:0; } .practical { order:6; } .hero-frame { height:auto; aspect-ratio:2.3/1; } }
    @media (max-width:620px) { .reeds { padding:32px 20px 44px; border-radius:24px 24px 0 0; } .hero-frame { height:220px; aspect-ratio:auto; margin-bottom:25px; } .reeds__image { height:100%; margin:0; transform:none !important; } .reeds__title { order:1; font-size:42px; letter-spacing:-.03em; } .reeds__copy { order:2; } .process { order:3; } .faq { order:4; } .services { order:5; } .practical { order:6; } .service-list { grid-template-columns:1fr; gap:10px; } .service-item { min-height:0; padding:18px; } .service-item__name { font-size:17px; } .service-item__note,.process__step p,.practical li { font-size:14px; } .faq__question { min-height:52px; font-size:16px; } .faq__answer p { padding-right:4px; font-size:14px; } .practical { padding:24px 21px 23px; } .cta-row { align-items:stretch; flex-direction:column; margin-top:22px; } .reeds__cta { width:100%; min-height:44px; justify-content:center; } }
    @media (prefers-reduced-motion:reduce) { *,*::before,*::after { transition-duration:1ms !important; animation-duration:1ms !important; } .reeds__image { transform:none !important; } .process { --timeline-progress:1; } .process__step::before { border-color:var(--orange); background:var(--orange); } .process__step h3 { color:var(--black); } .process__step p { color:var(--muted); } }
.service-item__icon { background:currentColor; display:block; width:28px; height:28px; }
    .ph-plant { -webkit-mask:url("data:image/svg+xml,%3Csvg viewBox='0 0 28 28' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M14 25V12'/%3E%3Cpath d='M14 15C8 15 5 11 5 6c6 0 9 3 9 9Z'/%3E%3Cpath d='M14 12c0-5 3-8 9-8 0 5-3 8-9 8Z'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat; mask:url("data:image/svg+xml,%3Csvg viewBox='0 0 28 28' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M14 25V12'/%3E%3Cpath d='M14 15C8 15 5 11 5 6c6 0 9 3 9 9Z'/%3E%3Cpath d='M14 12c0-5 3-8 9-8 0 5-3 8-9 8Z'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat; }
    .ph-broom { -webkit-mask:url("data:image/svg+xml,%3Csvg viewBox='0 0 28 28' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='m18 3-7 12'/%3E%3Cpath d='m9 14 7 4-4 7H4l5-11Z'/%3E%3Cpath d='m7 19 5 3'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat; mask:url("data:image/svg+xml,%3Csvg viewBox='0 0 28 28' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='m18 3-7 12'/%3E%3Cpath d='m9 14 7 4-4 7H4l5-11Z'/%3E%3Cpath d='m7 19 5 3'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat; }
    .ph-truck { -webkit-mask:url("data:image/svg+xml,%3Csvg viewBox='0 0 28 28' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M3 6h14v13H3Z'/%3E%3Cpath d='M17 11h4l4 4v4h-8Z'/%3E%3Ccircle cx='8' cy='21' r='2'/%3E%3Ccircle cx='21' cy='21' r='2'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat; mask:url("data:image/svg+xml,%3Csvg viewBox='0 0 28 28' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M3 6h14v13H3Z'/%3E%3Cpath d='M17 11h4l4 4v4h-8Z'/%3E%3Ccircle cx='8' cy='21' r='2'/%3E%3Ccircle cx='21' cy='21' r='2'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat; }
    .ph-clipboard-text { -webkit-mask:url("data:image/svg+xml,%3Csvg viewBox='0 0 28 28' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Crect x='5' y='5' width='18' height='20' rx='2'/%3E%3Cpath d='M10 5V3h8v4h-8V5Z'/%3E%3Cpath d='M9 12h10M9 16h10M9 20h6'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat; mask:url("data:image/svg+xml,%3Csvg viewBox='0 0 28 28' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Crect x='5' y='5' width='18' height='20' rx='2'/%3E%3Cpath d='M10 5V3h8v4h-8V5Z'/%3E%3Cpath d='M9 12h10M9 16h10M9 20h6'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat; }