/*
Theme Name: Daniel Hutár
Author: Daniel Hutár
Description: Samostatná česká prezentační šablona s popupy pro Fluent Forms.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: daniel-hutar
*/


:root {
  --dh-bg: #171717; --dh-panel: #202020; --dh-text: #f4f2f0; --dh-muted: #b5b1b1;
  --dh-line: #ffffff20; --dh-pink: #6366f1; --dh-orange: #06b6d4; --dh-purple: #a855f7;
  --dh-font: 'Inter', sans-serif; --dh-display: 'Inter', sans-serif;
  --dh-h1: clamp(3.2rem, 8vw, 7.7rem); --dh-h2: clamp(2.15rem, 4.3vw, 4.2rem);
  --dh-h3: clamp(1.5rem, 3vw, 3rem); --dh-h4: clamp(1.25rem, 2vw, 1.75rem);
  --dh-h5: clamp(1.1rem, 1.7vw, 1.45rem); --dh-h6: clamp(1rem, 1.4vw, 1.2rem);
  --dh-body: clamp(1rem, .9rem + .25vw, 1.15rem); --dh-small: clamp(.8rem, .75rem + .2vw, .95rem);
  --dh-heading-line: clamp(1.06em, 1em + .25vw, 1.18em);
  --dh-body-line: clamp(1.65em, 1.5em + .3vw, 1.85em);
  --dh-space: clamp(4.5rem, 8vw, 8.5rem);
}
html { scroll-behavior: smooth; scroll-padding-top: 8rem; background: var(--dh-bg); }
body { background: var(--dh-bg); color: var(--dh-text); }
.dh-site, .dh-header, .dh-footer { font-family: var(--dh-font); font-size: var(--dh-body); line-height: var(--dh-body-line); color: var(--dh-text); }
:where(.dh-site, .dh-header, .dh-footer) *, :where(.dh-site, .dh-header, .dh-footer) *::before, :where(.dh-site, .dh-header, .dh-footer) *::after { box-sizing: border-box; }
:where(.dh-site, .dh-header, .dh-footer) a { color: inherit; }
:where(.dh-site, .dh-header, .dh-footer) a:focus-visible { outline: 3px solid var(--dh-orange); outline-offset: 6px; }
:where(.dh-site, .dh-header, .dh-footer) p { margin: 0 0 1.25rem; }
:where(.dh-site, .dh-header, .dh-footer) h1, :where(.dh-site, .dh-header, .dh-footer) h2, :where(.dh-site, .dh-header, .dh-footer) h3, :where(.dh-site, .dh-header, .dh-footer) h4, :where(.dh-site, .dh-header, .dh-footer) h5, :where(.dh-site, .dh-header, .dh-footer) h6 { font-family: var(--dh-display); font-weight: 500; letter-spacing: -.015em; line-height: var(--dh-heading-line); margin: 0 0 1.5rem; color: var(--dh-text); text-wrap: balance; }
.dh-site h1 { font-size: var(--dh-h1); }.dh-site h2 { font-size: var(--dh-h2); }.dh-site h3 { font-size: var(--dh-h3); }.dh-site h4 { font-size: var(--dh-h4); }.dh-site h5 { font-size: var(--dh-h5); }.dh-site h6 { font-size: var(--dh-h6); }
:where(.dh-site, .dh-header, .dh-footer) small, .dh-micro { font-size: var(--dh-small); line-height: clamp(1.4em, 1.3em + .2vw, 1.65em); }
.dh-container { width: min(1240px, calc(100% - clamp(2.5rem, 8vw, 8rem))); margin-inline: auto; }
.dh-site, .dh-footer { overflow-wrap: anywhere; }
.dh-container > *, .dh-service > *, .dh-projects > *, .dh-steps > *, .dh-contact__grid > *, .dh-about__grid > *, .dh-principles .dh-container > * { min-width: 0; }
.dh-section { padding-block: var(--dh-space); }
.dh-gradient { background: linear-gradient(105deg, var(--dh-pink) 0%, var(--dh-purple) 50%, var(--dh-orange) 100%); color: transparent; background-clip: text; -webkit-background-clip: text; }

.dh-header .dh-brand span, .dh-header .dh-brand i { color: inherit; }
.dh-muted { color: var(--dh-muted); }
.dh-eyebrow { font-size: clamp(.7rem, .65rem + .2vw, .85rem); text-transform: uppercase; letter-spacing: .16em; font-weight: 600; color: var(--dh-muted); display: flex; align-items: center; gap: .75rem; }
.dh-dot { width: .45rem; height: .45rem; background: var(--dh-pink); border-radius: 50%; box-shadow: 0 0 15px #6366f177; flex: 0 0 auto; }
.dh-button { display: inline-flex; align-items: center; justify-content: center; gap: 1.8rem; min-height: 3.5rem; padding: .85rem 1.6rem; border-radius: 100px; text-decoration: none; color: #181818 !important; background: #f6f3f0; font-weight: 700; font-size: .9rem; line-height: 1.4; transition: background .2s, transform .2s; }
.dh-button:hover { background: #171717; color: #ffffff !important; box-shadow: inset 0 0 0 1px #ffffff66; transform: translateY(-2px); }.dh-button span { font-size: 1.35rem; }
.dh-button--small { min-height: 2.8rem; padding: .6rem 1.1rem; gap: 1.25rem; font-size: .8rem; }
.dh-text-link { display: inline-flex; align-items: center; gap: 1.5rem; padding-block: .75rem; text-decoration: none; border-bottom: 1px solid #ffffff55; font-size: .9rem; font-weight: 600; }
.dh-text-link:hover { color: #A855F7; border-color: #A855F7; }
.dh-header { position: sticky; top: 0; z-index: 100; background: #171717; border-bottom: 0; }
.dh-header__inner { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; min-height: 76px; }
.dh-brand { display: inline-flex; align-items: baseline; font-family: var(--dh-display); font-size: clamp(1.15rem, 1.8vw, 1.65rem); letter-spacing: -.06em; font-weight: 600; white-space: nowrap; text-decoration: none; }
.dh-brand span { color: var(--dh-pink); }.dh-brand i { font-style: normal; color: var(--dh-orange); margin-left: .1rem; }
.dh-nav { display: flex; flex-wrap: wrap; gap: clamp(1.2rem, 3vw, 3rem); }.dh-nav a { font-size: .78rem; color: var(--dh-muted); text-decoration: none; }.dh-nav a:hover { color: #A855F7; }
.dh-hero { position: relative; isolation: isolate; padding-top: clamp(2.5rem, 5vw, 5rem); background: radial-gradient(ellipse at 0 75%, #6366f140, transparent 35%), radial-gradient(ellipse at 100% 25%, #a855f745, transparent 32%); }
.dh-hero__eyebrow { justify-content: center; margin-bottom: 1.8rem !important; }.dh-hero h1 { font-size: clamp(2.4rem, 6vw, 5.775rem); text-align: center; font-weight: 500; letter-spacing: -.02em; line-height: 1.04; position: relative; z-index: 2; }
.dh-hero__stage { display: grid; grid-template-columns: 1fr 1.65fr 1fr; align-items: center; gap: 1rem; min-height: 450px; padding-bottom: 3rem; }
.dh-hero__notes { padding-block: 2rem; }.dh-hero__notes > div { border-left: 1px solid var(--dh-line); padding-left: 1.25rem; margin-bottom: 2rem; }.dh-note__number { font-family: var(--dh-display); font-size: clamp(1.8rem, 3vw, 2.75rem); letter-spacing: -.05em; }.dh-hero__notes p { color: var(--dh-muted); font-size: .8rem; line-height: 1.8; margin: .7rem 0 0; }
.dh-hero__intro { position: relative; z-index: 2; }.dh-hero__intro p { color: var(--dh-muted); font-size: clamp(.95rem, 1.1vw, 1.05rem); }.dh-hero__intro .dh-micro { display: block; margin-top: 1.3rem; color: var(--dh-muted); font-size: .72rem; }
.dh-image-slot { position: relative; display: grid; place-items: center; overflow: hidden; min-width: 0; border: 1px solid var(--dh-line); background: #202020; }
.dh-image-slot > img { display: block; width: 100%; height: 100%; object-fit: cover; }
.dh-hero__visual { aspect-ratio: 1 / 1.05; border: 0; background: radial-gradient(ellipse, #a855f730, transparent 66%); overflow: hidden; }
.dh-hero__visual > img { object-fit: contain; }.dh-orbit { position: absolute; width: 78%; height: 78%; border: 1px solid #6366f142; border-radius: 50%; transform: rotate(-30deg) scaleX(.65); }.dh-orbit--two { transform: rotate(40deg) scaleX(.65); border-color: #06b6d455; }.dh-visual-mark { font-family: var(--dh-display); font-size: clamp(9rem, 20vw, 20rem); line-height: 1; color: #06b6d488; font-weight: 400; }
.dh-slot-label { position: absolute; bottom: 1.3rem; left: 1rem; right: 1rem; text-align: center; color: #cbc4c8; font-size: .65rem; letter-spacing: .13em; font-weight: 500; line-height: 1.6; }.dh-slot-label small { display: block; margin-top: .4rem; font-size: .65rem; letter-spacing: .025em; color: #b4aaaf; }
.dh-ribbon { overflow: hidden; background: #252424; border-block: 1px solid var(--dh-line); transform: skewY(-2.5deg); margin-block: 1.5rem 2.5rem; }.dh-ribbon > div { display: flex; align-items: center; justify-content: space-around; gap: 1.6rem; padding: 1.3rem 2rem; min-width: min-content; }.dh-ribbon span { font-family: var(--dh-display); font-size: clamp(.95rem, 2vw, 1.5rem); white-space: nowrap; }.dh-ribbon b { color: var(--dh-orange); font-size: 1.6rem; }
.dh-section-heading { max-width: 790px; text-align: center; margin: 0 auto clamp(4rem, 8vw, 7rem); }.dh-section-heading .dh-eyebrow { justify-content: center; }.dh-section-heading > p:last-child { max-width: 580px; margin-inline: auto; color: var(--dh-muted); }
.dh-service { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 7vw, 7rem); align-items: center; margin-top: clamp(4rem, 9vw, 9rem); }.dh-service--reverse .dh-service__copy { order: 2; }.dh-service--reverse .dh-service__image { order: 1; }.dh-index { display: block; font-size: .75rem; letter-spacing: .16em; color: var(--dh-orange); margin-bottom: 1.5rem; }.dh-service__copy > p { color: var(--dh-muted); }.dh-checks { padding: 0; margin: 1.6rem 0; list-style: none; font-size: .85rem; }.dh-checks li { padding-left: 1.8rem; position: relative; margin-block: .75rem; }.dh-checks li::before { content: '✓'; position: absolute; left: 0; color: var(--dh-orange); }.dh-service__image { aspect-ratio: 4 / 3; border-radius: 1.3rem; background: radial-gradient(at 80% 20%, #6366f129, transparent 65%), #1d1c1e; }.dh-image-slot--shop { background: radial-gradient(at 20% 80%, #06b6d430, transparent 65%), #1d1c20; }.dh-image-slot--design { background: radial-gradient(at 50% 30%, #a855f738, transparent 70%), #1c1b20; }
.dh-wire-browser { width: 62%; height: 49%; border: 1px solid #a5a7fa7a; border-radius: 8px; transform: rotate(-5deg); padding: 0 1rem 1rem; display: grid; grid-template-columns: 1.5fr 1fr; gap: .6rem; }.dh-wire-browser i { grid-column: 1/-1; font-size: .6rem; letter-spacing: .2rem; color: #6366f1; font-style: normal; border-bottom: 1px solid var(--dh-line); }.dh-wire-browser b { background: #6366f117; border-radius: 4px; }.dh-wire-browser em { background: #06b6d417; border-radius: 4px; }
.dh-wire-shop { display: flex; gap: .6rem; width: 68%; transform: rotate(6deg); }.dh-wire-shop i { width: 33%; aspect-ratio: .75; border: 1px solid #67d4e766; border-radius: 60px 60px 5px 5px; background: #06b6d411; }.dh-wire-shop i:nth-child(2) { transform: translateY(-1rem); }
.dh-wire-design { display: flex; flex-wrap: wrap; width: 60%; gap: .8rem; }.dh-wire-design i { width: 100%; font-family: var(--dh-display); font-size: clamp(3rem, 7vw, 6rem); font-style: normal; color: #c4b5fd; line-height: 1; }.dh-wire-design b { width: 25%; height: 2rem; background: #6366f1; border-radius: 3px; }.dh-wire-design b:nth-last-child(2) { background: #a855f7; }.dh-wire-design b:last-child { background: #06b6d4; }
.dh-principles { border-block: 1px solid var(--dh-line); padding-block: clamp(2rem, 4vw, 4rem); background: linear-gradient(100deg, #6366f11a, #ffffff03, #a855f720); }.dh-principles .dh-container { display: grid; grid-template-columns: repeat(4,1fr); gap: 1.5rem; text-align: center; }.dh-principles strong { display: block; font-family: var(--dh-display); font-size: clamp(1.2rem, 2.5vw, 2.2rem); font-weight: 500; line-height: 1.3; margin-bottom: .7rem; }.dh-principles span { font-size: .8rem; color: var(--dh-muted); }
.dh-heading-row { display: flex; align-items: end; justify-content: space-between; gap: 2.5rem; margin-bottom: 3.5rem; }.dh-heading-row > p { max-width: 330px; color: var(--dh-muted); font-size: .95rem; }.dh-heading-row h2 { margin-bottom: 0; }
.dh-projects { display: grid; grid-template-columns: repeat(2,1fr); gap: 2.2rem; }.dh-project__image { aspect-ratio: 16 / 10; background: radial-gradient(at 20% 40%, #6366f130, transparent 75%), #202020; border-radius: .8rem; }.dh-project__image--second { background: radial-gradient(at 80% 20%, #a855f738, transparent 75%), #202020; }.dh-project__ordinal { font-size: clamp(4rem, 9vw, 8rem); font-family: var(--dh-display); color: #ffffff15; letter-spacing: -.1em; }.dh-project__caption { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-top: 1.4rem; }.dh-project__caption h3 { font-size: clamp(1.1rem, 1.8vw, 1.45rem); margin: 0; }.dh-project__caption span { font-size: .7rem; color: var(--dh-muted); }.dh-project > p { color: var(--dh-muted); font-size: .8rem; margin-top: .5rem; }
.dh-process { border-top: 1px solid var(--dh-line); }.dh-steps { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4,1fr); gap: 2rem; }.dh-steps li { border-top: 1px solid var(--dh-line); padding-top: 1.5rem; }.dh-steps li > span { color: var(--dh-pink); font-size: .8rem; }.dh-steps h3 { font-size: clamp(1.2rem, 1.7vw, 1.5rem); margin: 2rem 0 1rem; letter-spacing: -.005em; }.dh-steps p { color: var(--dh-muted); font-size: .9rem; }
.dh-about { padding-top: 1rem; }.dh-about__grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(3rem, 8vw, 8rem); align-items: center; }.dh-about__image { aspect-ratio: 4 / 5; border-radius: 50% 50% .5rem .5rem; background: radial-gradient(ellipse at 40% 40%, #a855f740, transparent 75%), #201e24; }.dh-portrait-mark { font-family: var(--dh-display); font-size: clamp(4rem, 10vw, 9rem); letter-spacing: -.1em; color: #c4b5fd50; }.dh-about__grid > div > p:not(.dh-eyebrow) { color: var(--dh-muted); }
.dh-contact { background: radial-gradient(ellipse at 0 100%, #6366f130, transparent 60%), radial-gradient(ellipse at 100% 0, #a855f735, transparent 55%); border-top: 1px solid var(--dh-line); }.dh-contact__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2.5rem, 7vw, 7rem); align-items: start; }.dh-contact__grid > div > p:not(.dh-eyebrow) { color: var(--dh-muted); }.dh-contact__note { display: flex; align-items: center; gap: 1.5rem; margin-top: 3rem; }.dh-contact__note > span { font-size: 3rem; color: var(--dh-orange); }.dh-contact__note p { margin: 0; font-size: .8rem; color: var(--dh-muted); }.dh-form-shell { border: 1px solid var(--dh-line); padding: clamp(1.3rem, 3vw, 2.5rem); border-radius: 1rem; background: #ffffff03; }.dh-form-shell h3 { font-size: clamp(1.25rem, 2vw, 1.75rem); letter-spacing: -.005em; margin-bottom: .8rem; }.dh-form-shell > p { color: var(--dh-muted); font-size: .9rem; }.dh-form-slot { min-height: 290px; border: 1px dashed #ffffff35; border-radius: .5rem; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 1.5rem; gap: .7rem; margin-top: 2rem; }.dh-form-slot p { font-size: .85rem; color: var(--dh-muted); margin: 0; }.dh-form-slot strong { font-size: 1rem; }.dh-form-slot__icon { font-size: 2rem; color: var(--dh-orange); }.dh-form-slot .dh-micro { color: var(--dh-muted); }
/* Připravené přizpůsobení skutečně vykresleného Fluent Forms formuláře. */
.dh-form-shell .fluentform { color: var(--dh-text); font-family: var(--dh-font); }.dh-form-shell .fluentform .ff-el-form-control { border: 1px solid #ffffff40; border-radius: .4rem; background: #191919; color: var(--dh-text); padding: .85rem; font: inherit; width: 100%; }.dh-form-shell .fluentform .ff-el-form-control::placeholder { color: #a9a5a5; }.dh-form-shell .fluentform .ff-el-form-control:focus { outline: 2px solid var(--dh-orange); outline-offset: 2px; }.dh-form-shell .fluentform .ff-btn-submit { background: #f6f3f0; color: #181818; border: 0; border-radius: 50px; padding: .9rem 1.6rem; font: inherit; font-weight: 700; cursor: pointer; }.dh-form-shell .fluentform .error { color: #ffa8b6; }
.dh-footer { padding: 3.5rem 0 1.5rem; border-top: 1px solid var(--dh-line); background: #141414; }.dh-footer__top { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 2rem; align-items: start; margin-bottom: 3.5rem; }.dh-footer__top p { color: var(--dh-muted); font-size: .9rem; }.dh-footer__top nav { display: flex; justify-content: end; gap: 1.4rem; }.dh-footer nav a { color: var(--dh-muted); font-size: .8rem; text-decoration: none; }.dh-footer a:not(.dh-button):hover { color: #A855F7; }.dh-footer__bottom { border-top: 1px solid var(--dh-line); padding-top: 1.5rem; display: flex; justify-content: space-between; gap: 1.2rem; flex-wrap: wrap; font-size: .72rem; color: var(--dh-muted); }.dh-footer__bottom a { text-decoration: none; }
@media (max-width: 1000px) { .dh-hero__stage { grid-template-columns: 1fr 1.4fr; }.dh-hero__notes { display: none; }.dh-hero__intro { grid-column: 2; grid-row: 1; }.dh-hero__visual { grid-column: 1; grid-row: 1; }.dh-steps { grid-template-columns: repeat(2,1fr); }.dh-heading-row { align-items: start; flex-direction: column; }.dh-heading-row > p { max-width: 550px; margin-bottom: 0; }.dh-project__caption { align-items: start; flex-direction: column; gap: .4rem; } }
@media (max-width: 720px) {
  html { scroll-padding-top: 14rem; }.dh-header__inner { flex-wrap: wrap; gap: .65rem; padding-block: .75rem; min-height: 0; }.dh-header .dh-button { margin-left: auto; }.dh-nav { order: 3; width: 100%; justify-content: space-between; border-top: 1px solid var(--dh-line); padding-top: 1rem; }.dh-nav a { font-size: .75rem; }
  .dh-hero__eyebrow { font-size: .62rem; letter-spacing: .12em; }.dh-hero h1 { font-size: clamp(2.025rem, 7.875vw, 3.45rem); }.dh-hero__stage { grid-template-columns: 1fr; gap: 0; padding-bottom: 2rem; }.dh-hero__visual { grid-column: 1; grid-row: 1; width: min(100%, 390px); margin-inline: auto; aspect-ratio: 1.15; }.dh-hero__intro { grid-column: 1; grid-row: 2; text-align: center; max-width: 430px; margin-inline: auto; }.dh-hero__intro .dh-micro { margin-top: 1rem; }.dh-visual-mark { font-size: clamp(10rem, 40vw, 16rem); }
  .dh-ribbon > div { justify-content: start; gap: 1.2rem; padding: 1rem; }.dh-service, .dh-about__grid, .dh-contact__grid { grid-template-columns: 1fr; }.dh-service--reverse .dh-service__copy { order: 0; }.dh-service--reverse .dh-service__image { order: 1; }.dh-service__image { max-height: 430px; }.dh-principles .dh-container { grid-template-columns: repeat(2,1fr); gap: 2rem 1rem; }.dh-projects { grid-template-columns: 1fr; gap: 2.5rem; }.dh-about__image { width: min(100%, 360px); margin-inline: auto; }.dh-about__grid { gap: 3rem; }.dh-footer__top { grid-template-columns: 1fr 1fr; gap: 1.5rem; }.dh-footer__top nav { justify-content: start; grid-column: 1/-1; }.dh-footer__bottom { flex-direction: column; gap: .7rem; }.dh-contact__note { margin-top: 1.5rem; }
}
@media (max-width: 380px) { .dh-header .dh-button { gap: .6rem; padding-inline: .85rem; font-size: .72rem; }.dh-brand { font-size: 1.1rem; }.dh-steps { grid-template-columns: 1fr; gap: 1rem; }.dh-steps h3 { margin-top: 1rem; }.dh-footer__top { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; }.dh-button { transition: none; }.dh-button:hover { transform: none; } }
@media (forced-colors: active) { .dh-gradient { background: none; color: CanvasText; }.dh-button { border: 1px solid ButtonText; }.dh-dot { background: CanvasText; } }

/* Uniform light headings, including previously accented text. */
.dh-site :is(h1, h2, h3, h4, h5, h6),
.dh-site :is(h1, h2, h3, h4, h5, h6) :is(.dh-gradient, .dh-muted) {
  background: none;
  color: var(--dh-text);
}
@media (forced-colors: active) {
  .dh-site :is(h1, h2, h3, h4, h5, h6),
  .dh-site :is(h1, h2, h3, h4, h5, h6) :is(.dh-gradient, .dh-muted) {
    background: none;
    color: CanvasText;
  }
}

/* Service packages below the introductory ribbon. */
.dh-offers { padding-top: clamp(3rem, 6vw, 6rem); padding-bottom: clamp(2rem, 4vw, 3.5rem); }
.dh-services { padding-top: 0; }
.dh-services > .dh-container > .dh-service:first-child { margin-top: 0; }
.dh-offer__number { position: absolute; top: .65rem; right: 1rem; color: var(--dh-muted); font-size: .7rem; line-height: 1; letter-spacing: .08em; font-variant-numeric: tabular-nums; }
.dh-offers .dh-section-heading { margin-bottom: 3.5rem; }
.dh-offers__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; align-items: stretch; }
.dh-offer { position: relative; display: flex; flex-direction: column; min-width: 0; padding: 2rem 1.4rem 1.4rem; border: 1px solid var(--dh-line); border-radius: 1rem; background: #ffffff03; }
.dh-offer--new { border-color: #a855f7; background: radial-gradient(ellipse at 0 0, #6366f12b, transparent 70%), #ffffff05; box-shadow: 0 0 35px #a855f715; }
.dh-offer__badge { position: absolute; top: -.9rem; left: 1.4rem; padding: .25rem .85rem; border-radius: 99px; background: #c4b5fd; color: #211237; font-size: .8rem; font-weight: 700; line-height: 1.6; }
.dh-offer .dh-eyebrow { min-height: 2.7em; font-size: .65rem; letter-spacing: .09em; margin-bottom: 1.1rem; }
.dh-offer h3 { font-size: clamp(1.3rem, 1.7vw, 1.65rem); line-height: 1.2; letter-spacing: -.005em; min-height: 2.4em; }
.dh-offer__intro { font-size: .9rem; line-height: 1.7; color: var(--dh-muted); min-height: 6.8em; }
.dh-offer .dh-offer__price { font-family: var(--dh-display); font-size: clamp(1.9rem, 2.6vw, 2.6rem); font-weight: 600; letter-spacing: -.055em; line-height: 1.3; margin: .5rem 0 1.6rem; }
.dh-offer__price span { font-size: 1rem; letter-spacing: 0; font-weight: 400; color: var(--dh-muted); }
.dh-offer .dh-offer__price--quote { font-size: clamp(1.35rem, 1.8vw, 1.7rem); min-height: 1.99em; display: flex; align-items: center; letter-spacing: -.035em; }
.dh-offer__list { margin: 0 0 1.6rem; padding: 1.3rem 0 0; border-top: 1px solid var(--dh-line); list-style: none; font-size: .88rem; line-height: 1.65; }
.dh-offer__list li { position: relative; padding-left: 1.35rem; margin-bottom: .75rem; }
.dh-offer__list li::before { content: '✓'; position: absolute; left: 0; color: #67e8f9; }
.dh-offer__detail { margin-top: auto !important; color: var(--dh-muted); font-size: .8rem; line-height: 1.65; padding-bottom: .6rem; }
.dh-offer .dh-button { width: 100%; gap: 1rem; }
.dh-offers__process { display: flex; align-items: start; gap: 1.5rem; margin-top: 2rem; padding: clamp(1.3rem, 3vw, 2rem); border: 1px solid var(--dh-line); border-radius: .8rem; background: #ffffff03; }
.dh-offers__process > span { color: #c4b5fd; font-size: 2.3rem; line-height: 1; }
.dh-offers__process > div { min-width: 0; }
.dh-offers__process h3 { font-size: clamp(1.2rem, 2vw, 1.7rem); margin-bottom: .8rem; }
.dh-offers__process p { margin: 0; color: var(--dh-muted); font-size: .95rem; }
.dh-offers__process strong { color: var(--dh-text); }
.dh-offers__terms { max-width: 960px; font-size: .85rem; line-height: 1.8; color: var(--dh-muted); margin: 1.5rem 0 0 !important; }
@media (max-width: 1100px) { .dh-offers__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }.dh-offer__intro { min-height: 0; } }
@media (max-width: 600px) { .dh-offers__grid { grid-template-columns: minmax(0, 1fr); gap: 2rem; }.dh-offer { padding: 2rem 1.4rem 1.4rem; }.dh-offer h3, .dh-offer .dh-eyebrow { min-height: 0; }.dh-offer__detail { margin-top: 0 !important; }.dh-offers__process { gap: .8rem; } }

.dh-form-shell .fluentform .ff-btn-submit:hover { background: #171717; color: #ffffff; box-shadow: inset 0 0 0 1px #ffffff66; }

/* Text links only; button hover keeps its own styling. */
:is(.dh-site, .dh-header, .dh-footer) a:not(.dh-button):hover { color: #A855F7; }
:is(.dh-header, .dh-footer) .dh-brand:hover span, :is(.dh-header, .dh-footer) .dh-brand:hover i { color: inherit; }

/* In WordPress the shared-part wrapper must be sticky, not its child. */
body.admin-bar > .dh-header { top: 32px; }
@media (min-width: 601px) and (max-width: 782px) {
  body.admin-bar > .dh-header { top: 46px; }
}
/* On small screens WordPress's admin bar scrolls away. */
@media (max-width: 600px) {
  body.admin-bar > .dh-header { top: 0; }
}
/* A soft lower-edge glow appears only after scrolling. */
.dh-header::after {
  content: '';
  position: absolute;
  left: 5%; right: 5%; bottom: -4px; height: 7px;
  background: linear-gradient(90deg, transparent, #6366F1 25%, #A855F7 55%, #06B6D4 80%, transparent);
  filter: blur(8px);
  opacity: 0;
  pointer-events: none;
  transition: opacity .25s ease;
}
.dh-header.is-scrolled::after { opacity: .45; }
@media (prefers-reduced-motion: reduce) { .dh-header::after { transition: none; } }
/* Mobile navigation remains visible when JavaScript is unavailable. */
.dh-menu-toggle { display: none; }
.dh-nav[hidden], .dh-menu-toggle[hidden] { display: none; }
@media (max-width: 720px) {
  .has-mobile-menu .dh-header__inner { display: grid; grid-template-columns: minmax(0, 1fr) 40px minmax(0, 1.15fr); gap: .6rem; }
  .has-mobile-menu .dh-brand { grid-column: 1; grid-row: 1; font-size: clamp(.95rem, 3.8vw, 1.15rem); white-space: normal; flex-wrap: wrap; }
  .has-mobile-menu .dh-menu-toggle { grid-column: 2; grid-row: 1; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 5px; width: 40px; min-height: 44px; padding: 8px; border: 1px solid #ffffff30; border-radius: .5rem; background: transparent; color: #fff; cursor: pointer; }
  .dh-menu-toggle span { display: block; width: 20px; height: 2px; background: currentColor; transition: transform .2s, opacity .2s; }
  .dh-menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(7px) rotate(45deg); }
  .dh-menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .dh-menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-7px) rotate(-45deg); }
  .dh-menu-toggle:hover { color: #A855F7; }
  .dh-menu-toggle:focus-visible { outline: 2px solid #A855F7; outline-offset: 3px; }
  .dh-header.has-mobile-menu .dh-button { grid-column: 3; grid-row: 1; justify-self: end; margin: 0; max-width: 100%; min-height: 44px; padding: .55rem .65rem; gap: .35rem; font-size: .72rem; text-align: center; }
  .has-mobile-menu .dh-nav { grid-column: 1 / -1; grid-row: 2; flex-direction: column; align-items: stretch; gap: 0; padding-top: .5rem; }
  .has-mobile-menu .dh-nav a { padding: .75rem .25rem; min-height: 44px; font-size: .9rem; }
  html { scroll-padding-top: 7rem; }
}
@media (prefers-reduced-motion: reduce) { .dh-menu-toggle span { transition: none; } }
.dh-header .dh-brand { letter-spacing: -.01em; }

/* Framed statistic on the left, introduction and single CTA on the right. */
.dh-hero__notes { display: block; padding: 0; }
.dh-hero__notes > .dh-hero__stat-card {
  margin: 0; padding: clamp(1.3rem, 2.5vw, 2rem);
  border: 1px solid var(--dh-line); border-radius: 1rem;
  background: radial-gradient(ellipse at 0 0, #6366f11a, transparent 75%), #ffffff03;
}
.dh-hero__stat-card .dh-note__number { display: block; font-size: clamp(1.65rem, 2.6vw, 2.4rem); line-height: 1.2; letter-spacing: -.015em; }
.dh-hero__stat-card p { margin-top: 1rem; }
.dh-hero__intro .dh-button { gap: .8rem; }
@media (min-width: 1001px) {
  .dh-hero__notes { grid-column: 1; grid-row: 1; }
  .dh-hero__visual { grid-column: 2; grid-row: 1; }
  .dh-hero__intro { grid-column: 3; grid-row: 1; }
}
@media (min-width: 721px) and (max-width: 1000px) {
  .dh-hero__notes { grid-column: 1 / -1; grid-row: 2; width: min(100%, 430px); margin: 1.5rem auto 0; text-align: center; }
}
@media (max-width: 720px) {
  .dh-hero__notes { grid-column: 1; grid-row: 3; width: min(100%, 430px); margin: 2rem auto 0; text-align: center; }
}
/* Detailed service packages. */
.dh-service__copy .dh-service__note { font-size: .85rem; line-height: 1.75; }
.dh-service__copy .dh-service__price { color: var(--dh-text); font-size: clamp(1.5rem, 2.5vw, 2.2rem); font-weight: 600; margin: 1.5rem 0 1rem; letter-spacing: -.015em; }

/* Native touch carousel; full four-column layout on wide screens. */
.dh-offers__carousel { position: relative; min-width: 0; }
.dh-offers__controls { display: none; }
.dh-offers__arrow { display: grid; place-items: center; width: 2.8rem; height: 2.8rem; flex-shrink: 0; border: 1px solid #ffffff55; border-radius: 50%; background: #171717; color: #fff; font: inherit; font-size: 1.3rem; cursor: pointer; }
.dh-offers__arrow:hover { background: #fff; color: #171717; }
.dh-offers__arrow:disabled { opacity: .3; cursor: default; }
.dh-offers__arrow:focus-visible, .dh-offers__grid:focus-visible { outline: 2px solid #a855f7; outline-offset: 3px; }
@media (max-width: 1100px) {
  .dh-offers__grid { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: calc((100% - 1.5rem) / 2); gap: 1.5rem; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; padding-block: 1.2rem .8rem; scrollbar-width: thin; scrollbar-color: #a855f7 #ffffff0a; }
  .dh-offers__grid > .dh-offer { scroll-snap-align: start; }
  .dh-offers__carousel { padding-inline: 3.3rem; }
  .dh-offers__controls:not([hidden]) { display: block; }
  .dh-offers__arrow { position: absolute; top: 50%; transform: translateY(-50%); }
  .dh-offers__arrow[data-offer-prev] { left: 0; }
  .dh-offers__arrow[data-offer-next] { right: 0; }

}
@media (max-width: 600px) {
  .dh-offers__carousel { padding-inline: 2rem; }
  .dh-offers__arrow { width: 1.75rem; height: 2.75rem; border: 0; background: transparent; border-radius: .4rem; }
  .dh-offers__grid { grid-auto-columns: 100%; gap: 1rem; }
}
/* Three compact portfolio cards with linked previews. */
.dh-projects { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2.5vw, 2rem); }
.dh-project__caption { align-items: flex-start; flex-direction: column; gap: .4rem; }
.dh-project__image { overflow: hidden; border: 1px solid var(--dh-line); text-decoration: none; }
.dh-project__image img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top; }
.dh-project__image:hover { border-color: #a855f7; }
.dh-project__image:focus-visible, .dh-project__caption a:focus-visible { outline: 2px solid #a855f7; outline-offset: 4px; }
.dh-project__caption h3 a { color: inherit; text-decoration: none; }
.dh-project__caption h3 a:hover { color: #a855f7; }
.dh-project__caption h3 a span { color: inherit; font-size: inherit; }
@media (max-width: 900px) { .dh-projects { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .dh-projects { grid-template-columns: minmax(0, 1fr); gap: 2rem; } }
.dh-about__links { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.8rem; }

.dh-contact-details { display: flex; flex-direction: column; align-items: flex-start; gap: .5rem; margin-block: 1.5rem; }
.dh-contact-details a { color: var(--dh-text); font-size: clamp(1rem, 1.7vw, 1.3rem); text-decoration: none; overflow-wrap: anywhere; max-width: 100%; }
.dh-social-link { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; color: var(--dh-text); border: 1px solid var(--dh-line); border-radius: .6rem; }
.dh-social-link svg { display: block; }
.dh-social-link:hover { border-color: #a855f7; }
.dh-social-link:focus-visible, .dh-contact-details a:focus-visible { outline: 2px solid #a855f7; outline-offset: 4px; }
/* Service features are collapsed until the visitor opens More. */
.dh-offer__accordion { margin-bottom: 1.4rem; }
.dh-offer__accordion > summary { display: flex; align-items: center; justify-content: center; gap: 1rem; min-height: 3.5rem; padding: .85rem 1.6rem; border-radius: 100px; background: #171717; color: #ffffff; box-shadow: inset 0 0 0 1px #ffffff66; font-size: .9rem; font-weight: 700; line-height: 1.4; cursor: pointer; list-style: none; }
.dh-offer__accordion > summary::-webkit-details-marker { display: none; }
.dh-offer__accordion > summary:hover { background: #f6f3f0; color: #181818; box-shadow: none; }
.dh-offer__accordion > summary:focus-visible { outline: 2px solid #a855f7; outline-offset: 3px; }
.dh-offer__expand { font-size: 1.3rem; font-weight: 400; line-height: 1; }
.dh-offer__accordion[open] .dh-offer__expand { transform: rotate(45deg); }
.dh-offer__accordion .dh-offer__list { margin: 0 0 .8rem; padding-top: 1.2rem; border-top: 0; }
/* Accessible FAQ disclosures above contact. */
.dh-faq__items { display: grid; gap: .8rem; }
.dh-faq__item { border: 1px solid var(--dh-line); border-radius: .8rem; background: #ffffff03; }
.dh-faq__item > summary { display: flex; align-items: center; justify-content: space-between; gap: 1.2rem; min-height: 56px; padding: clamp(1rem, 2vw, 1.5rem); color: var(--dh-text); font-size: clamp(1rem, 1.5vw, 1.15rem); font-weight: 600; line-height: 1.5; list-style: none; cursor: pointer; }
.dh-faq__item > summary::-webkit-details-marker { display: none; }
.dh-faq__item > summary > span { flex-shrink: 0; font-size: 1.5rem; line-height: 1; color: #c4b5fd; }
.dh-faq__item > summary:hover { color: #c4b5fd; }
.dh-faq__item > summary:focus-visible { outline: 2px solid #a855f7; outline-offset: 3px; border-radius: .8rem; }
.dh-faq__item[open] { border-color: #a855f766; }
.dh-faq__item[open] > summary > span { transform: rotate(45deg); }
.dh-faq__item > div { padding: 0 clamp(1rem, 2vw, 1.5rem) clamp(1rem, 2vw, 1.5rem); }
.dh-faq__item p { max-width: 85ch; margin: 0; color: var(--dh-muted); font-size: clamp(.9rem, 1.3vw, 1rem); line-height: 1.8; }
/* Standalone theme and shared popup styling. */
body { margin: 0; font-family: var(--dh-font); }
.dh-skip { position: fixed; top: 1rem; left: 1rem; z-index: 1000; transform: translateY(-200%); padding: 1rem; background: white; color: black; }
.dh-skip:focus { transform: none; }
.dh-popup { box-sizing: border-box; width: min(640px, calc(100% - 2rem)); max-height: calc(100dvh - 2rem); padding: 0; border: 1px solid #ffffff33; border-radius: 1rem; background: #202020; color: #f4f2f0; font-family: var(--dh-font); font-size: 1rem; line-height: 1.7; overflow-y: auto; }
.dh-popup::backdrop { background: #000b; }
.dh-popup__inner { padding: clamp(1.5rem, 4vw, 2.5rem); }
.dh-popup__close { display: block; margin-left: auto; width: 44px; height: 44px; background: transparent; color: white; border: 1px solid #ffffff55; border-radius: 50%; font-size: 1.5rem; cursor: pointer; }
.dh-popup h2 { font-size: clamp(1.5rem, 4vw, 2rem); line-height: 1.2; }
.dh-popup a { color: #c4b5fd; overflow-wrap: anywhere; }
.dh-popup__service { color: #67e8f9; }
.dh-popup :focus-visible { outline: 2px solid #a855f7; outline-offset: 3px; }
.dh-popup-open { overflow: hidden; }
.dh-popup .fluentform input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=submit]), .dh-popup .fluentform textarea, .dh-popup .fluentform select { box-sizing: border-box; max-width: 100%; background: #171717; color: #fff; border: 1px solid #ffffff66; border-radius: .4rem; }
.dh-popup .fluentform .ff-btn-submit { background: #f6f3f0; color: #181818; border-radius: 100px; padding: .85rem 1.6rem; }
.dh-popup .fluentform .ff-btn-submit:hover { background: #171717; color: #fff; box-shadow: inset 0 0 0 1px #ffffff66; }

/* Service type beneath each project title. */
.dh-site .dh-project__caption .dh-project__service { margin: .25rem 0 0; color: var(--dh-purple); background: linear-gradient(105deg, var(--dh-pink) 0%, var(--dh-purple) 50%, var(--dh-orange) 100%); background-clip: text; -webkit-background-clip: text; font-size: clamp(1rem, 1.4vw, 1.15rem); font-weight: 600; line-height: 1.4; letter-spacing: 0; }
@supports ((background-clip: text) or (-webkit-background-clip: text)) { .dh-site .dh-project__caption .dh-project__service { color: transparent; } }
@media (forced-colors: active) { .dh-site .dh-project__caption .dh-project__service { background: none; color: CanvasText; } }
