/* Shared by the PHP theme and native Elementor section. */
/* Dark band over the team photo, like the homepage devis section. */
.instagram-section{position:relative;isolation:isolate;color:#fff;background:linear-gradient(90deg,rgba(6,47,71,.97) 0%,rgba(8,58,86,.9) 48%,rgba(12,91,131,.78) 100%),url('/wp-content/themes/tangerbay-elegance/assets/clinic/team.webp') center 30%/cover no-repeat,#082f47}
.instagram-section.e-con{display:block;width:100%;max-width:none;padding:96px 0;--gap:0px}
.instagram-section .e-con{min-width:0}
.instagram-section .tbe-instagram-inner.e-con{width:100%;max-width:calc(var(--max) + var(--gutter)*2);padding:0 var(--gutter);margin-inline:auto}
/* On desktop, 10 of the container's 12 columns, centred: one column of extra inset each side. */
@media(min-width:1200px){.instagram-section .tbe-instagram-inner,.instagram-section .tbe-instagram-inner.e-con{padding-inline:calc(var(--gutter) + (min(100%, var(--max) + var(--gutter)*2) - var(--gutter)*2)/12)}}
/* Copy and follow button on the left, the reel on the right, a connected feed underneath. */
.instagram-section .tbe-instagram-inner,.instagram-section .tbe-instagram-inner.e-con{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);gap:48px clamp(48px,7vw,120px);align-items:center}
.instagram-section .tbe-instagram-inner>:has(.tbe-instagram-feed),.instagram-section .tbe-instagram-inner>.tbe-instagram-feed{grid-column:1/-1}
.instagram-section:has(.tbe-instagram-reel) .tbe-instagram-inner>:has(.tbe-instagram-empty){display:none}
.instagram-section .tbe-instagram-heading{display:flex;flex-direction:column;align-items:flex-start;gap:36px;margin:0;padding:0}
.instagram-section .tbe-instagram-copy{display:flex;flex-direction:column;gap:0;align-items:flex-start;width:auto;padding:0}
.instagram-section :where(.eyebrow),.instagram-section .eyebrow.elementor-widget-text-editor{margin-bottom:18px;font-size:12px;font-weight:500;letter-spacing:.11em;line-height:1.8;color:var(--blue);text-transform:uppercase}
.instagram-section .eyebrow,.instagram-section .eyebrow.elementor-widget-text-editor{color:#c9eaf7}
.instagram-section :where(.eyebrow) p{font:inherit;color:inherit}
.instagram-section :where(h2),.instagram-section .tbe-instagram-title .elementor-heading-title{font-family:var(--heading);font-size:clamp(40px,5.2vw,78px);font-weight:400;line-height:1.08;letter-spacing:.015em;color:#fff}
.instagram-section :where(h2,.elementor-heading-title) span{color:var(--sky)}
.instagram-section :where(.tbe-instagram-intro),.instagram-section .tbe-instagram-intro.elementor-widget-text-editor{max-width:560px;margin-top:26px;color:#d3e6ef;font-size:20px;line-height:1.65}
.instagram-section :where(.elementor-widget){min-width:0;max-width:100%;margin-bottom:0}
.instagram-section :where(.elementor-widget-text-editor) p{margin:0}
.instagram-section .tbe-instagram-intro p{font:inherit;color:inherit}
.instagram-section :where(.tbe-instagram-follow){flex-shrink:0;width:auto}
.instagram-section :where(.tbe-instagram-follow .elementor-button){display:inline-flex;align-items:center;background:#fff;color:var(--blue);border-radius:50px;padding:17px 24px;font:500 15px/1.5 var(--font)}
.instagram-section .button.tbe-instagram-follow{background:#fff;border-color:#fff;color:var(--blue)}
.instagram-section .button.tbe-instagram-follow:hover{background:#eaf8ff}
.instagram-section .button.tbe-instagram-follow .button-icon{background:#e9f7fd}
/* The cabinet's video inside a phone frame (template-parts/instagram-reel.php). */
.tbe-instagram-reel{justify-self:center;width:100%;max-width:420px}
/* A titanium edge, black bezel, side buttons, and a status bar and home indicator over the video. */
.tbe-instagram-phone{position:relative;padding:3px;border-radius:62px;background:linear-gradient(150deg,#6b7782 0%,#262f38 28%,#10161c 55%,#46525d 100%);box-shadow:0 40px 90px #0000008c,0 12px 28px #00000059}
.tbe-instagram-phone::before,.tbe-instagram-phone::after{content:"";position:absolute;width:4px;border-radius:3px;background:linear-gradient(90deg,#55616c,#1b232b)}
.tbe-instagram-phone::before{left:-3px;top:170px;height:58px;box-shadow:0 74px 0 #2a333c}
.tbe-instagram-phone::after{right:-3px;top:210px;height:92px}
.tbe-phone-body{padding:11px;border-radius:59px;background:#05080b;box-shadow:inset 0 0 0 1px #ffffff12}
.tbe-phone-screen{position:relative;overflow:hidden;aspect-ratio:9/16;border-radius:48px;background:#05080b}
.tbe-phone-video{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}
.tbe-phone-status{position:absolute;inset:0 0 auto;z-index:1;display:flex;align-items:center;justify-content:space-between;height:52px;padding:4px 30px 0 34px;background:linear-gradient(#00000052,#0000);color:#fff;pointer-events:none;font:600 15px/1 -apple-system,BlinkMacSystemFont,"SF Pro Text",var(--font)}
.tbe-phone-island{position:absolute;top:11px;left:50%;width:34%;height:30px;border-radius:20px;background:#000;transform:translateX(-50%)}
.tbe-phone-icons{display:flex;align-items:center;gap:5px}
.tbe-phone-icons svg{display:block;height:11px;width:auto;fill:currentColor}
.tbe-phone-icons svg:last-child{height:12px}
.tbe-phone-home{position:absolute;inset:auto 0 0;z-index:1;height:28px;pointer-events:none}
.tbe-phone-home::after{content:"";position:absolute;left:50%;bottom:9px;width:36%;height:5px;border-radius:3px;background:#fff;transform:translateX(-50%)}
/* Play/pause and sound, in the hero controls' glass, darker so white icons hold over bright frames. */
.tbe-reel-controls{position:absolute;right:14px;bottom:38px;z-index:2;display:flex;gap:6px;padding:6px;border:1px solid #ffffff4d;border-radius:60px;background:#05283bb3;backdrop-filter:blur(12px);color:#fff}
.tbe-reel-controls[hidden]{display:none}
.tbe-reel-button{display:grid;place-items:center;width:39px;height:39px;padding:0;border:1px solid #ffffff5c;border-radius:50%;background:transparent;color:inherit;cursor:pointer;transition:background .2s}
.tbe-reel-button:hover{background:#ffffff26}
.tbe-reel-button:focus-visible{outline:3px solid #fff;outline-offset:2px}
.tbe-reel-button svg{width:18px;height:18px;fill:currentColor}
.tbe-reel-controls[data-playing] .tbe-reel-play,.tbe-reel-controls:not([data-playing]) .tbe-reel-pause,.tbe-reel-controls[data-sound] .tbe-reel-muted,.tbe-reel-controls:not([data-sound]) .tbe-reel-sound{display:none}
/* Without JavaScript the browser's own controls show and take the bottom edge. */
.tbe-phone-screen:has(video[controls]) .tbe-phone-home{display:none}
.instagram-section :where(.tbe-instagram-follow .elementor-button-content-wrapper){align-items:center;gap:12px}
.instagram-section :where(.tbe-instagram-follow .elementor-button-icon){display:flex;align-items:center;font-size:20px}
.tbe-instagram-empty{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px 28px;padding:28px 32px;border:1px solid var(--line);border-radius:20px;background:var(--pale);font:400 16px/1.7 var(--font);color:var(--text)}
.tbe-instagram-empty p{margin:0;color:inherit}
.tbe-instagram-empty a{display:inline-flex;align-items:center;gap:12px;color:var(--blue);font-weight:500;text-decoration:underline;text-underline-offset:4px}
.tbe-instagram-empty .icon{width:18px;height:18px}
.tbe-instagram-setup{margin-top:16px;font:400 14px/1.7 var(--font);color:var(--text)}
.tbe-instagram-setup a{color:var(--blue);text-decoration:underline}
/* Retain the connector's image loading, links and error/cache behavior. */
.tbe-instagram-feed #sb_instagram{width:100%;padding:0!important}
.instagram-section .tbe-instagram-feed #sb_instagram #sbi_images{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;padding:0!important;float:none}
.tbe-instagram-feed #sb_instagram #sbi_images .sbi_item{width:100%!important;min-width:0;padding:0!important;float:none!important}
.tbe-instagram-feed #sb_instagram .sbi_photo_wrap{overflow:clip;border-radius:20px;background:var(--pale)}
.tbe-instagram-feed #sb_instagram .sbi_photo{position:relative;overflow:clip;aspect-ratio:1;height:auto!important;transition:opacity .2s}
.tbe-instagram-feed #sb_instagram .sbi_photo img{position:absolute;inset:0;width:100%!important;height:100%!important;object-fit:cover!important}
.tbe-instagram-feed #sb_instagram .sbi_photo:focus-visible{outline:3px solid var(--blue);outline-offset:-5px;opacity:1!important}
@media(max-width:760px){
 .instagram-section.e-con{padding-block:64px}
 .instagram-section{background:linear-gradient(0deg,rgba(6,47,71,.97),rgba(9,66,96,.92) 60%,rgba(9,66,96,.9)),url('/wp-content/themes/tangerbay-elegance/assets/clinic/team.webp') center 30%/cover no-repeat,#082f47}
 .instagram-section .tbe-instagram-inner,.instagram-section .tbe-instagram-inner.e-con{grid-template-columns:minmax(0,1fr);gap:40px}
 .instagram-section .tbe-instagram-heading{gap:24px}
 .tbe-instagram-phone{border-radius:50px}
 .tbe-phone-body{padding:8px;border-radius:47px}
 .tbe-phone-screen{border-radius:39px}
 .tbe-phone-status{height:42px;padding:2px 24px 0 28px;font-size:13px}
 .tbe-phone-island{top:9px;height:24px;width:32%}
 .tbe-phone-icons svg{height:9px}
 .tbe-phone-icons svg:last-child{height:10px}
 .tbe-instagram-phone::before{top:120px;height:44px;box-shadow:0 58px 0 #2a333c}
 .tbe-instagram-phone::after{top:150px;height:72px}
 .tbe-reel-controls{right:12px;bottom:34px;gap:5px;padding:5px}
 .tbe-reel-button{width:35px;height:35px}
 .instagram-section :where(.tbe-instagram-intro),.instagram-section .tbe-instagram-intro.elementor-widget-text-editor{font-size:16px;margin-top:16px}
 .tbe-instagram-empty{padding:24px;gap:12px;font-size:15px}
 .instagram-section .tbe-instagram-feed #sb_instagram #sbi_images{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .tbe-instagram-feed #sb_instagram .sbi_photo_wrap{border-radius:14px}
}
@media(prefers-reduced-motion:reduce){.tbe-instagram-feed #sb_instagram .sbi_photo,.tbe-reel-button{transition:none}}
