/* V6.9: four text roles, open sections, both bookings. Older styles stay frozen. */
.design-hybrid9 {
  --text: 17px;
  --caption: 14px;
  --section-title: 32px;
  --page-title: 52px;
  --paper: #fcfbf7;
  --soft: #f0f2eb;
  --line: #d2d8cd;
  font-size: var(--text);
}
.design-hybrid9 .review {font-size:var(--caption);background:var(--soft);padding:5px 18px}
.design-hybrid9 .nav {min-height:80px}
.design-hybrid9 .top {transition:transform .18s ease}
.design-hybrid9 .top.header-hidden {transform:translateY(-100%);pointer-events:none}
@media(prefers-reduced-motion:reduce) {.design-hybrid9 .top {transition:none}}
.brand {display:flex;flex-direction:column;gap:2px;flex-shrink:0}
.brand-location {font-size:var(--caption);font-weight:400;line-height:1.3;color:var(--muted)}
.design-hybrid9 .nav nav a,.design-hybrid9 .nav-phone,.design-hybrid9 .menu-toggle {font-size:var(--caption);font-weight:600}
.design-hybrid9 main :is(p,li,h3,h4,figcaption,summary,small,.btn),
.design-hybrid9 :is(.role-summary,.project-area,.link-row,.step-title,.step-num,.phone-line) {
  font-size:var(--text);line-height:1.55;letter-spacing:normal;
}
.design-hybrid9 main :is(p,li,figcaption,small) {font-weight:400}
.design-hybrid9 main :is(h3,h4,.owner-name,.example-title,.pay-title,.budget-title,.step-title) {font-weight:600}
.design-hybrid9 main :is(figcaption,.when,.expense-card figcaption p,.expense-proof>p,.budget .small),
.design-hybrid9 :is(.foot,.foot span,.foot>a:not(.logo)) {font-size:var(--caption);font-weight:400}
.design-hybrid9 main h1 {font-size:var(--page-title);font-weight:700;line-height:1.08;letter-spacing:-.035em;margin:0 0 20px;max-width:620px}
.design-hybrid9 main h2 {font-size:var(--section-title);font-weight:600;line-height:1.2;letter-spacing:-.025em}
.design-hybrid9 .hero h1 span {background:linear-gradient(transparent 91%,var(--accent) 91%,var(--accent) 98%,transparent 98%)}
.design-hybrid9 .hero {padding:64px 0 72px}
.design-hybrid9 .hero-grid {align-items:center;column-gap:64px}
.design-hybrid9 .scope-note {margin:0 0 28px;max-width:490px}
.design-hybrid9 .scope-copy {font-size:var(--text);line-height:1.55}
.design-hybrid9 .hero .actions {margin:0 0 18px;display:flex;flex-wrap:wrap;gap:12px}
.design-hybrid9 .btn {font-size:var(--text);font-weight:600;line-height:1.35;border-radius:10px;padding:14px 18px;min-height:48px}
.design-hybrid9 .hero .budget-line {font-size:var(--text);line-height:1.55;color:var(--muted)}
.design-hybrid9 .hero-photo {border-radius:10px}
.design-hybrid9 .hero-photo figcaption {font-size:var(--caption);font-weight:400;border-radius:6px;padding:6px 10px}
.design-hybrid9 .sec {padding:72px 0;background:var(--paper)}
.design-hybrid9 .sec-works {background:var(--soft)}
.design-hybrid9 .sec-head {margin-bottom:32px}
.design-hybrid9 .project h3 {margin-bottom:18px;font-weight:600}
.design-hybrid9 .project h3 .project-area {font-size:var(--text);font-weight:400}
.design-hybrid9 .shots {gap:12px;margin:0 0 20px}
.design-hybrid9 .shot img {border-radius:8px}
.design-hybrid9 .shot figcaption {padding-top:8px}
.design-hybrid9 .what {margin-bottom:12px}
.design-hybrid9 .when {margin-bottom:16px}
.design-hybrid9 .more .link-row {font-size:var(--text);font-weight:600;min-height:52px}
.design-hybrid9 .stat {font-size:var(--text);line-height:1.55;font-weight:400;letter-spacing:normal;margin:28px 0 0;padding:0;border:0}
.design-hybrid9 .cta-band {margin-top:28px;padding:24px 0 0;border:0;border-top:1px solid var(--line);border-radius:0;background:transparent}
.design-hybrid9 .cta-band .cta-title {font-size:var(--text);font-weight:400;line-height:1.55;letter-spacing:normal}
.design-hybrid9 .cta-band .btn {background:transparent;border-color:var(--dark)}
.design-hybrid9 .who-head {margin-bottom:24px;gap:18px}
.design-hybrid9 .who-head .owner-name {font-size:var(--text);font-weight:600}
.design-hybrid9 .who-head .role-summary {font-size:var(--text);font-weight:400}
.design-hybrid9 .tasks li,.design-hybrid9 .note {padding:16px 0;line-height:1.55}
.design-hybrid9 .badge,.design-hybrid9 .note .ico {background:transparent;border-radius:0}
.design-hybrid9 .example {margin:28px 0}
.design-hybrid9 .example-title {font-size:var(--text);line-height:1.55;letter-spacing:normal;margin-bottom:16px}
.design-hybrid9 .example-list {gap:12px}
.design-hybrid9 .example-list li {font-size:var(--text);line-height:1.55}
.design-hybrid9 .pay,.design-hybrid9 .guarantee {padding:20px;border:0;border-left:3px solid var(--accent);border-radius:0;background:#f6f3e8}
.design-hybrid9 .pay-title {font-size:var(--text);line-height:1.55;letter-spacing:normal}
.design-hybrid9 .expense-proof {margin-top:28px;margin-bottom:28px}
.design-hybrid9 .expense-proof>h3 {font-size:var(--text);line-height:1.55;letter-spacing:normal}
.design-hybrid9 .expense-card h4 {font-size:var(--text);line-height:1.55}
.design-hybrid9 .expense-card figcaption p {line-height:1.55}
.design-hybrid9 .carousel-nav button {font-size:var(--text)}
.design-hybrid9 .budget .budget-title {font-size:var(--text);line-height:1.55;letter-spacing:normal}
.design-hybrid9 .step {padding-bottom:28px}
.design-hybrid9 .step .step-title {font-size:var(--text);line-height:1.55;letter-spacing:normal}
.design-hybrid9 .visit-card h3 {font-size:var(--text);letter-spacing:normal}
.design-hybrid9 .phone-line a {font-weight:600}
.design-hybrid9 .sec-contact {padding-bottom:72px}
.design-hybrid9 dialog :is(p,button,input,textarea,.field,.slots legend) {font-size:var(--text);line-height:1.45}
.design-hybrid9 dialog :is(.eyebrow,.dialog-note,.weekdays) {font-size:var(--caption)!important;letter-spacing:normal;text-transform:none}
.design-hybrid9 dialog h2 {font-size:var(--section-title);font-weight:600;letter-spacing:-.025em}
@media(max-width:899px) {
  .design-hybrid9 {--text:16px;--section-title:28px;--page-title:36px;--bar-h:108px}
  .design-hybrid9 .nav {min-height:76px}
  .design-hybrid9 .hero {padding:28px 0 40px}
  .design-hybrid9 main h1 {margin-bottom:18px}
  .design-hybrid9 .scope-note {margin-bottom:24px}
  .design-hybrid9 .hero-photo {margin-bottom:20px}
  .design-hybrid9 .hero .actions {display:none}
  .design-hybrid9 .sec {padding:44px 0}
  .design-hybrid9 .sec-head {margin-bottom:24px}
  .design-hybrid9 .projects {gap:32px}
  .design-hybrid9 .project+.project {padding-top:32px}
  .design-hybrid9 .who-head {gap:14px}
  .design-hybrid9 .mobile-actions {gap:10px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));box-shadow:0 -2px 12px #1723210a}
  .design-hybrid9 .mobile-actions .btn {font-size:var(--text);line-height:1.25;padding:10px 8px;min-height:58px}
  .design-hybrid9 .budget .btn {width:100%}
}

/* Photo evidence and independent resource blocks, owner correction 07.10. */
.design-hybrid9 .resource-block {margin-top:40px;padding:28px 0 0;border:0;border-top:1px solid var(--line);border-radius:0;background:transparent}
.design-hybrid9 .resource-block h3 {margin:0 0 16px}
.design-hybrid9 .resource-block p {margin:0 0 16px}
.design-hybrid9 .resource-block p:last-child {margin-bottom:0}
.design-hybrid9 .budget.resource-block a,.design-hybrid9 .checklist-block a {font-weight:600;text-underline-offset:4px}
.design-hybrid9 .service-links a:after {content:none}
.pair-carousel {margin-bottom:24px}
.pair-toolbar {display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:12px;font-size:var(--caption)}
.project-media {margin-top:24px;padding-top:20px;border-top:1px solid var(--line)}
.design-hybrid9 .project-media .project-video-link {margin:0 0 20px}
.project-video-link .link-row {justify-content:flex-start;gap:12px;text-decoration:underline;text-underline-offset:4px}
.project-video-link .ico {flex-shrink:0;color:var(--dark)}
.design-hybrid9 .who-head a[href^="tel:"] {text-underline-offset:4px;font-weight:400}
.pair-toolbar>div {display:flex;gap:6px}
.pair-toolbar button,.renovation-gallery button {font-family:inherit;font-size:var(--text);font-weight:400;color:var(--ink);background:transparent;border:1px solid var(--line);border-radius:6px;min-height:44px;padding:8px 12px;cursor:pointer}
.pair-panel {display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pair-panel[hidden] {display:none}
.pair-panel .shot img {width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.project-thumbnails {display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0 22px}
.project-thumbnails img {width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:6px}
.project-thumbnails a,.pair-panel .shot a {display:block}
.renovation-gallery-open {overflow:hidden}
.design-hybrid9 .renovation-gallery {width:min(1100px,calc(100% - 32px));max-width:none;max-height:calc(100dvh - 24px);padding:20px;border:0;border-radius:12px;background:var(--paper);color:var(--ink);overflow:auto}
.renovation-gallery::backdrop {background:rgba(15,32,26,.85)}
.gallery-head {display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}
.design-hybrid9 .gallery-head h2 {font-size:var(--text);margin:0;font-weight:600}
.gallery-tabs {display:flex;gap:8px;overflow:auto;padding-bottom:12px}
.design-hybrid9 .gallery-tabs button {white-space:nowrap;border-color:transparent;flex-shrink:0;font-size:var(--caption);padding:8px 10px}
.gallery-tabs button[aria-pressed=true] {border-color:var(--dark);background:var(--soft)}
.gallery-stage {height:min(55dvh,570px);position:relative;display:flex;align-items:center;justify-content:center;background:#e9ece5;border-radius:8px;touch-action:pan-y;overflow:hidden;flex-direction:column;gap:12px}
.gallery-stage img,.gallery-stage video {width:100%;height:100%;object-fit:contain}
.gallery-stage [hidden],.renovation-gallery [hidden] {display:none!important}
.gallery-stage p {margin:0;text-align:center;padding:0 16px}
.gallery-navigation {display:flex;align-items:center;gap:12px;padding:12px 0}
.gallery-navigation p {margin:0;flex:1;font-size:var(--caption)}
.gallery-navigation span {font-size:var(--caption);white-space:nowrap}
.gallery-thumbs {display:flex;gap:8px;overflow:auto;padding:4px 0 8px}
.gallery-thumbs button {flex:0 0 auto;padding:2px;border:2px solid transparent;min-height:0}
.gallery-thumbs button[aria-pressed=true] {border-color:var(--accent)}
.gallery-thumbs img {display:block;width:72px;height:54px;object-fit:cover;border-radius:3px}
.case-detail {padding-top:40px;padding-bottom:60px}
.case-detail h1 {margin:20px 0}
.case-detail h2 {margin:52px 0 20px}
.case-detail p {margin:16px 0}
.case-detail>p:has(img) {display:inline-block;width:30%;margin:0 2% 14px 0;vertical-align:top}
.case-detail .actions {display:flex;flex-wrap:wrap;gap:12px}
.case-detail>p:has(img) img {width:100%;height:auto;border-radius:8px;aspect-ratio:4/3;object-fit:cover}
.case-detail>p.case-cover {display:block;width:min(720px,100%)}
.case-detail .case-video {width:100%;max-width:900px;display:block;border-radius:8px}
@media(max-width:899px) {
  .design-hybrid9 .resource-block {margin-top:36px;padding-top:24px}
  .design-hybrid9 .renovation-gallery {width:100%;max-height:100dvh;height:100dvh;padding:16px 12px;border-radius:0}
  .design-hybrid9 .renovation-gallery[open] {display:flex;flex-direction:column;padding-bottom:calc(12px + env(safe-area-inset-bottom))}
  .renovation-gallery .gallery-head,.renovation-gallery .gallery-tabs,.renovation-gallery .gallery-navigation {flex-shrink:0}
  .gallery-navigation {gap:8px}
  .gallery-stage {height:auto;min-height:0;flex:1}
  .gallery-thumbs {display:none!important}
  .gallery-head button {font-size:var(--caption)!important}
  .pair-panel {gap:8px}
  .case-detail {padding-top:24px}
  .case-detail>p:has(img) {width:30%}
}
@media(max-width:359px) {
  .design-hybrid9 {--page-title:32px}
  .design-hybrid9 .wrap {width:calc(100% - 28px)}
  .design-hybrid9 .mobile-actions {gap:8px;padding-inline:8px}
}
