/*!
 * DENTAON theme – main stylesheet
 * Design system recreated from the DENTAON Elementor templates (dental-website.zip).
 * Colors, fonts, button and layout sizes come from CSS variables printed by the Customizer
 * (inc/customizer.php), so one change restyles every page, the header and the footer.
 * Component rules are scoped under `.dn` (every DENTAON widget and the built-in header/footer)
 * so they never leak into plugins or native Elementor widgets.
 */

/* ---------- Tokens (defaults; Customizer values are printed after this file) ---------- */
:root{
	--blue:#1677D2;--blue-d:#0F62B0;--teal:#14B8A6;--ink:#172B4D;--mut:#5B6B86;--bg:#fff;--bg2:#F5F9FC;--line:#E3EDF5;--card:#fff;
	--icbg:#E6F6F4;--cta:#172B4D;--note:#88AAAA;--dash-line:#D8E6F2;--input-line:#C9D8E6;--err:#C2410C;--ok:#0E8F66;
	--dn-footer-bg:#0F1F3A;--dn-footer-text:#C5D1E3;--dn-wa:#1FA855;
	--dn-font-body:"Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif;
	--dn-font-head:"Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif;
	--dn-base:16px;--dn-head-weight:700;--dn-btn-radius:8px;--dn-btn-pad-y:12px;--dn-btn-pad-x:22px;--dn-btn-weight:600;
	--dn-header-h:70px;--dn-wrap:1180px;--dn-radius:12px;--dn-min:250px
}

/* ---------- Base (as in the original templates) ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-padding-top:calc(var(--dn-header-h) + 8px)}
body{margin:0;font-family:var(--dn-font-body);font-size:var(--dn-base);color:var(--ink);line-height:1.65;background:var(--bg)}
a{color:var(--blue);text-decoration:none}
img,svg,video,iframe{max-width:100%}
img{height:auto}
h1,h2,h3,h4,h5,h6{font-family:var(--dn-font-head);font-weight:var(--dn-head-weight);color:inherit}
h1{font-size:clamp(30px,4.5vw,48px);line-height:1.15;margin:0 0 16px}
h2{font-size:clamp(24px,3vw,34px);margin:0 0 12px}
h3{font-size:1.17em;margin:1em 0}
h4{font-size:1em;margin:1.33em 0}
:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;width:1px;word-wrap:normal!important}
.skip-link{position:absolute;left:-999px;top:auto}
.skip-link:focus{left:10px;top:10px;background:#fff;color:#000;padding:8px;z-index:100000;clip:auto;clip-path:none;width:auto;height:auto}
.alignleft{float:left;margin:0 1.5em 1em 0}.alignright{float:right;margin:0 0 1em 1.5em}.aligncenter{display:block;margin-left:auto;margin-right:auto}
.wp-caption,.gallery-caption{max-width:100%;font-size:.88em;color:var(--mut)}
.sticky,.bypostauthor{}

/* ---------- Wrapper & sections (built-in templates) ---------- */
.dn .w,.dn-entry .w{max-width:var(--dn-wrap);margin:auto;padding:0 20px}
.dn.hero,.e-con.hero{background-color:var(--bg);background-image:linear-gradient(180deg,var(--bg2),var(--bg))}
section.dn.hero{padding:70px 0}
section.dn.sec{padding:64px 0}
.e-con.alt,section.dn.alt{background-color:var(--bg2)}
.e-con.center,.e-con.center .dn{text-align:center}

/* Elementor sections built by the demo import: spacing comes from the elements, as in the original */
.e-con.dn-sec{--gap:0px;--row-gap:0px;--column-gap:0px;--widgets-spacing:0px;--widgets-spacing-row:0px;--widgets-spacing-column:0px}
.e-con.dn-sec>.e-con-inner{--gap:0px;--row-gap:0px;--column-gap:0px}
.e-con .elementor-widget.dn{margin-block-end:0}

/* ---------- Header ---------- */
.site-header{position:sticky;top:0;z-index:50;background:var(--bg);border-bottom:1px solid var(--line)}
.site-header.no-sticky{position:relative}
.admin-bar .site-header{top:32px}
@media(max-width:782px){.admin-bar .site-header{top:46px}}
@media(max-width:600px){.admin-bar .site-header{top:0}}
.site-header .e-con{--min-height:var(--dn-header-h)}
.dn .nav{display:flex;align-items:center;gap:22px;min-height:var(--dn-header-h)}
.dn .logo{font-weight:800;font-size:24px;color:var(--ink);line-height:1.65;display:inline-block;text-decoration:none;white-space:nowrap}
.dn .logo:hover{color:var(--ink)}
.dn .logo b{color:var(--teal)}
.dn .logo img{display:block;width:auto;max-height:40px}
.site-footer .dn .logo,.dn .flogo{color:#fff}
.elementor-widget-dentaon-logo,.elementor-widget-dentaon-lang{flex:0 0 auto}
.e-con>.e-con-inner>.elementor-widget.elementor-widget-dentaon-nav,.e-con>.elementor-widget.elementor-widget-dentaon-nav,.dn .nav>.dn-nav{margin-left:auto}

.dn .dn-nav{display:flex;gap:20px;align-items:center}
.dn .dn-nav .menu{display:flex;gap:20px;align-items:center;list-style:none;margin:0;padding:0}
.dn .dn-nav .menu>li{position:relative;margin:0;padding:0}
.dn .dn-nav .menu a{color:var(--ink);font-weight:500}
.dn .dn-nav button.sub,.dn .burger{display:none}
.dn .mega{display:none;position:absolute;top:100%;left:-200px;width:620px;background:var(--card);border:1px solid var(--line);box-shadow:0 12px 30px #172b4d1f;padding:16px;grid-template-columns:1fr 1fr;gap:2px 16px;border-radius:10px;z-index:60}
.dn .mega.single{left:0;width:280px;grid-template-columns:1fr}
.dn .dd:hover>.mega,.dn .dd:focus-within>.mega,.dn .dd.open>.mega{display:grid}
.dn .dd.esc>.mega{display:none!important}
.dn .mega a{display:block;padding:6px 8px;border-radius:6px;font-size:14px;line-height:1.65}
.dn .mega a:hover{background:var(--bg2)}
.dn .mega a.full{grid-column:1/-1}
.dn .lang{display:inline-flex;border:1px solid var(--line);border-radius:999px;overflow:hidden;white-space:nowrap}
.dn .lang a,.dn .lang span{padding:5px 11px;font-size:13px;line-height:1.4;color:var(--ink)}
.dn .lang [aria-current=true]{background:var(--ink);color:var(--bg)}
.dn .lang.lang-ph{opacity:.55}

@media(max-width:860px){
	.site-header .e-con,.site-header .e-con-inner,.site-header .elementor-element.elementor-widget-dentaon-nav{position:static!important}
	.dn .dn-nav{gap:8px}
	.dn .burger:hover,.dn .burger:focus{background:var(--card);color:var(--ink)}
	.dn .burger{-webkit-tap-highlight-color:transparent;display:inline-grid;place-items:center;width:42px;height:42px;border:1px solid var(--line);border-radius:8px;background:var(--card);color:var(--ink);cursor:pointer;padding:0}
	.dn .burger span,.dn .burger span::before,.dn .burger span::after{display:block;width:18px;height:2px;background:currentColor;border-radius:2px;position:relative;content:""}
	.dn .burger span::before{position:absolute;top:-6px}.dn .burger span::after{position:absolute;top:6px}
	.dn .burger[aria-expanded=true] span{background:transparent}
	.dn .burger[aria-expanded=true] span::before{top:0;transform:rotate(45deg)}
	.dn .burger[aria-expanded=true] span::after{top:0;transform:rotate(-45deg)}
	.dn .dn-nav .menu{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:0;background:var(--bg);border-bottom:1px solid var(--line);box-shadow:0 16px 30px #172b4d1a;padding:8px 20px 16px;max-height:calc(100vh - var(--dn-header-h));overflow:auto;z-index:60}
	.dn .dn-nav .menu.open{display:flex}
	.dn .dn-nav .menu>li{border-bottom:1px solid var(--line)}
	.dn .dn-nav .menu>li:last-child{border-bottom:0}
	.dn .dn-nav .menu>li>a{display:block;padding:12px 0}
	.dn .dn-nav .menu>li.dd{display:flex;flex-wrap:wrap;align-items:center}
	.dn .dn-nav .menu>li.dd>a{flex:1}
	.dn .dn-nav .menu>li.dd>a .car{display:none}
	.dn .dn-nav button.sub:hover,.dn .dn-nav button.sub:focus{background:var(--bg2);color:var(--ink)}
	.dn .dn-nav button.sub{-webkit-tap-highlight-color:transparent;display:inline-grid;place-items:center;width:40px;height:40px;border:0;background:none;color:var(--ink);font-size:16px;cursor:pointer;border-radius:8px}
	.dn .dn-nav .dd.open>button.sub{transform:rotate(180deg)}
	.dn .mega,.dn .mega.single{position:static;width:100%;box-shadow:none;border:0;padding:0 0 10px 8px;grid-template-columns:1fr;flex-basis:100%}
	.dn .dd:hover>.mega,.dn .dd:focus-within>.mega{display:none}
	.dn .dd.open>.mega{display:grid}
	.dn .btn.hdr-btn{white-space:nowrap}
	.dn .btn.hdr-btn.hide-m{display:none}
	.site-header .dn .nav{gap:12px}
	.site-header .dn .nav>.logo{margin-right:auto}
	.site-header .elementor-widget-dentaon-logo{order:-2}
	.site-header .elementor-widget-dentaon-lang{order:-1;margin-left:auto}
	.site-header :has(>.elementor-widget-dentaon-lang)>.elementor-widget-dentaon-nav{margin-left:0!important}
}
@media(max-width:480px){.dn .btn.hdr-btn{padding:10px 14px;font-size:14px}}
@media(max-width:400px){.dn .logo{font-size:21px}.dn .btn.hdr-btn{padding:8px 9px;font-size:13px}.dn .burger{width:38px;height:38px}.site-header .dn .nav,.site-header .e-con,.site-header .e-con-inner{--gap:8px;gap:8px}}
@media(max-width:340px){.dn .kp>div{min-width:0;overflow-wrap:anywhere}.dn .logo{font-size:19px}.dn .btn.hdr-btn{padding:7px 7px;font-size:12px}}

/* ---------- Buttons ---------- */
.dn .btn,.dn-entry .btn,.search-form .btn{display:inline-block;background:var(--blue);color:#fff;padding:var(--dn-btn-pad-y) var(--dn-btn-pad-x);border-radius:var(--dn-btn-radius);font-weight:var(--dn-btn-weight);border:0;cursor:pointer;font-size:15px;line-height:1.65;font-family:inherit;text-decoration:none;text-align:center}
.dn .btn:hover{background:var(--blue-d);color:#fff}
.dn .btn.o{background:var(--card);color:var(--blue);border:1.5px solid var(--blue)}
.dn .btn.o:hover{background:var(--bg2);color:var(--blue-d);border-color:var(--blue-d)}
.dn .btn.t{background:var(--teal);color:#fff}
.dn .btn.t:hover{filter:brightness(.93)}
.dn .btn.wab{background:var(--dn-wa);color:#fff}
.dn .btn:disabled{opacity:.6;cursor:wait}

/* ---------- Text ---------- */
.dn .muted{color:var(--mut)}
.dn .lead{font-size:18px}
.dn .note{font-size:12px;color:var(--note)}
.dn .bc{font-size:14px;color:var(--mut);margin-bottom:14px}
.dn-text>:first-child{margin-top:0}
.dn-text>:last-child{margin-bottom:0}
.dn-text.muted{color:var(--mut)}.dn-text.lead{font-size:18px}.dn-text.note{font-size:12px;color:var(--note)}

/* ---------- Cards ---------- */
.dn .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(var(--dn-min),100%),1fr));gap:18px}
.dn .grid.cols-1{grid-template-columns:1fr}
.dn .grid.cols-2{grid-template-columns:repeat(2,1fr)}
.dn .grid.cols-3{grid-template-columns:repeat(3,1fr)}
.dn .grid.cols-4{grid-template-columns:repeat(4,1fr)}
.dn .grid.start{align-items:start}
@media(max-width:1024px){.dn .grid.cols-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:860px){.dn .grid.cols-3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.dn .grid.cols-2,.dn .grid.cols-3,.dn .grid.cols-4{grid-template-columns:1fr}}
.dn .card{background:var(--card);border:1px solid var(--line);border-radius:var(--dn-radius);padding:22px;position:relative}
.dn .card h3,.dn .card .card-t{margin:0 0 6px;font-size:18px}
.dn .card.linked .tlink::after{content:"";position:absolute;inset:0;border-radius:inherit}
.dn .card.linked:hover{border-color:var(--blue)}
.dn .ic{width:42px;height:42px;border-radius:10px;background:var(--icbg);color:var(--teal);display:grid;place-items:center;font-weight:700;margin-bottom:10px}
.dn .ic svg{width:55%;height:55%;fill:currentColor}
.dn .ic i{font-size:20px}
.dn .post-card .thumb{display:block;margin:-22px -22px 16px;border-radius:var(--dn-radius) var(--dn-radius) 0 0;overflow:hidden}
.dn .post-card .thumb img{display:block;width:100%}
.dn .post-card .meta{font-size:13px;color:var(--mut);margin:0 0 6px}
.dn .post-card h3 a{color:var(--ink)}
.dn .post-card h3 a:hover{color:var(--blue)}
.dn .pg{display:flex;gap:8px;justify-content:center;margin-top:28px;flex-wrap:wrap}
.dn .pg .page-numbers{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:8px;padding:6px 14px}
.dn .pg .current{background:var(--blue);border-color:var(--blue);color:#fff}

/* ---------- Dashboard mock-up ---------- */
.dn .dash{background:var(--card);border:1px solid var(--dash-line);border-radius:14px;box-shadow:0 20px 50px #1677d220;padding:16px}
.dn .kp{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.dn .kp>div{background:var(--bg2);border-radius:8px;padding:10px;font-size:12px}
.dn .kp b{display:block;font-size:20px;color:var(--blue)}
.dn .bars{display:flex;gap:6px;align-items:flex-end;height:90px;margin:12px 0}
.dn .bars i{flex:1;background:var(--teal);border-radius:4px 4px 0 0}
.dn table{width:100%;border-collapse:collapse;font-size:13px}
.dn td,.dn th{padding:7px;border-bottom:1px solid var(--line);text-align:left}

/* ---------- CTA band ---------- */
.dn .cta{background:var(--cta);color:#fff;text-align:center;padding:60px 20px}
.dn .cta .dn-h,.dn .cta h2{color:#fff}

/* ---------- FAQ ---------- */
.dn details{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:14px 18px;margin-bottom:10px}
.dn summary{cursor:pointer;font-weight:600}
.dn details .ans>:last-child{margin-bottom:0}

/* ---------- Forms ---------- */
.dn input,.dn select,.dn textarea,.dn-entry input:not([type=submit]):not([type=checkbox]):not([type=radio]),.dn-entry textarea{width:100%;padding:11px;border:1px solid var(--input-line);border-radius:8px;font:inherit;margin:4px 0 12px;background:var(--card);color:var(--ink)}
.dn input[type=checkbox],.dn input[type=radio]{width:auto;margin:0 8px 0 0}
.dn label{font-weight:600;font-size:14px}
.dn form.dnf .fld label{display:block}
.dn form.dnf .fld input,.dn form.dnf .fld select,.dn form.dnf .fld textarea{display:block}
.dn form.dnf .fld label.consent{display:flex;align-items:flex-start;font-weight:400;margin:4px 0 12px}
.dn form.dnf.lay-two{display:grid;grid-template-columns:1fr 1fr;column-gap:16px}
.dn form.dnf.lay-two .fld:has(textarea),.dn form.dnf.lay-two .fld:has(.consent),.dn form.dnf.lay-two .fmsg{grid-column:1/-1}
.dn form.dnf.lay-two button{justify-self:start}
.dn form.dnf.lay-inline{display:flex;flex-wrap:wrap;gap:0 10px;align-items:flex-end}
.dn form.dnf.lay-inline .fld{flex:1 1 200px}
.dn form.dnf.lay-inline button{margin-bottom:12px}
.dn form.dnf.lay-inline .fmsg{flex-basis:100%}
@media(max-width:600px){.dn form.dnf.lay-two{grid-template-columns:1fr}}
.dn .hp{position:absolute!important;left:-9999px;height:0;width:0;overflow:hidden}
.dn .fmsg{min-height:1.4em;font-weight:600;margin-top:10px}
.dn .fmsg:empty{margin-top:0}
.dn .fmsg.good{color:var(--ok)}
.dn .fmsg.bad{color:var(--err)}
.dn .fld-err input,.dn .fld-err select,.dn .fld-err textarea{border-color:var(--err)!important;box-shadow:0 0 0 2px rgba(194,65,12,.15)}
.dn .ferr{display:block;font-size:13px;color:var(--err);margin:-8px 0 10px;font-weight:600}
.dn .cta .fmsg.good,.dn .cta .fmsg.bad{color:#fff}

/* ---------- Contact card ---------- */
.dn .info-card .map{margin-top:14px;border-radius:10px;overflow:hidden;aspect-ratio:4/3}
.dn .info-card .map iframe{display:block;width:100%;height:100%;border:0}

/* ---------- Footer ---------- */
.site-footer{background:var(--dn-footer-bg);color:var(--dn-footer-text);font-size:14px}
.site-footer .dn{color:var(--dn-footer-text)}
.site-footer h4,.site-footer .dn h4{color:#fff}
.site-footer a,.site-footer .dn a{color:var(--dn-footer-text)}
.site-footer a:hover,.site-footer .dn a:hover{color:#fff}
.dn .fl{list-style:none;margin:0;padding:0}
.dn .fl a,.dn .fl span{display:block;padding:2px 0}
.dn .fg{display:grid;grid-template-columns:1.5fr 1fr 1.4fr 1fr;gap:30px}
.dn .copy{margin-top:30px}
.dn .social{display:flex;gap:10px;flex-wrap:wrap;list-style:none;padding:0;margin:12px 0 0}
.dn .social a{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.08);color:#fff}
.dn .social a:hover{background:var(--blue)}
.dn .social svg{width:16px;height:16px;fill:currentColor}
.fallback-footer{padding:50px 0 20px}
@media(max-width:860px){.dn .fg{grid-template-columns:1fr}}

/* ---------- Floating WhatsApp (optional, off by default) ---------- */
.wa-float{position:fixed;right:18px;bottom:18px;z-index:60;background:var(--dn-wa);color:#fff;border-radius:999px;padding:12px 18px;font-weight:700;box-shadow:0 8px 24px rgba(0,0,0,.25)}
.wa-float:hover{color:#fff;filter:brightness(.95)}
.wa-float.left{right:auto;left:18px}

/* ---------- Blog posts, pages and comments (non-Elementor content) ---------- */
.dn-entry{padding:48px 0 72px}
.dn-entry .w{max-width:820px}
.dn.dn-ph .entry-meta{margin:0}
.entry-content>*{max-width:100%}
.entry-content a{color:var(--blue);text-decoration:underline}
.entry-content blockquote{border-left:4px solid var(--teal);margin:1.5em 0;padding:.5em 1.2em;background:var(--bg2);border-radius:0 10px 10px 0}
.entry-content pre{background:var(--bg2);padding:16px;border-radius:10px;overflow:auto}
.entry-content table{width:100%;border-collapse:collapse}
.entry-content th,.entry-content td{border-bottom:1px solid var(--line);padding:8px 10px;text-align:left}
.entry-meta{font-size:14px;color:var(--mut)}
.entry-thumb{margin:0 0 28px;border-radius:var(--dn-radius);overflow:hidden}
.post-nav{display:flex;justify-content:space-between;gap:16px;margin-top:40px;padding-top:20px;border-top:1px solid var(--line)}
.dn-comments{margin-top:48px}
.dn-comments .submit{display:inline-block;padding:var(--dn-btn-pad-y) var(--dn-btn-pad-x);border-radius:var(--dn-btn-radius);border:0;background:var(--blue);color:#fff;font:inherit;font-weight:var(--dn-btn-weight);cursor:pointer}
.comment-list{list-style:none;padding:0}.comment-list .children{list-style:none}
.search-form .search{flex:1 1 220px;margin:0;padding:11px;border:1px solid var(--input-line);border-radius:8px;font:inherit}
.e404{text-align:center}
.e404 .e404-search{max-width:420px;margin:0 auto 20px}
.e404 .search-form{justify-content:center}

@media print{.site-header,.site-footer,.wa-float{display:none!important}}
