/* CODE-Art.nl — complete horeca terrace page. Scoped to this page only. */
.horecaterras-page {
    --ht-paper: #f8f2e9;
    --ht-paper-2: #fffaf4;
    --ht-soft: #eee3d6;
    --ht-ink: #24201d;
    --ht-muted: #766a60;
    --ht-dark: #211d1a;
    --ht-dark-2: #171513;
    --ht-copper: #bd7b45;
    --ht-copper-light: #dda36f;
    --ht-line: rgba(189, 123, 69, .28);
    --ht-blue: #173d56;
    --ht-radius: 10px;
    background: var(--ht-paper);
    color: var(--ht-ink);
    overflow-x: hidden;
}

.horecaterras-page .eyebrow {
    margin: 0 0 1rem;
    color: var(--ht-copper);
    font-size: clamp(.78rem, 1vw, .95rem);
    font-weight: 900;
    letter-spacing: .19em;
    line-height: 1.45;
    text-transform: uppercase;
}

.horecaterras-page h1,
.horecaterras-page h2,
.horecaterras-page h3,
.horecaterras-page p { overflow-wrap: anywhere; }

.horecaterras-page h2 {
    margin: 0;
    color: var(--ht-ink);
    font-size: clamp(2.25rem, 4.5vw, 4.65rem);
    line-height: 1.02;
    letter-spacing: -.045em;
}

.horecaterras-page h3 {
    color: var(--ht-ink);
    letter-spacing: -.025em;
}

.ht-container {
    width: min(1500px, calc(100% - 48px));
    margin-inline: auto;
}

.ht-section { padding: clamp(68px, 8vw, 126px) 0; }
.ht-section--paper { background: var(--ht-paper); }
.ht-section--soft { background: var(--ht-soft); }
.ht-section--dark { background: var(--ht-dark); color: #fff; }
.ht-section--dark h2,
.ht-section--dark h3 { color: #fff; }
.ht-section--dark p { color: rgba(255,255,255,.76); }
.ht-section--dark .eyebrow { color: var(--ht-copper-light); }

.ht-heading { width: min(850px, 100%); margin-bottom: clamp(30px, 4vw, 55px); }
.ht-heading--center { margin-inline: auto; text-align: center; }
.ht-heading--wide { width: min(1120px,100%); }
.ht-heading > p:last-child {
    margin: 1.35rem 0 0;
    color: var(--ht-muted);
    font-size: clamp(1.04rem, 1.3vw, 1.22rem);
    line-height: 1.75;
}

.ht-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .8rem;
    margin-top: 1.7rem;
}
.ht-actions .button { min-width: 215px; }
.ht-actions--dark-text .button--ghost-light {
    background: transparent;
    border-color: rgba(36,32,29,.28);
}

/* Hero */
.ht-hero {
    position: relative;
    display: grid;
    min-height: min(84svh, 860px);
    align-items: end;
    isolation: isolate;
    overflow: hidden;
    background: var(--ht-dark-2);
    color: #fff;
}
.ht-hero__media,
.ht-hero__media img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
}
.ht-hero__media { z-index: -3; }
.ht-hero__media img { object-fit: cover; object-position: center 52%; }
.ht-hero__shade {
    position: absolute;
    z-index: -2;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(12,14,15,.95) 0%, rgba(12,14,15,.77) 39%, rgba(12,14,15,.28) 68%, rgba(12,14,15,.05) 100%),
        linear-gradient(0deg, rgba(10,10,10,.54), transparent 48%);
}
.ht-hero__content {
    padding-top: clamp(95px, 11vw, 155px);
    padding-bottom: clamp(66px, 8vw, 112px);
}
.ht-hero__content > * { max-width: 820px; }
.ht-hero h1 {
    margin: 0;
    color: #fff;
    font-size: clamp(3.2rem, 7vw, 7rem);
    line-height: .94;
    letter-spacing: -.06em;
}
.ht-hero__lead {
    margin: clamp(1.4rem, 2.4vw, 2.1rem) 0 0;
    color: rgba(255,255,255,.88);
    font-size: clamp(1.08rem, 1.55vw, 1.4rem);
    line-height: 1.72;
}
.ht-hero .button--ghost { background: rgba(20,18,17,.46); }
.ht-hero__text-link {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin-top: 1.55rem;
    color: var(--ht-copper-light);
    font-weight: 850;
    text-decoration: none;
}
.ht-hero__text-link span { font-size: 1.2em; }

/* Five challenges */
.ht-challenge-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
}
.ht-challenge-grid article {
    position: relative;
    min-height: 245px;
    padding: 28px 24px 25px;
    border: 1px solid var(--ht-line);
    border-radius: var(--ht-radius);
    background: rgba(255,255,255,.62);
}
.ht-challenge-grid article::after {
    content: "";
    position: absolute;
    left: 24px;
    right: 24px;
    bottom: 0;
    height: 3px;
    background: linear-gradient(90deg,var(--ht-copper),transparent);
}
.ht-challenge-grid__problem {
    display: inline-block;
    margin-bottom: 2.3rem;
    color: var(--ht-muted);
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: .14em;
    text-transform: uppercase;
}
.ht-challenge-grid h3 { margin: 0 0 .8rem; font-size: 1.38rem; }
.ht-challenge-grid p { margin: 0; color: var(--ht-muted); line-height: 1.58; }

/* Financial case */
.ht-finance__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.04fr) minmax(440px, .96fr);
    gap: clamp(34px, 5.5vw, 88px);
    align-items: center;
}
.ht-finance__copy h2 { max-width: 780px; }
.ht-finance__copy p {
    max-width: 780px;
    margin: 1.25rem 0 0;
    font-size: clamp(1.02rem, 1.22vw, 1.18rem);
    line-height: 1.78;
}
.ht-finance__media {
    min-height: 590px;
    margin: 0;
    overflow: hidden;
    border: 1px solid rgba(221,163,111,.28);
    border-radius: var(--ht-radius);
    box-shadow: 0 28px 65px rgba(0,0,0,.28);
}
.ht-finance__media picture,
.ht-finance__media img { display: block; width: 100%; height: 100%; }
.ht-finance__media img { object-fit: cover; }
.ht-value-grid {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 12px;
    margin-top: clamp(42px, 6vw, 78px);
}
.ht-value-grid article {
    min-height: 180px;
    padding: 24px;
    border-top: 1px solid rgba(221,163,111,.42);
    background: rgba(255,255,255,.035);
}
.ht-value-grid h3 { margin: 0 0 .7rem; color: #fff; font-size: 1.12rem; }
.ht-value-grid p { margin: 0; font-size: .96rem; line-height: 1.62; }

/* Overkapping */
.ht-overkapping__grid {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(0,1fr);
    gap: 18px;
    align-items: stretch;
}
.ht-copy-card {
    padding: clamp(34px, 4.5vw, 70px);
    border: 1px solid var(--ht-line);
    border-radius: var(--ht-radius);
    background: var(--ht-paper-2);
}
.ht-copy-card p {
    margin: 1.25rem 0 0;
    color: var(--ht-muted);
    font-size: clamp(1rem,1.2vw,1.15rem);
    line-height: 1.74;
}
.ht-inline-facts {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .62rem 1rem;
    margin: 1.7rem 0 0;
    padding: 0;
    list-style: none;
}
.ht-inline-facts li {
    position: relative;
    padding-left: 1.1rem;
    color: #51483f;
    font-weight: 760;
    line-height: 1.45;
}
.ht-inline-facts li::before {
    content: "";
    position: absolute;
    left: 0;
    top: .62em;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--ht-copper);
}

.ht-carousel {
    position: relative;
    min-width: 0;
    border-radius: var(--ht-radius);
    background: var(--ht-dark);
    box-shadow: 0 24px 58px rgba(37,30,24,.15);
}
.ht-carousel__viewport {
    position: relative;
    height: 100%;
    min-height: 590px;
    overflow: hidden;
    border-radius: inherit;
}
.ht-carousel__slide {
    position: absolute;
    inset: 0;
    margin: 0;
    opacity: 0;
    visibility: hidden;
    transition: opacity .48s ease;
}
.ht-carousel__slide.is-active { opacity: 1; visibility: visible; }
.ht-carousel__slide picture,
.ht-carousel__slide img { display:block; width:100%; height:100%; }
.ht-carousel__slide img { object-fit: cover; }
.ht-carousel__slide figcaption {
    position: absolute;
    left: 18px;
    right: 18px;
    bottom: 18px;
    padding: 14px 16px;
    border-radius: 7px;
    background: rgba(25,22,20,.84);
    color: #fff;
    font-weight: 820;
    line-height: 1.35;
}
.ht-carousel__controls {
    position: absolute;
    z-index: 4;
    left: 50%;
    bottom: 79px;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 7px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 999px;
    background: rgba(30,27,25,.88);
    transform: translateX(-50%);
    box-shadow: 0 14px 35px rgba(0,0,0,.22);
}
.ht-carousel__controls > button {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(255,255,255,.1);
    color: #fff;
    font-size: 1.65rem;
    cursor: pointer;
}
.ht-carousel__dots { display:flex; gap:7px; }
.ht-carousel__dots button {
    width: 9px;
    height: 9px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(255,255,255,.4);
    cursor:pointer;
}
.ht-carousel__dots button.is-active { background:var(--ht-copper-light); transform:scale(1.25); }

.ht-models {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 14px;
    margin-top: clamp(34px,5vw,62px);
}
.ht-model-card {
    position: relative;
    display: block;
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--ht-line);
    border-radius: var(--ht-radius);
    background: #fff;
    color: var(--ht-ink);
    text-decoration: none;
}
.ht-model-card:nth-child(4) { grid-column: 1 / 2; margin-left: 50%; }
.ht-model-card:nth-child(5) { grid-column: 2 / 3; margin-left: 50%; }
.ht-model-card img {
    display:block;
    width:100%;
    aspect-ratio: 16 / 9;
    object-fit:cover;
    transition: transform .3s ease;
}
.ht-model-card:hover img { transform: scale(1.025); }
.ht-model-card > span { display:grid; gap:.2rem; padding:19px 20px 21px; }
.ht-model-card strong { font-size:1.2rem; }
.ht-model-card small { color:var(--ht-muted); font-size:.95rem; }

/* Total concept */
.ht-concept { display: grid; gap: clamp(34px,5vw,58px); }
.ht-concept__steps {
    display: grid;
    grid-template-columns: repeat(5,minmax(0,1fr));
    border-top: 1px solid rgba(189,123,69,.36);
    border-bottom: 1px solid rgba(189,123,69,.36);
}
.ht-concept__steps article { padding: 26px 23px 28px; border-right: 1px solid rgba(189,123,69,.22); }
.ht-concept__steps article:last-child { border-right:0; }
.ht-concept__steps span { color:var(--ht-copper); font-size:.82rem; font-weight:900; letter-spacing:.15em; }
.ht-concept__steps h3 { margin:1.6rem 0 .65rem; font-size:1.18rem; }
.ht-concept__steps p { margin:0; color:var(--ht-muted); line-height:1.62; }
.ht-wide-image {
    margin: 0;
    overflow:hidden;
    border-radius:var(--ht-radius);
    min-height: min(55vw, 700px);
    background:#222;
}
.ht-wide-image picture,
.ht-wide-image img { display:block; width:100%; height:100%; }
.ht-wide-image img { object-fit:cover; }

/* Feature sections */
.ht-feature {
    display:grid;
    grid-template-columns: minmax(0,1fr) minmax(0,1fr);
    gap: clamp(30px,5vw,80px);
    align-items:center;
}
.ht-feature__media {
    min-height: 520px;
    margin:0;
    overflow:hidden;
    border-radius:var(--ht-radius);
    background:#28231f;
}
.ht-feature__media picture,
.ht-feature__media img { display:block; width:100%; height:100%; }
.ht-feature__media img { object-fit:cover; }
.ht-feature__copy p {
    margin:1.2rem 0 0;
    font-size:clamp(1rem,1.15vw,1.14rem);
    line-height:1.76;
}
.ht-feature__copy--dark p { color:var(--ht-muted); }
.ht-checks {
    display:grid;
    gap:.65rem;
    margin:1.65rem 0 0;
    padding:0;
    list-style:none;
}
.ht-checks li {
    position:relative;
    padding-left:1.3rem;
    color:rgba(255,255,255,.85);
    font-weight:720;
}
.ht-checks li::before {
    content:"";
    position:absolute;
    left:0;
    top:.55em;
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--ht-copper-light);
}
.ht-checks--dark li { color:#52483f; }
.ht-text-link {
    display:inline-flex;
    gap:.55rem;
    margin-top:1.7rem;
    color:var(--ht-copper-light);
    font-weight:900;
    text-decoration:none;
}

/* Parasols + heaters */
.ht-extra-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px;
}
.ht-extra-card {
    overflow:hidden;
    border:1px solid var(--ht-line);
    border-radius:var(--ht-radius);
    background:var(--ht-paper-2);
}
.ht-extra-card figure { margin:0; min-height:410px; overflow:hidden; background:#ddd; }
.ht-extra-card figure picture,
.ht-extra-card figure img { display:block;width:100%;height:100%; }
.ht-extra-card figure img { object-fit:cover; }
.ht-extra-card > div { padding:clamp(28px,4vw,48px); }
.ht-extra-card h3 { margin:0; font-size:clamp(1.7rem,2.4vw,2.65rem); line-height:1.08; }
.ht-extra-card p { margin:1rem 0 0;color:var(--ht-muted);font-size:1.04rem;line-height:1.7; }

/* Gallery */
.ht-gallery {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    grid-auto-rows:250px;
    gap:11px;
}
.ht-gallery__item {
    position:relative;
    min-width:0;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:8px;
    background:#ddd;
    cursor:zoom-in;
    text-align:left;
}
.ht-gallery__item:nth-child(1),
.ht-gallery__item:nth-child(6) { grid-column:span 2; }
.ht-gallery__item:nth-child(1) { grid-row:span 2; }
.ht-gallery__item picture,
.ht-gallery__item img { display:block;width:100%;height:100%; }
.ht-gallery__item img { object-fit:cover;transition:transform .35s ease; }
.ht-gallery__item:hover img { transform:scale(1.035); }
.ht-gallery__item span {
    position:absolute;
    left:10px;
    right:10px;
    bottom:10px;
    padding:10px 12px;
    border-radius:6px;
    background:rgba(30,26,23,.82);
    color:#fff;
    font-size:.92rem;
    font-weight:820;
}

/* Operations */
.ht-operations {
    display:grid;
    grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
    gap:clamp(36px,6vw,100px);
    align-items:start;
}
.ht-operations header p:last-child { margin:1.3rem 0 0; font-size:1.08rem;line-height:1.75; }
.ht-operations ul {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin:0;
    padding:0;
    list-style:none;
}
.ht-operations li {
    min-height:74px;
    display:flex;
    align-items:center;
    padding:17px 18px 17px 42px;
    border:1px solid rgba(221,163,111,.25);
    border-radius:7px;
    background:rgba(255,255,255,.035);
    color:rgba(255,255,255,.86);
    font-weight:740;
    line-height:1.45;
    position:relative;
}
.ht-operations li::before {
    content:"✓";
    position:absolute;
    left:17px;
    color:var(--ht-copper-light);
    font-weight:900;
}

/* Chat */
.ht-chat { padding:clamp(62px,7vw,100px) 0;background:linear-gradient(135deg,#102e43,var(--ht-blue));color:#fff; }
.ht-chat__inner { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:45px;align-items:center; }
.ht-chat h2 { color:#fff; }
.ht-chat p:not(.eyebrow) { max-width:850px;margin:1.2rem 0 0;color:rgba(255,255,255,.8);font-size:1.08rem;line-height:1.7; }
.ht-question-chips { display:flex;flex-wrap:wrap;gap:9px;margin-top:1.55rem; }
.ht-question-chips button { padding:9px 13px;border:1px solid rgba(255,255,255,.24);border-radius:999px;background:rgba(255,255,255,.08);color:#fff;cursor:pointer; }

/* FAQ */
.ht-faq-layout { display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:clamp(35px,6vw,90px);align-items:start; }
.ht-faq-list { display:grid;gap:10px; }
.ht-faq-list details { overflow:hidden;border:1px solid var(--ht-line);border-radius:8px;background:rgba(255,255,255,.64); }
.ht-faq-list summary { position:relative;list-style:none;cursor:pointer;padding:22px 58px 22px 23px;font-weight:850;line-height:1.45; }
.ht-faq-list summary::-webkit-details-marker { display:none; }
.ht-faq-list summary::after { content:"+";position:absolute;right:22px;top:50%;transform:translateY(-50%);color:var(--ht-copper);font-size:1.6rem; }
.ht-faq-list details[open] summary::after { content:"−"; }
.ht-faq-list details p { margin:0;padding:0 23px 23px;color:var(--ht-muted);line-height:1.72; }

/* Full form */
.ht-form-section {
    padding:clamp(72px,8vw,120px) 0;
    background:
        linear-gradient(180deg,rgba(31,28,25,.95),rgba(17,15,14,.98)),
        url('../img/horecaterras/project-closed-lamella.webp') center/cover;
    color:#fff;
}
.ht-form-container { display:grid;gap:clamp(28px,4vw,46px); }
.ht-form-intro { width:min(1040px,100%);margin-inline:auto;text-align:center; }
.ht-form-intro h2 { color:#fff; }
.ht-form-intro > p:not(.eyebrow) { margin:1.25rem auto 0;max-width:900px;color:rgba(255,255,255,.75);font-size:1.08rem;line-height:1.72; }
.ht-form-reassurance { display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:1.5rem; }
.ht-form-reassurance span { padding:8px 12px;border:1px solid rgba(221,163,111,.32);border-radius:999px;color:#f2dbc6;font-size:.9rem;font-weight:760; }
.horecaterras-page .ht-form {
    width:min(1080px,100%);
    margin-inline:auto;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:15px 17px;
    padding:clamp(22px,3.5vw,42px);
    border:1px solid rgba(221,163,111,.28);
    border-radius:var(--ht-radius);
    background:rgba(12,11,10,.42);
    backdrop-filter:blur(10px);
}
.horecaterras-page .ht-form label { color:#fff;font-size:.93rem;font-weight:790; }
.horecaterras-page .ht-form input,
.horecaterras-page .ht-form select,
.horecaterras-page .ht-form textarea { background:#fff;color:#211d1a;border-color:rgba(255,255,255,.32); }
.horecaterras-page .ht-form input::placeholder,
.horecaterras-page .ht-form textarea::placeholder { color:#776b61;opacity:1; }
.horecaterras-page .ht-form small,
.horecaterras-page .ht-form .recaptcha-note { color:rgba(255,255,255,.7); }
.horecaterras-page .ht-form .recaptcha-note a { color:var(--ht-copper-light); }
.horecaterras-page .ht-form .form-checkbox-card {
    grid-column:1/-1;
    display:flex;
    grid-template-columns:none;
    align-items:center;
    gap:11px;
    min-height:58px;
    padding:14px 16px;
    border:1px solid rgba(221,163,111,.27);
    border-radius:7px;
    background:rgba(255,255,255,.04);
}
.horecaterras-page .ht-form .form-checkbox-card input { width:20px;height:20px;min-height:0;flex:0 0 auto; }
.ht-form__message,.ht-form__full { grid-column:1/-1; }
.horecaterras-page .ht-form .form-button-row { display:flex;flex-wrap:wrap;justify-content:center;gap:10px; }
.horecaterras-page .ht-form .button--ghost { border-color:rgba(221,163,111,.7); }

/* Lightbox */
.ht-lightbox[hidden] { display:none; }
.ht-lightbox { position:fixed;z-index:100500;inset:0;display:grid;place-items:center;padding:28px;background:rgba(8,7,6,.94); }
.ht-lightbox figure { max-width:min(1320px,94vw);max-height:91vh;margin:0; }
.ht-lightbox img { display:block;max-width:100%;max-height:84vh;object-fit:contain; }
.ht-lightbox figcaption { padding:11px 0;color:#fff;text-align:center; }
.ht-lightbox > button { position:fixed;top:18px;right:22px;width:46px;height:46px;padding:0;border:0;border-radius:50%;background:#fff;color:#211d1a;font-size:29px;cursor:pointer; }
.ht-lightbox-open { overflow:hidden; }

@media (max-width: 1180px) {
    .ht-challenge-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .ht-finance__grid { grid-template-columns:1fr 1fr; }
    .ht-value-grid { grid-template-columns:1fr 1fr; }
    .ht-models { grid-template-columns:1fr 1fr; }
    .ht-model-card:nth-child(4),.ht-model-card:nth-child(5) { grid-column:auto;margin-left:0; }
    .ht-model-card:last-child { grid-column:1/-1;width:calc(50% - 7px);justify-self:center; }
    .ht-concept__steps { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .ht-concept__steps article { border-bottom:1px solid rgba(189,123,69,.22); }
    .ht-concept__steps article:nth-child(3n) { border-right:0; }
    .ht-concept__steps article:nth-last-child(-n+2) { border-bottom:0; }
    .ht-gallery { grid-template-columns:repeat(3,minmax(0,1fr)); }
}

@media (max-width: 980px) {
    .ht-container { width:min(900px, calc(100% - 34px)); }
    .ht-finance__grid,
    .ht-overkapping__grid,
    .ht-feature,
    .ht-operations,
    .ht-faq-layout { grid-template-columns:1fr; }
    .ht-finance__media,.ht-carousel__viewport,.ht-feature__media { min-height:500px; }
    .ht-feature--image-left .ht-feature__media { order:2; }
    .ht-extra-grid { grid-template-columns:1fr; }
    .ht-extra-card { display:grid;grid-template-columns:1fr 1fr; }
    .ht-extra-card figure { min-height:100%; }
    .ht-gallery { grid-template-columns:1fr 1fr;grid-auto-rows:260px; }
    .ht-gallery__item:nth-child(1),.ht-gallery__item:nth-child(6) { grid-column:auto; }
    .ht-gallery__item:nth-child(1) { grid-row:auto; }
    .ht-chat__inner { grid-template-columns:1fr; }
}

@media (max-width: 720px) {
    .ht-container { width:calc(100% - 28px); }
    .ht-section { padding:58px 0; }
    .horecaterras-page h2 { font-size:clamp(2.05rem,10vw,3.15rem); }
    .ht-heading { margin-bottom:26px; }
    .ht-heading--center { text-align:left; }

    .ht-hero { min-height:720px;align-items:end; }
    .ht-hero__media img { object-position:center; }
    .ht-hero__shade { background:linear-gradient(0deg,rgba(12,13,14,.96) 0%,rgba(12,13,14,.78) 48%,rgba(12,13,14,.2) 78%,rgba(12,13,14,.05) 100%); }
    .ht-hero__content { padding-top:210px;padding-bottom:48px; }
    .ht-hero h1 { font-size:clamp(3.15rem,14vw,4.55rem); }
    .ht-hero__lead { font-size:1.04rem;line-height:1.65; }
    .ht-actions { display:grid;grid-template-columns:1fr; }
    .ht-actions .button { width:100%;min-width:0; }

    .ht-challenge-grid { grid-template-columns:1fr; }
    .ht-challenge-grid article { min-height:0;padding:22px; }
    .ht-challenge-grid__problem { margin-bottom:1.2rem; }

    .ht-finance__copy p { font-size:1rem;line-height:1.68; }
    .ht-finance__media { min-height:330px; }
    .ht-value-grid { grid-template-columns:1fr;gap:8px;margin-top:30px; }
    .ht-value-grid article { min-height:0;padding:20px; }

    .ht-copy-card { padding:27px 22px; }
    .ht-copy-card p { font-size:1rem;line-height:1.68; }
    .ht-inline-facts { grid-template-columns:1fr; }
    .ht-carousel__viewport { min-height:360px; }
    .ht-carousel__slide figcaption { left:10px;right:10px;bottom:10px;padding:10px 12px;font-size:.87rem; }
    .ht-carousel__controls { bottom:65px; }
    .ht-carousel__controls > button { width:37px;height:37px; }

    .ht-models { display:grid;grid-template-columns:1fr;gap:10px; }
    .ht-model-card,.ht-model-card:last-child { width:100%;margin:0; }

    .ht-concept__steps { grid-template-columns:1fr; }
    .ht-concept__steps article { border-right:0;border-bottom:1px solid rgba(189,123,69,.22)!important; }
    .ht-concept__steps article:last-child { border-bottom:0!important; }
    .ht-wide-image { min-height:330px; }

    .ht-feature__media { min-height:330px; }
    .ht-feature__copy p { font-size:1rem;line-height:1.68; }
    .ht-extra-card { display:block; }
    .ht-extra-card figure { min-height:285px; }
    .ht-extra-card > div { padding:25px 22px; }

    .ht-gallery { grid-template-columns:1fr 1fr;grid-auto-rows:205px;gap:8px; }
    .ht-gallery__item span { font-size:.76rem;padding:8px 9px; }

    .ht-operations ul { grid-template-columns:1fr; }
    .ht-chat__inner { gap:28px; }
    .ht-question-chips { display:grid;grid-template-columns:1fr 1fr; }
    .ht-question-chips button { font-size:.85rem; }
    .ht-faq-list summary { padding:19px 50px 19px 18px; }
    .ht-faq-list details p { padding:0 18px 19px; }

    .horecaterras-page .ht-form { grid-template-columns:1fr;padding:20px 16px; }
    .horecaterras-page .ht-form > * { grid-column:1!important; }
    .horecaterras-page .ht-form .form-button-row { display:grid; }
}

@media (max-width: 430px) {
    .ht-gallery { grid-template-columns:1fr;grid-auto-rows:245px; }
    .ht-question-chips { grid-template-columns:1fr; }
}

@media (prefers-reduced-motion: reduce) {
    .ht-carousel__slide,.ht-gallery__item img,.ht-model-card img { transition:none; }
}

/* Reviewed accessibility controls for the horeca-project carousel. */
.ht-carousel__controls > .ht-carousel__toggle {
    width: auto;
    min-width: 68px;
    padding: 0 13px;
    border-radius: 999px;
    font-size: .74rem;
    font-weight: 850;
    line-height: 1;
}
.ht-carousel__controls > .ht-carousel__toggle[aria-pressed="true"] {
    background: var(--ht-copper);
}
.ht-carousel__controls > button:focus-visible,
.ht-carousel__dots button:focus-visible,
.ht-lightbox > button:focus-visible {
    outline: 3px solid var(--ht-copper-light);
    outline-offset: 3px;
}
@media (max-width: 720px) {
    .ht-carousel__controls > .ht-carousel__toggle {
        min-width: 58px;
        padding-inline: 10px;
        font-size: .68rem;
    }
}
.ht-carousel {
    touch-action: pan-y;
}

/* v1.2 — page-only visual corrections requested after review. */

/* Keep all five roof-model cards exactly the same size on wide screens. */
@media (min-width: 1181px) {
    .horecaterras-page .ht-models {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }

    .horecaterras-page .ht-model-card {
        grid-column: span 2;
        width: auto;
        margin: 0;
        justify-self: stretch;
    }

    .horecaterras-page .ht-model-card:nth-child(4) {
        grid-column: 2 / span 2;
        margin: 0;
    }

    .horecaterras-page .ht-model-card:nth-child(5) {
        grid-column: 4 / span 2;
        margin: 0;
    }
}

/* Replace the blue assistant section with the existing charcoal/copper palette. */
.horecaterras-page .ht-chat {
    background:
        linear-gradient(135deg, rgba(189, 123, 69, .10), transparent 42%),
        linear-gradient(135deg, #211d1a 0%, #302720 62%, #181614 100%);
    border-top: 1px solid rgba(221, 163, 111, .24);
    border-bottom: 1px solid rgba(221, 163, 111, .18);
}

/* Restore the normal compact, high-contrast footer typography on this page. */
.horecaterras-page .inner-footer {
    color: #fff;
}

.horecaterras-page .inner-footer h2 {
    margin: 0 0 .7rem;
    color: #dda36f;
    font-size: .84rem;
    line-height: 1.4;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.horecaterras-page .inner-footer p,
.horecaterras-page .inner-footer address {
    color: rgba(255, 255, 255, .68);
    font-size: 1rem;
    line-height: 1.65;
}

.horecaterras-page .inner-footer nav a,
.horecaterras-page .inner-footer address a,
.horecaterras-page .inner-footer .cookie-preferences-button {
    color: rgba(255, 255, 255, .80);
    font-size: 1rem;
    line-height: 1.55;
}

.horecaterras-page .inner-footer nav a:hover,
.horecaterras-page .inner-footer address a:hover,
.horecaterras-page .inner-footer .cookie-preferences-button:hover {
    color: #fff;
}

.horecaterras-page .inner-footer__bottom {
    color: rgba(255, 255, 255, .58);
    font-size: .86rem;
}

/* Mobile only: replace the carousel with all four photos underneath each other. */
@media (max-width: 720px) {
    .horecaterras-page .ht-carousel {
        border-radius: 0;
        background: transparent;
        box-shadow: none;
        touch-action: auto;
    }

    .horecaterras-page .ht-carousel__viewport {
        display: grid;
        gap: 12px;
        height: auto;
        min-height: 0 !important;
        overflow: visible;
        border-radius: 0;
    }

    .horecaterras-page .ht-carousel__slide,
    .horecaterras-page .ht-carousel__slide.is-active {
        position: relative;
        inset: auto;
        display: block;
        overflow: hidden;
        margin: 0;
        border-radius: var(--ht-radius);
        background: var(--ht-dark);
        opacity: 1;
        visibility: visible;
        transition: none;
    }

    .horecaterras-page .ht-carousel__slide picture,
    .horecaterras-page .ht-carousel__slide img {
        display: block;
        width: 100%;
        height: auto;
    }

    .horecaterras-page .ht-carousel__slide img {
        aspect-ratio: 3 / 2;
        object-fit: cover;
    }

    .horecaterras-page .ht-carousel__slide figcaption {
        left: 10px;
        right: 10px;
        bottom: 10px;
        padding: 10px 12px;
        font-size: .87rem;
    }

    .horecaterras-page .ht-carousel__controls {
        display: none !important;
    }
}