/* Experimental presentation for dedkarkas.pro. */
.pro-hero,.pro-bath {position:relative; isolation:isolate; display:grid; align-items:center; border:2px solid var(--ink); border-radius:var(--radius-lg); background:#382317; color:white; box-shadow:var(--shadow);}
.home-page .pro-hero {
  min-height:0; grid-template-columns:minmax(0,1fr); gap:clamp(10px,1.3vw,18px);
  padding:clamp(14px,1.65vw,26px); text-align:center;
}
.pro-hero__photos,.pro-hero__photos img,.pro-bath video {
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2;
}
.pro-hero__photos,.pro-bath video {border-radius:inherit; overflow:hidden;}
.pro-hero__photos {background-position:center; background-size:cover;}
.pro-hero__photos img {
  object-position:center 50%;
  opacity:0;
  transition:opacity 1.8s ease;
  animation:pro-hero-zoom 8.5s ease-in-out infinite alternate paused;
}
.pro-hero__photos img.is-current {opacity:1; animation-play-state:running;}
.pro-hero__photos img[data-hero-pending] {visibility:hidden;}
@keyframes pro-hero-zoom {
  from {transform:scale(1);}
  to {transform:scale(1.10);}
}
.pro-hero::before,.pro-bath::before {content:""; position:absolute; inset:0; z-index:-1; border-radius:inherit;}
.pro-hero::before {background:radial-gradient(ellipse at center,#1b100bcf,#1b100b9e 75%,#1b100bbb);}
.home-page .pro-hero .hero-copy {
  width:100%; max-width:1180px; margin:0 auto; padding:0; gap:10px; min-height:0;
  grid-template-rows:none; justify-items:center; align-content:center; text-align:center;
  background:transparent; border:0; box-shadow:none; overflow:visible;
}
.home-page .pro-hero .hero-copy::before,.home-page .pro-hero .hero-copy::after {display:none;}
.home-page .pro-hero .hero-kicker-row,.home-page .pro-hero .button-row {justify-content:center; justify-items:center; width:100%;}
.home-page .pro-hero .hero-title--home-main {
  width:100%; max-width:none; margin:0; display:block; text-align:center; text-wrap:balance;
  color:white; font-size:clamp(2.55rem,5.45vw,5.35rem); line-height:.95;
}
.home-page .pro-hero .hero-title__line--combo {display:contents;}
.pro-hero__place {color:#ffd3a6; font-weight:800;}
.pro-bath {min-height:300px; padding:clamp(22px,5vw,58px); text-align:center; background:#382317 url('./bath-poster-v1.webp') center/cover;}
.pro-bath::before {background:radial-gradient(ellipse at center,#231107dc,#23110787);}
.pro-bath h1 {color:white; font:900 clamp(2rem,5.1vw,5.15rem)/.96 var(--font-heading); margin:.24em 0;}
.pro-bath p {max-width:58ch; margin:12px auto 0; line-height:1.45;}
@media (prefers-reduced-motion:reduce) {
  .pro-hero__photos img,.pro-hero__photos img.is-current {transition:none; animation:none; transform:none;}
}
.pro-steps {position:relative;}
.pro-steps h2 {scroll-margin-top:135px;}
.pro-steps ol {list-style:none; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; padding:0; margin:20px 0 0;}
.pro-steps li {border:2px solid var(--ink); border-radius:18px; padding:14px 17px; box-shadow:4px 5px 0 var(--ink); background:var(--surface);}
.pro-steps li:nth-child(6n+2),.pro-steps li:nth-child(6n+4) {background:#eef2e4;}
.pro-steps li:nth-child(6n+3),.pro-steps li:nth-child(6n+5) {background:#f7e8d6;}
.pro-steps li span {color:#75391e; font:900 1.15rem var(--font-heading);}
.pro-steps li h3 {margin:2px 0 4px; font:900 1.3rem/1.06 var(--font-heading);}
.pro-steps li p {margin:0; font-size:.9rem; line-height:1.35;}
.home-page .pro-hero .pro-hero__catalog {
  border-color:#fff1dd; color:#fffaf3;
  box-shadow:3px 4px 0 #160c07,0 0 0 1px #2b180e;
}
.home-page .pro-hero .pro-hero__catalog:is(:hover,:focus-visible) {background:#fff1dd; color:#321b0d;}
.pro-benefits {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; width:100%;
  max-width:1120px; list-style:none; padding:0; margin:0 auto;
}
.pro-benefits li {
  position:relative; display:grid; align-content:center; gap:4px; padding:10px 16px;
  border:2px solid var(--ink); border-radius:18px; box-shadow:4px 5px 0 var(--ink);
  background:linear-gradient(#fffaf1,#f0e4d4); color:#29180f;
}
.pro-benefits li:first-child {background:linear-gradient(#56301b,#2d160a); color:#fff7ee;}
.pro-benefits li:last-child {background:linear-gradient(#d5e8be,#e6efd8);}
.pro-benefits strong {font:900 clamp(1rem,1.65vw,1.42rem)/1.05 var(--font-heading); text-wrap:balance;}
.pro-benefits p {margin:0; font-size:.84rem; line-height:1.28;}

@media (min-width:1024px) {
  .home-page .section--hero {padding-bottom:clamp(26px,3.3vw,56px);}
  .home-page .pro-hero {
    width:calc(100% - clamp(32px,4.5vw,88px)); max-width:none;
    min-height:clamp(470px,calc(100svh - 165px),820px);
    grid-template-rows:1fr auto; gap:clamp(16px,2.2vw,42px);
    padding:clamp(28px,3.5vw,66px) clamp(24px,4vw,75px) clamp(26px,3vw,54px);
  }
  .home-page .pro-hero .hero-copy {max-width:1560px;}
  .pro-benefits {max-width:1420px; gap:16px;}
}

/* Two corners per card; varieties rotate locally within each grid. */
.panel::after {content:none;}
[data-catalog-root] > .project-grid {margin-top:12px;}
.project-card {overflow:visible; isolation:isolate;}
.project-card__media {isolation:isolate; z-index:0; border-top-left-radius:inherit; border-top-right-radius:inherit;}
@media (hover:hover) {
  .project-card:not(:has(.project-card__image--secondary)):is(:hover,:focus-within) .project-card__image--primary {opacity:1;}
}
.project-card__media--pro-mark::after {
  content:""; position:absolute; pointer-events:none; z-index:3;
  right:clamp(12px,1.4vw,24px); bottom:clamp(10px,1.3vw,20px);
  width:clamp(76px,24%,158px); aspect-ratio:2.6;
  background:url('../branding/dedkarkas-logo-horizontal.png') right top / contain no-repeat;
  filter:drop-shadow(0 0 2px #fff9ed);
}
:where(.project-card,.article-showcase,.article-feature,.article-card,.house-report,.package-card,.project-hero,.pro-bath,.pro-steps li) {position:relative;}
:is(.project-card,.article-feature,.article-card,.house-report,.package-card,.pro-benefits li,.pro-steps li,.blog-landing-card,.blog-card-simple,.article-hero-card,.article-link,.article-sidecard,.thanks-hero,.article-shell:where(:has(> h1)),:where(#game) .dk-game__card,.photo-jump-card,.footer-map-card,.footer-contact-card,:where(.two-up:has(> #lead-form),[data-lead-section] .two-up) > .panel) {
  --pro-l:url('./ornament-birch-corner-v3.webp'); --pro-r:url('./ornament-spruce-v2.webp');
}
:nth-child(6n+2 of .project-card,.article-feature,.article-card,.house-report,.package-card,.pro-benefits li,.pro-steps li,.blog-landing-card,.blog-card-simple,.article-hero-card,.article-link,.article-sidecard,.thanks-hero,.article-shell:where(:has(> h1)),:where(#game) .dk-game__card,.photo-jump-card,.footer-map-card,.footer-contact-card,:where(.two-up:has(> #lead-form),[data-lead-section] .two-up) > .panel) {
  --pro-l:url('./ornament-rowan-corner-v3.webp'); --pro-r:url('./ornament-birch-corner-v3.webp');
}
:nth-child(6n+3 of .project-card,.article-feature,.article-card,.house-report,.package-card,.pro-benefits li,.pro-steps li,.blog-landing-card,.blog-card-simple,.article-hero-card,.article-link,.article-sidecard,.thanks-hero,.article-shell:where(:has(> h1)),:where(#game) .dk-game__card,.photo-jump-card,.footer-map-card,.footer-contact-card,:where(.two-up:has(> #lead-form),[data-lead-section] .two-up) > .panel) {
  --pro-l:url('./ornament-spruce-v2.webp'); --pro-r:url('./ornament-rowan-corner-v3.webp');
}
:nth-child(6n+4 of .project-card,.article-feature,.article-card,.house-report,.package-card,.pro-benefits li,.pro-steps li,.blog-landing-card,.blog-card-simple,.article-hero-card,.article-link,.article-sidecard,.thanks-hero,.article-shell:where(:has(> h1)),:where(#game) .dk-game__card,.photo-jump-card,.footer-map-card,.footer-contact-card,:where(.two-up:has(> #lead-form),[data-lead-section] .two-up) > .panel) {
  --pro-l:url('./ornament-birch-corner-v3.webp'); --pro-r:url('./ornament-rowan-corner-v3.webp');
}
:nth-child(6n+5 of .project-card,.article-feature,.article-card,.house-report,.package-card,.pro-benefits li,.pro-steps li,.blog-landing-card,.blog-card-simple,.article-hero-card,.article-link,.article-sidecard,.thanks-hero,.article-shell:where(:has(> h1)),:where(#game) .dk-game__card,.photo-jump-card,.footer-map-card,.footer-contact-card,:where(.two-up:has(> #lead-form),[data-lead-section] .two-up) > .panel) {
  --pro-l:url('./ornament-spruce-v2.webp'); --pro-r:url('./ornament-birch-corner-v3.webp');
}
:nth-child(6n of .project-card,.article-feature,.article-card,.house-report,.package-card,.pro-benefits li,.pro-steps li,.blog-landing-card,.blog-card-simple,.article-hero-card,.article-link,.article-sidecard,.thanks-hero,.article-shell:where(:has(> h1)),:where(#game) .dk-game__card,.photo-jump-card,.footer-map-card,.footer-contact-card,:where(.two-up:has(> #lead-form),[data-lead-section] .two-up) > .panel) {
  --pro-l:url('./ornament-rowan-corner-v3.webp'); --pro-r:url('./ornament-spruce-v2.webp');
}
:is(.project-card,.article-feature,.article-card,.house-frame,:where(.project-hero) .project-media,.package-card,.pro-benefits li,.pro-steps li,.blog-landing-card,.blog-card-simple,.article-hero-card,.article-link,.article-sidecard,.thanks-hero,.article-shell:where(:has(> h1)),:where(#game) .dk-game__card,.photo-jump-card,.footer-map-card,.footer-contact-card,:where(.two-up:has(> #lead-form),[data-lead-section] .two-up) > .panel)::before,
:is(.project-card,.article-feature,.article-card,.house-frame,:where(.project-hero) .project-media,.package-card,.pro-benefits li,.pro-steps li,.blog-landing-card,.blog-card-simple,.article-hero-card,.article-link,.article-sidecard,.thanks-hero,.article-shell:where(:has(> h1)),:where(#game) .dk-game__card,.photo-jump-card,.footer-map-card,.footer-contact-card,:where(.two-up:has(> #lead-form),[data-lead-section] .two-up) > .panel,.article-showcase,.pro-bath)::after {
  content:""; position:absolute; pointer-events:none; user-select:none; z-index:5;
  top:var(--pro-top,-7px);
  width:calc(var(--pro-width,clamp(76px,9vw,152px)) * var(--pro-scale,1.5));
  height:calc(var(--pro-height,clamp(52px,6.3vw,102px)) * var(--pro-scale,1.5));
  border:0; border-radius:0; box-shadow:none;
  filter:drop-shadow(2px 4px 4px #32200c42);
}
:is(.project-card,.article-feature,.article-card,.house-frame,:where(.project-hero) .project-media,.package-card,.pro-benefits li,.pro-steps li,.blog-landing-card,.blog-card-simple,.article-hero-card,.article-link,.article-sidecard,.thanks-hero,.article-shell:where(:has(> h1)),:where(#game) .dk-game__card,.photo-jump-card,.footer-map-card,.footer-contact-card,:where(.two-up:has(> #lead-form),[data-lead-section] .two-up) > .panel)::before {
  left:-4px; background:var(--pro-l) right top / contain no-repeat; transform:scaleX(-1);
}
:is(.project-card,.article-feature,.article-card,.house-frame,:where(.project-hero) .project-media,.package-card,.pro-benefits li,.pro-steps li,.blog-landing-card,.blog-card-simple,.article-hero-card,.article-link,.article-sidecard,.thanks-hero,.article-shell:where(:has(> h1)),:where(#game) .dk-game__card,.photo-jump-card,.footer-map-card,.footer-contact-card,:where(.two-up:has(> #lead-form),[data-lead-section] .two-up) > .panel,.article-showcase,.pro-bath)::after {
  right:-4px; background:var(--pro-r) right top / contain no-repeat;
}
.project-card::after {--pro-width:clamp(56px,7.6vw,140px);}
:is(.article-showcase,.pro-bath) {--pro-r:url('./ornament-spruce-v2.webp');}
/* Attach the branches to the same painted box as the gallery border. */
.house-frame {position:relative; --pro-top:-13px; --pro-width:clamp(62px,8.5vw,122px); --pro-height:clamp(46px,6vw,88px);}
.house-frame .house-expand {z-index:6; top:clamp(38px,5.4vw,76px);}
:where(.project-hero) .project-media {
  position:relative; --pro-top:-12px;
  --pro-width:clamp(58px,7vw,112px); --pro-height:clamp(42px,5.1vw,80px);
  --pro-l:url('./ornament-spruce-v2.webp'); --pro-r:url('./ornament-birch-corner-v3.webp');
}
.project-hero .project-media.project-media--gallery-first {overflow:visible;}
.project-hero .project-media--gallery-first .gallery-showcase__viewer {border-radius:var(--radius-lg) var(--radius-lg) 0 0;}
:where(.project-hero) .gallery-showcase__nav {z-index:6;}
.article-showcase {--pro-width:clamp(140px,18vw,225px); --pro-height:clamp(105px,14vw,174px);}
.article-showcase .section-head--articles {padding-right:clamp(140px,22vw,305px);}
.article-showcase .section-head--articles .section-title {white-space:normal;}
:is(.article-feature,.article-card) {
  --pro-width:clamp(50px,6.5vw,110px); --pro-height:clamp(36px,4.4vw,58px);
}
:is(.package-card,.pro-steps li) {
  --pro-scale:1.35;
  --pro-width:clamp(30px,3.8vw,62px);
  --pro-height:clamp(24px,2.8vw,38px);
  padding-block-start:calc(var(--pro-height) * var(--pro-scale) + 3px);
}
.pro-steps ol {row-gap:clamp(18px,1.7vw,27px); margin-top:24px;}
.pro-benefits li {
  --pro-width:clamp(39px,5vw,80px); --pro-height:clamp(33px,4vw,62px); --pro-top:-15px;
  padding-inline:clamp(47px,5.2vw,78px);
}
.article-feature-list {row-gap:clamp(34px,3.1vw,52px);}
/* The blog, full articles and utility pages have their own card markup. */
:is(.blog-landing-card,.blog-card-simple,.article-hero-card,.article-link,.article-sidecard,.thanks-hero,
  .article-shell:where(:has(> h1)),:where(#game) .dk-game__card,.photo-jump-card) {
  position:relative;
}
:is(.blog-card-simple,.article-hero-card,.article-link,.thanks-hero) {overflow:visible;}
.blog-card-simple__media,.article-link__media {border-radius:var(--radius-lg) var(--radius-lg) 0 0;}
.article-hero-card__media {overflow:hidden; border-radius:0 0 var(--radius-xl) var(--radius-xl);}
@media (min-width:768px) {
  .article-hero-card__media {border-radius:0 var(--radius-xl) var(--radius-xl) 0;}
}
:is(.blog-landing-card,.article-hero-card,.thanks-hero,.article-shell:where(:has(> h1)),:where(#game) .dk-game__card) {
  --pro-width:clamp(58px,8vw,132px); --pro-height:clamp(45px,5.5vw,94px); --pro-top:-9px;
}
:is(.blog-landing-card,.article-hero-card__body,.thanks-hero) {
  padding-top:clamp(43px,4.7vw,77px);
}
:is(.article-link,.article-sidecard,.photo-jump-card) {
  --pro-width:clamp(38px,4.8vw,80px); --pro-height:clamp(29px,3.7vw,54px); --pro-scale:1.35;

}
/* Leave room below the corner branches in cards that begin with text. */
:is(.article-feature,.article-sidecard,.photo-jump-card) {
  padding-block-start:calc(var(--pro-height) * var(--pro-scale,1.5) + 3px);
}
:is(.blog-card-grid,.article-links-grid,.photo-jump-grid) {row-gap:clamp(28px,2.6vw,44px);}
.article-shell:where(:has(> h1)) {
  width:min(860px,calc(100% - 24px)); padding:clamp(35px,4vw,66px) clamp(17px,4vw,46px) 24px;
  border:2px solid var(--ink); border-radius:var(--radius-lg); background:var(--surface);
}
:where(#game) .dk-game__card {--pro-width:clamp(53px,7.5vw,112px); --pro-height:clamp(40px,5.3vw,80px); --pro-top:-10px;}
@media (max-width:767px) {
  :is(.blog-landing-card,.article-hero-card,.thanks-hero,.article-shell:where(:has(> h1)),:where(#game) .dk-game__card,.blog-card-simple) {
    --pro-scale:1.35;
  }
  .blog-card-simple {--pro-width:clamp(62px,20vw,95px); --pro-height:clamp(48px,16vw,72px);}
  .article-hero-card__body {padding-top:46px;}
  .article-shell:where(:has(> h1)) {padding-top:46px;}
}

:is(.footer-map-card,.footer-contact-card,:where(.two-up:has(> #lead-form),[data-lead-section] .two-up) > .panel) {
  --pro-width:clamp(55px,6vw,102px);
  --pro-height:clamp(38px,4.1vw,59px);
  --pro-scale:1.35;
  padding-block-start:calc(var(--pro-height) * var(--pro-scale) + 3px);
}
#lead-form.panel::after {background:var(--pro-r) right top / contain no-repeat; box-shadow:none;}
.pro-bath>div {position:relative; z-index:3;}
@media (max-width:900px) {
  .mobile-nav[open] .mobile-nav__panel {
    position:fixed; top:var(--pro-menu-top,75px); bottom:auto;
    right:max(14px,env(safe-area-inset-right)); left:auto;
    width:min(340px,calc(100vw - 28px)); margin:0;
    max-height:calc(100dvh - var(--pro-menu-top,75px) - max(14px,env(safe-area-inset-bottom)));
    padding:10px 12px 14px; gap:7px; overflow:auto; overscroll-behavior:contain;
  }
  .mobile-nav[open] .mobile-nav__contacts {gap:7px; padding-top:7px;}
  .mobile-nav[open] .mobile-nav__contact[href^="mailto:"] {background:linear-gradient(#f6a34c,#eb7b1f); color:var(--ink);}
  .mobile-nav[open] .social-links--mobile {margin-top:3px;}
  .mobile-nav[open] .mobile-nav__panel>a,.mobile-nav[open] .mobile-nav__contact {min-height:40px;}
  body:has(.mobile-nav[open]) .cookie-notice {visibility:hidden;}
  .site-header:has(.mobile-nav[open]) {backdrop-filter:none;}
}
@media (max-width:767px) {
  .home-page .pro-hero {border-radius:23px; padding-inline:10px;}
  .home-page .pro-hero .hero-title--home-main {font-size:clamp(1.55rem,7.65vw,3.35rem); line-height:.91;}
  .home-page .pro-hero .hero-copy {gap:10px;}
  .home-page .pro-hero .button-row {gap:7px;}
  .home-page .pro-hero .button-row .button {min-height:40px; font-size:.9rem;}
  .pro-hero__photos img {object-position:center;}
  .pro-benefits {grid-template-columns:minmax(0,1fr); gap:8px;}
  .pro-benefits li {padding:8px 48px; --pro-width:47px; --pro-height:38px; --pro-top:-13px; --pro-scale:1.3;}
  .pro-steps ol {grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px 10px;}
  .pro-steps li {padding-inline:10px; padding-block-end:10px;}
  .pro-steps li:nth-child(n) {background:var(--surface);}
  .pro-steps li:nth-child(3n+2) {background:#eef2e4;}
  .pro-steps li:nth-child(3n) {background:#f7e8d6;}
  .pro-steps li h3 {font-size:1.04rem;}
  .pro-steps li p {font-size:.78rem;}
  .pro-bath {min-height:235px;}
  :is(.project-card,.pro-bath) {
    --pro-width:clamp(64px,21vw,95px); --pro-height:clamp(48px,17vw,76px); --pro-top:-9px;
  }
  .project-card::after {--pro-width:clamp(55px,18vw,82px);}
  .project-card {--pro-logo-inset:clamp(53px,19%,78px);}
  .article-showcase {--pro-width:clamp(94px,27vw,132px); --pro-height:clamp(73px,21vw,100px); --pro-top:-9px; --pro-scale:1.35;}
  .footer-main--split, .two-up:has(> #lead-form) {row-gap:29px;}
  .article-showcase .section-head--articles {padding-right:0;}
  .article-showcase .section-head--articles .section-title {max-width:calc(100% - 92px);}
}

@media (max-width:360px) {
  .project-card {--pro-scale:1.4;}
  .pro-benefits li {padding-inline:40px;}
}

@media (max-width:767px) {
  .house-frame, :where(.project-hero) .project-media {
    --pro-scale:1.3; --pro-width:clamp(54px,18vw,85px); --pro-height:clamp(40px,13vw,63px);
  }
}
@media (min-width:1024px) {
  :is(.section--ded-karkas-game,#game) [data-ded-karkas-game] .dk-game__shell {max-width:990px;}
  :is(.section--ded-karkas-game,#game) [data-ded-karkas-game] .dk-game__layout {
    gap:clamp(14px,2vw,28px);
  }
  :is(.section--ded-karkas-game,#game) [data-ded-karkas-game] .dk-game__heading {padding:14px 10px;}
  :is(.section--ded-karkas-game,#game) [data-ded-karkas-game] .dk-game__title {font-size:clamp(2rem,3vw,2.6rem);}
  :is(.section--ded-karkas-game,#game) [data-ded-karkas-game] .dk-game__subtitle {font-size:1rem; margin-top:10px;}
  :is(.section--ded-karkas-game,#game) [data-ded-karkas-game] .dk-game__status {padding-top:10px;}
  :is(.section--ded-karkas-game,#game) [data-ded-karkas-game] .dk-game__moisture {min-height:60px;}
}

/* The background of the page stays visible until a card photo is ready. */
.project-card, .project-card__media {background:transparent;}
.project-card__body {background:linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,250,244,.98));}
.pro-card-photos .project-card__media .project-card__image:not([data-card-ready]) {visibility:hidden;}
.pro-card-photos .project-card__media--pro-mark:not(:has(.project-card__image--primary[data-card-ready]))::after {visibility:hidden;}
@media (hover:hover) {
  .project-card:not(:has(.project-card__image--secondary[data-card-ready])):is(:hover,:focus-within) .project-card__image--primary {opacity:1;}
}