/* Being Digital design layer: glass, buttons, highlight text, header bar, effects, reveal.
   Colours come from --bd-* (theme options) so everything follows light / dark mode. */
:root{--bdd-ease:cubic-bezier(.22,1,.36,1);--bdd-grad:linear-gradient(100deg,var(--bdd-g1,var(--bd-primary)) 0%,var(--bdd-g2,var(--bd-accent)) 100%);--bdd-btn-grad:linear-gradient(135deg,var(--bd-btn-bg,#dc2626),var(--bd-accent,#e8471c))}
body{transition:background-color .4s,color .4s}

/* ---------- glass (add CSS class "bdd-glass" to any Elementor container) ---------- */
.bdd-glass{background:var(--bd-glass-bg);border:1px solid var(--bd-glass-border);-webkit-backdrop-filter:blur(var(--bd-blur,18px)) saturate(140%);backdrop-filter:blur(var(--bd-blur,18px)) saturate(140%);border-radius:var(--bd-radius,22px);box-shadow:inset 0 1px 0 var(--bd-glass-hi),var(--bd-shadow)}
.e-con.bdd-glass{--border-radius:var(--bd-radius,22px)}
.bdd-glass-solid{background:var(--bd-glass-solid)}

/* ---------- highlight words + headings ---------- */
.bdd-hl--serif-grad,.bdd-hl--serif{font-family:var(--bd-font-serif,"Playfair Display",Georgia,serif);font-style:italic;font-weight:500;letter-spacing:-.02em}
.bdd-hl--serif-grad,.bdd-hl--grad,.bdd-grad{background:var(--bdd-grad);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-right:.04em}
.bdd-gh{margin:0;text-wrap:balance}
html .bdd-gh a{color:inherit;text-decoration:none}

/* ---------- badge / eyebrow ---------- */
html .bdd-badge{display:inline-flex;align-items:center;gap:10px;padding:7px 14px;border-radius:999px;font-family:var(--bd-font-body);font-size:.76rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;line-height:1.3;color:var(--bd-muted);background:var(--bd-chip);border:1px solid var(--bd-glass-border);text-decoration:none}
.bdd-badge.has-dot::before{content:"";width:7px;height:7px;border-radius:50%;flex:none;background:var(--bdd-dot,var(--bd-primary));box-shadow:0 0 12px var(--bdd-dot,var(--bd-primary))}
html a.bdd-badge:hover{color:var(--bd-text)}

/* ---------- buttons ---------- */
.bdd-btns{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.bdd-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 24px;border-radius:999px;font-family:var(--bd-font-body);font-weight:600;font-size:.95rem;line-height:1.2;white-space:nowrap;text-decoration:none;border:1px solid transparent;transition:transform .35s var(--bdd-ease),box-shadow .3s,background .3s,color .3s}
.bdd-btn:active{transform:scale(.97)}
html .bdd-btn--primary,html a.bdd-btn--primary{background:var(--bdd-btn-grad);color:#fff;box-shadow:0 10px 30px -10px rgba(220,38,38,.7),inset 0 1px 0 rgba(255,255,255,.25)}
html .bdd-btn--primary:hover{color:#fff;box-shadow:0 16px 40px -10px rgba(220,38,38,.85),inset 0 1px 0 rgba(255,255,255,.25)}
html .bdd-btn--ghost,html a.bdd-btn--ghost{background:var(--bd-chip);border-color:var(--bd-glass-border);color:var(--bd-text);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
html .bdd-btn--ghost:hover{background:var(--bd-chip-hover);color:var(--bd-text)}
.bdd-btn svg,.bdd-btn i{width:18px;height:18px;font-size:18px}
/* Elementor button widget styled like the design: add CSS class "bdd-button-primary" or "bdd-button-ghost" */
.bdd-button-primary .elementor-button{background:var(--bdd-btn-grad);color:#fff;box-shadow:0 10px 30px -10px rgba(220,38,38,.7)}
.bdd-button-ghost .elementor-button{background:var(--bd-chip);border:1px solid var(--bd-glass-border);color:var(--bd-text)}
.bdd-button-primary .elementor-button:hover{color:#fff}
.bdd-button-ghost .elementor-button:hover{background:var(--bd-chip-hover);color:var(--bd-text)}
.bdd-magnetic{transition:transform .35s var(--bdd-ease)}

/* ---------- header bar (CSS class "bdd-nav" on the header container) ---------- */
.bdd-nav{position:fixed!important;top:14px;left:50%;transform:translateX(-50%);z-index:100;width:min(calc(100% - 32px),var(--bd-container,1240px))!important;max-width:none!important;border-radius:999px!important;transition:transform .45s var(--bdd-ease),background .3s}
.bdd-nav.is-hidden{transform:translate(-50%,-160%)}
.admin-bar .bdd-nav{top:46px}
.bdd-nav .elementor-nav-menu--main .elementor-item{border-radius:999px}
.bdd-nav .elementor-nav-menu--main .elementor-item:hover,.bdd-nav .elementor-nav-menu--main .elementor-item.elementor-item-active{background:var(--bd-chip-hover)}
.bdd-nav .elementor-nav-menu--dropdown{border-radius:18px;overflow:hidden;background:var(--bd-glass-solid)!important;-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);border:1px solid var(--bd-glass-border)}
.bdd-nav .elementor-menu-toggle{border-radius:50%;background:var(--bd-chip)!important}
@media (max-width:1024px){.bdd-nav{border-radius:28px!important}}
@media (max-width:782px){.admin-bar .bdd-nav{top:60px}}

/* ---------- logo light / dark ---------- */
html .bdd-logo{display:inline-flex;align-items:center;text-decoration:none}
.bdd-logo img{width:auto;height:38px;display:block}
.bdd-logo__text{font-weight:800;font-size:1.2rem;color:var(--bd-text)}
.bdd-logo__light{display:none!important}
html[data-theme="light"] .bdd-logo__light{display:block!important}
html[data-theme="light"] .bdd-logo:has(.bdd-logo__light) .bdd-logo__dark{display:none!important}

/* ---------- theme toggle ---------- */
.bdd-toggle{width:44px;height:44px;border-radius:50%;display:inline-grid;place-items:center;padding:0;cursor:pointer;color:var(--bd-text);background:var(--bd-chip);border:1px solid var(--bd-glass-border);transition:background .2s,transform .3s var(--bdd-ease)}
.bdd-toggle:hover{background:var(--bd-chip-hover);transform:rotate(-12deg)}
.bdd-toggle svg{width:19px;height:19px}
.bdd-toggle .sun{display:none}
html[data-theme="light"] .bdd-toggle .sun{display:block}
html[data-theme="light"] .bdd-toggle .moon{display:none}
.bdd-toggle[hidden]{display:none}

/* ---------- ambient effects ---------- */
.bd-ambient{position:fixed;inset:0;z-index:-2;pointer-events:none;overflow:hidden}
.bd-blob{position:absolute;border-radius:50%;will-change:transform}
.bd-b1{width:70vmax;height:70vmax;left:-30vmax;top:-30vmax;background:radial-gradient(circle,rgba(255,59,59,var(--bd-blob-a)),transparent 62%)}
.bd-b2{width:60vmax;height:60vmax;right:-28vmax;top:10vh;background:radial-gradient(circle,rgba(124,58,237,var(--bd-blob-b)),transparent 62%)}
.bd-b3{width:60vmax;height:60vmax;left:10vw;bottom:-36vmax;background:radial-gradient(circle,rgba(34,211,238,var(--bd-blob-c)),transparent 62%)}
.bd-grid-bg{position:fixed;inset:0;z-index:-1;pointer-events:none;background-image:linear-gradient(var(--bd-grid-line) 1px,transparent 1px),linear-gradient(90deg,var(--bd-grid-line) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:radial-gradient(ellipse at 50% 0%,#000 30%,transparent 75%);mask-image:radial-gradient(ellipse at 50% 0%,#000 30%,transparent 75%)}
.bd-cursor-glow{position:fixed;left:0;top:0;width:420px;height:420px;margin:-210px 0 0 -210px;border-radius:50%;pointer-events:none;z-index:-1;opacity:0;background:radial-gradient(circle,rgba(255,59,59,.14),transparent 60%);transition:opacity .4s}
.bd-cursor-glow.on{opacity:1}
.bd-progress{position:fixed;top:0;left:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(0);z-index:200;background:linear-gradient(90deg,var(--bd-primary),var(--bd-accent),#22d3ee)}
/* Elementor sections are transparent over the ambient layer when the kit background is the page colour */
.bd-fx-ambient .elementor-location-header,.bd-fx-ambient .elementor-location-footer{background:transparent}

/* ---------- intro + reveal ---------- */
.bdd-intro{animation:bdd-intro 1s var(--bdd-ease) both}
.bdd-intro.d1{animation-delay:.08s}.bdd-intro.d2{animation-delay:.16s}.bdd-intro.d3{animation-delay:.24s}
@keyframes bdd-intro{from{transform:translateY(26px)}to{transform:none}}
.bdd-fade-in{animation:bdd-fade 1.1s var(--bdd-ease) .2s both}
@keyframes bdd-fade{from{opacity:0;transform:translateY(30px) scale(.96)}to{opacity:1;transform:none}}
.bd-js .bd-fx-reveal-on .bdd-reveal{opacity:0;transform:translateY(34px);transition:opacity .9s var(--bdd-ease),transform .9s var(--bdd-ease)}
.bd-js .bd-fx-reveal-on .bdd-reveal.is-in{opacity:1;transform:none}
.elementor-editor-active .bdd-reveal{opacity:1!important;transform:none!important}

/* ---------- utilities ---------- */
.bdd-stretch::after{content:"";position:absolute;inset:0;border-radius:inherit}
.bdd-lead,.bdd-lead p{color:var(--bd-muted)}
.bdd-prose ul{padding:0;list-style:none;display:grid;gap:8px}
.bdd-prose ul li{position:relative;padding-left:22px}
.bdd-prose ul li::before{content:"";position:absolute;left:4px;top:.72em;width:7px;height:7px;border-radius:50%;background:var(--bd-primary)}
html .bdd-prose a{color:var(--bd-link);text-decoration:underline;text-underline-offset:3px}
.bdd-prose strong{color:var(--bd-primary-dark)}
.bdd-tags-center .elementor-icon-list-items{justify-content:center}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .bd-js .bdd-reveal{opacity:1!important;transform:none!important}
}

/* ---------- single project (fallback template) ---------- */
.bd-project{padding-top:150px;padding-bottom:90px}
.bd-project__head{max-width:860px;margin-bottom:40px}
.bd-project__shot{aspect-ratio:16/10}
.bd-project__shot img{object-position:top}
.bd-project__body{display:grid;grid-template-columns:320px 1fr;gap:40px;margin-top:40px;align-items:start}
.bd-project__facts{padding:24px;margin:0;display:grid;gap:16px}
.bd-project__facts dt{font-size:.75rem;text-transform:uppercase;letter-spacing:.12em;color:var(--bd-muted)}
.bd-project__facts dd{margin:2px 0 0;font-weight:600;color:var(--bd-text)}
@media (max-width:900px){.bd-project__body{grid-template-columns:1fr}}

/* ---------- Elementor image with class "bdd-img" ---------- */
.bdd-img img{width:100%;aspect-ratio:4/3;object-fit:cover;border:1px solid var(--bd-glass-border);box-shadow:var(--bd-shadow)}
.bdd-img--wide img{aspect-ratio:16/9}

/* ---------- table inside a text editor ---------- */
.bdd-table-wrap{overflow-x:auto;padding:0!important}
.bdd-table{width:100%;border-collapse:collapse;min-width:640px;font-size:.95rem;margin:0}
.bdd-table th,.bdd-table td{padding:16px 20px;text-align:left;border:0;border-bottom:1px solid var(--bd-line);color:var(--bd-text);background:none}
.bdd-table thead th{font-size:.8rem;text-transform:uppercase;letter-spacing:.1em;color:var(--bd-muted)}
.bdd-table td,.bdd-table thead th:not(:first-child){text-align:center}
.bdd-table tbody tr:last-child th,.bdd-table tbody tr:last-child td{border-bottom:0}
.bdd-table th:first-child{position:sticky;left:0;z-index:1;background:var(--bd-surface)}
.bdd-table .yes{color:var(--bd-accent-dark);font-weight:700}

/* ---------- PRO Elements form with class "bdd-form" ---------- */
.bdd-form .elementor-field-group .elementor-field{min-height:50px;color:var(--bd-text)!important;background-color:var(--bd-input-bg)!important;border-color:var(--bd-glass-border)!important}
.bdd-form .elementor-field-group .elementor-field:focus{border-color:var(--bd-primary)!important;box-shadow:0 0 0 4px rgba(255,59,59,.15);outline:none}
.bdd-form .elementor-field-group select option{color:#0d0d14}
.bdd-form .elementor-field-label{color:var(--bd-text)!important}
.bdd-form .elementor-button{min-height:52px;background:linear-gradient(135deg,#dc2626,#e8471c)!important}
.bdd-form .elementor-message{color:var(--bd-text)}

/* ---------- text widgets ---------- */
html .elementor-widget-text-editor a.bdd-more{text-decoration:none}