/* =========================================================
   MO Studios (mondoolfi.com) - shared stylesheet
   One file for the whole site, replacing normalize.css, bootstrap.min.css,
   change-text.css, default.css, meanmenu.css, style.css, responsive.css,
   custom.css and flaticon.css. Same colours, spacing, grid and breakpoints as
   the original site; type matches fotonic.co.uk (SF Pro on Apple, Inter elsewhere).

   Contents
     1.  Design tokens
     2.  Base
     3.  Grid & utilities (Bootstrap 3 subset: 768 / 992 / 1200)
     4.  Buttons & form fields
     5.  Preloader
     6.  Header & desktop menu
     7.  Mobile menu
     8.  Hero
     8b. Hero slider
     9.  Content sections (headings, about, images, pager)
     10. Services
     11. Portfolio grid
     11b. Free test shoot
     11c. Image carousel
     11d. Prices page
     12. Blog cards
     13. Contact
     14. Footer & scroll-to-top
     14b. Image lightbox
     15. Icon font
     15b. Mobile sticky quote / call bar
     16. Responsive
   ========================================================= */

/* ---------- 1. Design tokens ---------- */
:root{
  --ink:#222;            /* body text, outlines, sticky header text */
  --charcoal:#454545;    /* heading highlight, button fill, footer tiles */
  --dark:#333;           /* preloader, scroll-to-top */
  --white:#fff;
  --line:#ddd;
  --line-light:#eee;
  --grey-bg:#f9f9f9;
  --link:#337ab7;
  --link-hover:#23527c;
  --mobile-nav:#0c1923;
  --ok:#1ba261;
  --err:#f00;
  /* Type: same as fotonic.co.uk - SF Pro on Apple devices, Inter everywhere else */
  --sans:-apple-system,BlinkMacSystemFont,'SF Pro Text','Inter','Helvetica Neue',Helvetica,Arial,sans-serif;
  --display:-apple-system,BlinkMacSystemFont,'SF Pro Display','Inter','Helvetica Neue',Helvetica,Arial,sans-serif;
  --body-font:var(--sans);
  --heading-font:var(--display);
  --link-font:var(--sans);
  --input-font:var(--sans);
  --ease:.3s;
}

/* ---------- 2. Base ---------- */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;scroll-padding-top:80px;font-size:10px;-webkit-text-size-adjust:100%;text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0);}
body{margin:0;font-family:var(--body-font);font-size:14px;font-weight:300;line-height:1.8;color:var(--ink);background-color:var(--white);overflow-x:hidden!important;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
h1,h2,h3,h4,h5,h6{font-family:var(--heading-font);font-weight:400;line-height:1.1;color:inherit;margin:0 0 15px;}
h1{font-size:36px;}
h2{font-size:30px;}
h3{font-size:24px;}
h4{font-size:18px;}
h5{font-size:14px;}
h6{font-size:12px;}
p{margin:0 0 10px;font-size:15px;}
a{color:var(--link);background-color:transparent;text-decoration:none;font-family:var(--link-font);font-weight:400;transition:var(--ease);}
a:hover,a:focus{color:var(--link-hover);text-decoration:none;outline:none;}
b{font-weight:inherit;}
strong{font-weight:bold;}
img{border:0;vertical-align:middle;max-width:100%;height:auto;}
ol{margin-top:0;margin-bottom:10px;}
ul{list-style:none;margin:0;padding:0;}
ol ol,ol ul,ul ol,ul ul{margin-bottom:0;}
button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0;font-family:inherit;font-size:inherit;line-height:inherit;}
button{overflow:visible;text-transform:none;cursor:pointer;}
textarea{overflow:auto;}

/* ---------- 3. Grid & utilities ---------- */
.container,.container-fluid{padding-right:15px;padding-left:15px;margin-right:auto;margin-left:auto;}
.row{margin-right:-15px;margin-left:-15px;}
.container::before,.container::after,.container-fluid::before,.container-fluid::after,.row::before,.row::after,
.nav::before,.nav::after,.pager::before,.pager::after{content:" ";display:table;}
.container::after,.container-fluid::after,.row::after,.nav::after,.pager::after{clear:both;}
[class*="col-"]{position:relative;min-height:1px;padding-right:15px;padding-left:15px;}
.col-xs-12{float:left;width:100%;}
@media (min-width:768px){
  .container{width:750px;}
  .col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-9{float:left;}
  .col-sm-2{width:16.66666667%;}
  .col-sm-3{width:25%;}
  .col-sm-4{width:33.33333333%;}
  .col-sm-5{width:41.66666667%;}
  .col-sm-6{width:50%;}
  .col-sm-7{width:58.33333333%;}
  .col-sm-9{width:75%;}
}
@media (min-width:992px){
  .container{width:970px;}
  .col-md-3,.col-md-4,.col-md-6,.col-md-8,.col-md-12{float:left;}
  .col-md-3{width:25%;}
  .col-md-4{width:33.33333333%;}
  .col-md-6{width:50%;}
  .col-md-8{width:66.66666667%;}
  .col-md-12{width:100%;}
}
@media (min-width:1200px){
  .container{width:1170px;}
  .col-lg-10{float:left;width:83.33333333%;}
  .col-lg-offset-1{margin-left:8.33333333%;}
}
@media (min-width:768px) and (max-width:991px){.hidden-sm{display:none!important;}}
@media (min-width:992px) and (max-width:1199px){.hidden-md{display:none!important;}}
@media (min-width:1200px){.hidden-lg{display:none!important;}}
.visually-hidden{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}
.text-right{text-align:right;}
.text-center{text-align:center;}
.pull-right{float:right!important;}
.bg-grey{background-color:var(--grey-bg);}
.nav{padding-left:0;margin-bottom:0;list-style:none;}
.nav>li{position:relative;display:block;}
.nav>li>a{position:relative;display:block;padding:10px 15px;}
.nav>li>a:hover,.nav>li>a:focus{text-decoration:none;background-color:transparent;}

/* ---------- 4. Buttons & form fields ---------- */
.bordered-btn,.filled-btn,button[type="submit"],input[type="submit"]{border:1px solid var(--ink);color:var(--ink);display:inline-block;letter-spacing:3px;padding:10px 20px;position:relative;text-transform:uppercase;z-index:1;}
.bordered-btn:hover,.filled-btn,button[type="submit"]:hover,input[type="submit"]:hover{color:var(--white);}
.bordered-btn::after,.filled-btn::after,button[type="submit"]::after,input[type="submit"]::after{background-color:var(--charcoal);content:"";height:100%;left:0;position:absolute;top:0;transform:scaleX(0);transform-origin:0 0;transition:var(--ease);width:100%;z-index:-1;}
.bordered-btn:hover::after,.filled-btn::after,button[type="submit"]:hover::after,input[type="submit"]:hover::after{transform:scaleX(1);}
.filled-btn:hover::after{transform:scaleX(0);}
.filled-btn:hover{color:var(--ink);}
button[type="submit"],input[type="submit"]{background-color:transparent;transition:var(--ease);}
input[type="text"],input[type="email"],input[type="tel"],input[type="password"],textarea{border:1px solid var(--line);font-family:var(--input-font);height:50px;letter-spacing:1px;padding:10px 15px;text-transform:capitalize;transition:var(--ease);width:100%;background-color:transparent;}
textarea{height:130px;resize:none;}
input[type="text"]:focus,input[type="email"]:focus,input[type="tel"]:focus,input[type="password"]:focus,textarea:focus{border-color:var(--line);box-shadow:0 0 8px var(--line);outline:none;}

/* ---------- 5. Preloader ---------- */
#preloader{position:fixed;inset:0;z-index:99999999;transition:opacity .6s ease;}
#preloader.is-hidden{opacity:0;pointer-events:none;}
.main-wrap{background-color:var(--dark);color:var(--white);height:100vh;display:flex;justify-content:center;align-items:center;}
.ball-scale-multiple{position:relative;transform:translateY(-30px);}
.ball-scale-multiple>div{position:absolute;left:-30px;top:0;opacity:0;margin:0;width:60px;height:60px;background-color:var(--white);border-radius:100%;animation:ball-scale-multiple 1s linear 0s infinite;}
.ball-scale-multiple>div:nth-child(2){animation-delay:-.4s;}
.ball-scale-multiple>div:nth-child(3){animation-delay:-.2s;}
@keyframes ball-scale-multiple{0%{transform:scale(0);opacity:0;}5%{opacity:1;}100%{transform:scale(1);opacity:0;}}

/* ---------- 6. Header & desktop menu ---------- */
.header-area{padding:30px 0 20px;position:absolute;top:0;width:100%;z-index:9999;transition:var(--ease);}
.header-area.stick{background-color:var(--white);box-shadow:0 0 10px -5px #000;padding:15px 0 0;position:fixed;top:0;}
.logo a{color:var(--white);display:inline-block;}
.logo a h2{display:inline-block;margin:0;font-size:25px;font-weight:200;text-transform:uppercase;}
.logo a h2 span{background-color:var(--white);color:var(--ink);display:inline-block;padding:5px 10px;}
.header-area.stick .logo a{color:var(--ink);margin-top:2px;position:relative;z-index:9999999;}
.header-area.stick .logo a h2 span{background-color:var(--ink);color:var(--white);}

.mainmenu{position:relative;right:0;padding-right:0;opacity:1;visibility:visible;transform:scaleX(1);transition:var(--ease);}
.mainmenu ul li{display:inline-block;position:relative;}
.mainmenu ul li a{color:var(--white);display:block;font-size:15px;letter-spacing:2px;padding:10px 30px 20px 10px;opacity:.8;position:relative;text-transform:uppercase;}
.mainmenu ul li:hover a,.mainmenu ul li.active>a{opacity:1;}
/* drop-down */
.mainmenu ul ul{border:1px solid var(--line-light);width:220px;position:absolute;text-align:left;background-color:var(--white);top:calc(100% + 30px);left:0;z-index:9999999;transition:var(--ease);opacity:0;visibility:hidden;transform-origin:0 0;}
.mainmenu ul li:hover>ul{opacity:1;visibility:visible;top:100%;}
.mainmenu ul ul li{display:block;}
.mainmenu ul ul li a{color:var(--ink);text-transform:capitalize;letter-spacing:1px;padding:8px 10px 8px 20px;border-bottom:1px solid var(--line-light);}
.mainmenu ul ul li:last-child>a{border-bottom:0;}
.mainmenu ul ul li:hover>a{background-color:var(--line-light);padding-left:23px;}
.mainmenu ul ul li a::after{content:"";}
.mainmenu ul ul li.active>a{background-color:var(--line-light);font-weight:600;}
/* "+" marker on items with a drop-down */
.mainmenu ul li.parent::after,.mainmenu ul li.parent::before{content:"";width:11px;height:1px;background-color:var(--white);top:24px;position:absolute;right:15px;transition:var(--ease);}
.mainmenu ul li.parent::before{width:1px;height:11px;right:20px;top:19px;}
.mainmenu ul li.parent:hover::before{height:0;}
.header-area.stick .mainmenu ul li a{color:var(--ink);}
.stick .mainmenu ul li.parent::after,.stick .mainmenu ul li.parent::before{background-color:var(--ink);}

/* ---------- 7. Mobile menu (below 768px) ---------- */
.mean-container .mean-bar{float:left;width:100%;position:absolute;background:transparent;padding:4px 0;min-height:42px;top:-44px;z-index:999999;right:0;}
.mean-container .mean-bar,.mean-container .mean-bar *{box-sizing:content-box;}
.mean-container a.meanmenu-reveal{width:30px;height:30px;padding:9px 13px 11px;position:absolute;top:0;right:0;left:auto;cursor:pointer;color:var(--white);text-decoration:none;text-indent:-9999em;line-height:22px;font-size:1px;display:block;font-family:var(--sans);font-weight:700;}
.mean-container a.meanmenu-reveal span{display:block;background:var(--white);height:2px;margin-top:5px;}
.mean-container a.meanmenu-reveal.meanclose{text-align:center;text-indent:0;font-size:18px;}
.stick .mean-container a.meanmenu-reveal{color:var(--ink);}
.stick .mean-container a.meanmenu-reveal span{background-color:var(--ink);}
.mean-container .mean-nav{float:left;width:100%;background:var(--mobile-nav);margin-top:44px;max-height:400px;overflow-y:auto;border-left:1px solid var(--line);border-right:1px solid var(--line);}
.mean-container .mean-nav ul{padding:0;margin:0;width:100%;list-style-type:none;display:none;}
.mean-container .mean-nav ul.is-open{display:block;}
.mean-container .mean-nav ul li{position:relative;float:left;width:100%;}
.mean-container .mean-nav ul li a{display:block;float:left;width:90%;padding:5px 5%;margin:0;text-align:left;color:var(--ink);border-top:1px solid #dfdfdf;text-decoration:none;text-transform:uppercase;background-color:var(--white);}
.mean-container .mean-nav ul li li a{width:80%;padding:5px 10%;border-top:1px solid #f1f1f1;opacity:.95;visibility:visible;text-transform:capitalize;text-shadow:none!important;}
.mean-container .mean-nav ul li.mean-last a{border-bottom:none;margin-bottom:0;}
.mean-container .mean-nav ul li a:hover{background:var(--line);}
.mean-container .mean-nav ul li a.mean-expand{margin-top:0;width:26px;height:32px;text-align:center;position:absolute;right:0;top:0;z-index:2;font-size:18px;font-weight:700;background:rgba(255,255,255,.1);padding:2px 12px!important;border:none!important;border-left:1px solid var(--line)!important;}
.mean-container .mean-nav ul li a.mean-expand:hover{background:var(--line-light);}
.mean-container .mean-push{float:left;width:100%;padding:0;margin:0;clear:both;}

/* ---------- 8. Hero (fixed behind the page, content scrolls over it) ---------- */
.hero-wrapper{position:fixed;width:100%;top:0;}
.content-wrapper{position:relative;z-index:999;margin-top:100vh;background-color:var(--white);}
.hero-area{background-color:var(--line);background-position:center center;background-size:cover;height:100vh;position:relative;z-index:1;}
.hero-area::after{background-color:#000;content:"";height:100%;left:0;opacity:.3;position:absolute;top:0;width:100%;z-index:-1;}
/* pages without a hero: the header starts in its white "stuck" state and the content clears it */
.no-hero .content-wrapper{margin-top:0;padding-top:72px;}
/* one hero image per page */
.hero-bg-5{background-image:url("assets/img/hero-area/jewellery-photography-studio.webp");}
.hero-bg-10{background-image:url("assets/img/hero-area/watch-rotation.gif");}
.hero-bg-8{background-image:url("assets/img/hero-area/model-photography.webp");}
.hero-bg-4{background-image:url("assets/img/hero-area/pink-background-liquid-splash.webp");}
.hero-bg-6{background-image:url("assets/img/hero-area/jewelley-photography.webp");}
.hero-bg-7{background-image:url("assets/img/hero-area/watch-photography.webp");}
.hero-bg-1{background-image:url("assets/img/hero-area/product-photography.webp");}
.hero-bg-2{background-image:url("assets/img/hero-area/creative-jewellery-photography.webp");}
.hero-bg-3{background-image:url("assets/img/hero-area/jewellery-photography.webp");}
.single-hero-item{height:100vh;color:var(--white);}
.display-table{display:table;height:100%;width:100%;}
.display-table-cell{display:table-cell;vertical-align:middle;}
.single-hero-item h1,.single-hero-item h2,.single-hero-item h3{font-weight:600;}
.single-hero-item h1{font-size:60px;letter-spacing:15px;margin-bottom:25px;text-transform:uppercase;}
.single-hero-item h2{font-size:36px;font-weight:400;letter-spacing:3px;text-transform:capitalize;}
.single-hero-item h2 span.cd-words-wrapper{text-transform:uppercase;}
.single-hero-item .bordered-btn{border-color:var(--white);color:var(--white);font-size:16px;padding:15px 40px;margin-top:30px;}
.single-hero-item .bordered-btn:hover{color:var(--ink);}
.single-hero-item .bordered-btn::after{background-color:#f5f5f5;}
/* typing headline */
.cd-words-wrapper{display:inline-block;position:relative;text-align:left;}
.cd-words-wrapper b{display:inline-block;position:absolute;white-space:nowrap;left:0;top:0;}
.cd-words-wrapper b.is-visible{position:relative;}
.no-js .cd-words-wrapper b{opacity:0;}
.no-js .cd-words-wrapper b.is-visible{opacity:1;}
.cd-headline.type .cd-words-wrapper{vertical-align:top;overflow:hidden;}
.cd-headline.type .cd-words-wrapper::after{content:"";position:absolute;right:0;top:50%;bottom:auto;transform:translateY(-50%);height:90%;width:1px;background-color:var(--white);}
.cd-headline.type .cd-words-wrapper.waiting::after{animation:cd-pulse 1s infinite;}
.cd-headline.type .cd-words-wrapper.selected{background-color:var(--white);}
.cd-headline.type .cd-words-wrapper.selected::after{visibility:hidden;}
.cd-headline.type .cd-words-wrapper.selected b{color:#0d0d0d;}
.cd-headline.type b{visibility:hidden;}
.cd-headline.type b.is-visible{visibility:visible;}
.cd-headline.type i{position:absolute;visibility:hidden;font-style:normal;}
.cd-headline.type i.in{position:relative;visibility:visible;}
/* clip headline (word wipes away and the next one is revealed) */
.cd-headline.clip span{display:inline-block;padding:.2em 0;}
.cd-headline.clip .cd-words-wrapper{overflow:hidden;vertical-align:top;transition:width .6s ease;}
.cd-headline.clip .cd-words-wrapper::after{content:"";position:absolute;top:0;right:0;width:2px;height:100%;background-color:var(--white);}
.cd-headline.clip b{opacity:0;}
.cd-headline.clip b.is-visible{opacity:1;}

/* ---------- 8b. Hero slider (creative-product-photography.html), replaces Owl Carousel ----------
   Full-screen slides that scroll with the page; arrows and dash-style dots appear on hover. */
.slider-area{position:relative;overflow:hidden;}
.slider-area+.content-wrapper{margin-top:0;}
.hero-slides{display:flex;transition:transform .25s ease;}
.hero-slides.no-anim{transition:none;}
.hero-slides>*{flex:0 0 100%;}
.slider-area .single-hero-item{background-color:var(--line);background-position:center center;background-size:cover;height:100vh;position:relative;z-index:1;}
.slider-area .single-hero-item::after{background-color:#000;content:"";height:100%;left:0;opacity:.3;position:absolute;top:0;width:100%;z-index:-1;}
.hero-slider-nav{position:absolute;top:50%;left:30px;z-index:2;width:60px;height:60px;margin-top:-30px;padding:0;border:0;background-color:var(--white);color:var(--dark);font-size:24px;line-height:60px;text-align:center;opacity:0;visibility:hidden;transition:var(--ease);}
.hero-slider-next{left:auto;right:30px;}
.slider-area:hover .hero-slider-nav,.hero-slider-nav:focus-visible{left:0;opacity:1;visibility:visible;}
.slider-area:hover .hero-slider-next,.hero-slider-next:focus-visible{left:auto;right:0;}
.hero-slider-dots{position:absolute;left:0;right:0;bottom:-1px;z-index:2;text-align:center;opacity:0;transition:var(--ease);}
.slider-area:hover .hero-slider-dots{opacity:1;bottom:14px;}
.hero-slider-dots button{display:inline-block;margin:0 5px;padding:6px 0;border:0;background:none;cursor:pointer;vertical-align:middle;}
.hero-slider-dots button span{display:block;width:30px;height:3px;background-color:var(--white);opacity:.6;transition:var(--ease);}
.hero-slider-dots button.active span{width:50px;opacity:1;}
@media (min-width:768px) and (max-width:1200px){.slider-area .single-hero-item .col-md-12{padding-left:60px;}}
@media (max-width:767px){
  /* long two-line slider titles: smaller so "Jewellery Photography" fits a phone screen */
  .slider-area .single-hero-item h2{font-size:18px;letter-spacing:1px;}
  .hero-slider-nav{width:45px;height:45px;top:100%;margin-top:-45px;font-size:18px;line-height:45px;z-index:9;}
}
@media (hover:none){
  .hero-slider-nav{left:0;opacity:1;visibility:visible;}
  .hero-slider-next{left:auto;right:0;}
  .hero-slider-dots{opacity:1;bottom:14px;}
}

@keyframes cd-pulse{0%{transform:translateY(-50%) scale(1);opacity:1;}40%{transform:translateY(-50%) scale(.9);opacity:0;}100%{transform:translateY(-50%) scale(0);opacity:0;}}

/* ---------- 9. Content sections ---------- */
.section-padding{padding:100px 0;}
.section-heading{margin-bottom:70px;}
.section-heading h1,.section-heading h2{letter-spacing:3px;text-transform:uppercase;}
.section-heading h1{font-size:30px;}
.section-heading h1 span,.section-heading h2 span{background-color:var(--charcoal);color:var(--white);display:inline-block;padding:5px 10px;}
.section-heading-small{margin-bottom:30px;}
.heading-small{font-size:1.5rem;font-weight:600;}
.details-content{margin-bottom:30px;}
.details-content h2{text-transform:uppercase;margin-top:30px;}
.portfolio-multiple-img .item-img{margin-bottom:30px;}
.pager{padding-left:0;margin:40px 0 0;text-align:center;list-style:none;}
.pager li{display:inline;}
.pager li>a{display:inline-block;padding:5px 14px;background-color:var(--white);border:1px solid var(--ink);border-radius:0;}
.pager li>a:hover,.pager li>a:focus{text-decoration:none;background-color:var(--white);}
.pager .previous>a{float:left;}

/* page banner (pages without a full-screen hero, e.g. product-videos.html) */
.breadcrumb-area2{background-image:url("assets/img/breadcrumb/breadcrumb-bg2.webp");background-color:var(--line);background-position:center center;background-size:cover;color:var(--white);padding-top:190px;padding-bottom:100px;position:relative;z-index:1;}
/* responsive 16:9 video embed */
.embed-responsive{position:relative;display:block;height:0;padding:0;overflow:hidden;}
.embed-responsive-16by9{padding-bottom:56.25%;}
.embed-responsive .embed-responsive-item,.embed-responsive iframe{position:absolute;top:0;bottom:0;left:0;width:100%;height:100%;border:0;}

/* ---------- 10. Services ---------- */
.service-style-1{border-left:1px solid var(--line-light);border-top:1px solid var(--line-light);}
.service-style-1 .row{margin:0;}
.service-style-1 .col-md-4{padding:0;}
.single-service-item{height:310px;padding:20px 20px 0;transition:var(--ease);}
.single-service-item p:last-child{margin-bottom:0;}
.service-style-1 .single-service-item{border-bottom:1px solid var(--line-light);border-right:1px solid var(--line-light);}
.service-style-1 .single-service-item:hover{box-shadow:0 20px 50px var(--line);}

/* ---------- 11. Portfolio grid ---------- */
.single-project-item{background-color:var(--line);background-position:center center;background-size:cover;display:table;height:300px;margin-bottom:30px;position:relative;text-align:center;overflow:hidden;width:100%;z-index:1;}
.project-bg-1{background-image:url("assets/img/portfolio/0001.webp");}
.project-bg-2{background-image:url("assets/img/portfolio/0002.webp");}
.project-bg-3{background-image:url("assets/img/portfolio/0003.webp");}
.project-bg-4{background-image:url("assets/img/portfolio/0004.webp");}
.project-bg-5{background-image:url("assets/img/portfolio/0005.webp");}
.project-bg-6{background-image:url("assets/img/portfolio/0006.webp");}
.project-bg-7{background-image:url("assets/img/portfolio/0007.webp");}
.project-bg-8{background-image:url("assets/img/portfolio/0008.webp");}
.project-bg-9{background-image:url("assets/img/portfolio/0009.webp");}
.project-bg-10{background-image:url("assets/img/portfolio/00010.webp");}
.project-bg-11{background-image:url("assets/img/portfolio/00011.webp");}
.project-bg-12{background-image:url("assets/img/portfolio/00012.webp");}
.project-bg-13{background-image:url("assets/img/portfolio/00013.webp");}
.project-bg-14{background-image:url("assets/img/portfolio/00014.webp");}
.project-bg-15{background-image:url("assets/img/portfolio/00015.webp");}
.project-bg-16{background-image:url("assets/img/portfolio/00016.webp");}
/* portfolio page: taller tiles, hover overlay with an expand button, masonry layout */
.single-project-item.large{height:400px;}
.project-hover{display:table-cell;vertical-align:middle;position:relative;z-index:1;color:var(--white);opacity:0;visibility:hidden;transform:translateY(30px);transition:.4s .1s;}
.project-hover::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;background-color:var(--ink);opacity:0;visibility:hidden;transform:scaleX(.5);transition:var(--ease);}
.single-project-item:hover .project-hover,.single-project-item:focus-within .project-hover{opacity:1;visibility:visible;transform:translateY(0);}
.single-project-item:hover .project-hover::after,.single-project-item:focus-within .project-hover::after{opacity:.7;visibility:visible;transform:scaleX(1);}
.project-hover .project-buttons a{display:inline-block;width:45px;height:45px;margin:0 3px;background-color:var(--white);color:var(--ink);font-size:16px;line-height:45px;}
.project-hover .project-buttons a:hover{border-radius:50%;}
.project-lists.is-masonry{position:relative;}
.project-lists.is-masonry>*{position:absolute;}
@media (min-width:992px) and (max-width:1200px){
  .single-project-item.large{height:330px;}
  .project-hover .project-buttons a{width:40px;height:40px;font-size:14px;line-height:40px;}
}
@media (max-width:767px){.single-project-item.large{height:310px!important;}}
@media only screen and (min-width:480px) and (max-width:767px){.single-project-item.large{height:450px!important;}}
/* jewellery-photography.html gallery */
.project-bg-port-25-3{background-image:url("assets/img/portfolio/port-25-3.webp");}
.project-bg-port-25-4{background-image:url("assets/img/portfolio/port-25-4.webp");}
.project-bg-port-25-5{background-image:url("assets/img/portfolio/port-25-5.webp");}
.project-bg-port-25-8{background-image:url("assets/img/portfolio/port-25-8.webp");}
.project-bg-port-25-9{background-image:url("assets/img/portfolio/port-25-9.webp");}
.project-bg-port-25-10{background-image:url("assets/img/portfolio/port-25-10.webp");}
.project-bg-port-25-12{background-image:url("assets/img/portfolio/port-25-12.webp");}
.project-bg-port-25-15{background-image:url("assets/img/portfolio/port-25-15.webp");}
.project-bg-port-25-16{background-image:url("assets/img/portfolio/port-25-16.webp");}
.see-all-btn{margin-top:40px;}

/* ---------- 11b. Free test shoot: 3 steps joined by a dashed line ---------- */
.test-shoot{background-color:var(--white);}
.test-shoot .section-heading{margin-bottom:60px;}
.test-lead{max-width:560px;margin:20px auto 0;color:#666;}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:30px;position:relative;}
.steps::before{content:"";position:absolute;top:30px;left:16.66%;right:16.66%;height:1px;background:repeating-linear-gradient(90deg,#bbb 0 8px,transparent 8px 16px);}
.step{position:relative;text-align:center;padding:0 10px;}
.step-num{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:60px;height:60px;margin:0 auto 22px;background-color:var(--charcoal);color:var(--white);font-family:var(--display);font-size:22px;font-weight:400;box-shadow:0 0 0 10px var(--white);}
.step .heading-small{font-size:18px;margin-bottom:10px;color:var(--ink);}
.step p{color:#666;margin:0;}
.test-note{max-width:760px;margin:50px auto 0;background-color:var(--grey-bg);border:1px solid var(--line-light);border-left:3px solid var(--charcoal);padding:18px 22px;}
.test-note p{margin:0;font-size:14px;color:#666;}
.test-note strong{color:var(--ink);font-weight:600;}
.test-cta{margin-top:40px;}
@media (max-width:767px){
  .test-shoot .section-heading{margin-bottom:40px;}
  .steps{grid-template-columns:1fr;gap:30px;}
  .steps::before{display:none;}
  .step:not(:last-child)::before{content:"";position:absolute;left:30px;top:70px;bottom:-20px;width:1px;background:repeating-linear-gradient(180deg,#bbb 0 8px,transparent 8px 16px);}
  .step{display:grid;grid-template-columns:60px 1fr;gap:0 20px;text-align:left;padding:0;}
  .step-num{margin:0;grid-row:1/3;}
  .step .heading-small{margin:8px 0 6px;}
  .test-note{margin-top:35px;}
  .test-cta{margin-top:30px;}
}

/* ---------- 11c. Image carousel (product-photography.html), replaces Owl Carousel ----------
   3 images from 1024px, 2 from 768px, 1 below; neighbours peek out either side under a white veil;
   arrows slide in when the section is hovered (always shown on touch screens). */
.related-slider{box-shadow:0 0 25px -10px var(--line);overflow:hidden;}
.related-items{position:relative;z-index:1;}
.carousel-viewport{position:relative;}
.carousel-viewport::before,.carousel-viewport::after{content:"";position:absolute;top:0;width:500%;height:100%;background-color:var(--white);opacity:.6;z-index:99;pointer-events:none;}
.carousel-viewport::after{left:calc(-500% - 5px);}
.carousel-viewport::before{right:calc(-500% - 5px);}
.carousel-track{display:flex;gap:5px;transition:transform .25s ease;will-change:transform;}
.carousel-track.no-anim{transition:none;}
.carousel-track>*{flex:0 0 calc((100% - 10px)/3);}
.single-related-item{display:block;position:relative;z-index:2;}
.single-related-item img{display:block;width:100%;}
.single-related-item::after{position:absolute;width:100%;height:100%;content:"";background-color:var(--ink);top:0;left:0;z-index:0;opacity:0;transition:var(--ease);}
.single-related-item:hover::after{opacity:.5;}
.single-related-item .project-title{position:absolute;bottom:0;left:0;z-index:1;text-transform:uppercase;color:var(--white);font-size:18px;font-family:var(--heading-font);opacity:0;transition:var(--ease);}
.single-related-item:hover .project-title{left:30px;bottom:30px;opacity:1;}
.carousel-nav{position:absolute;top:50%;z-index:100;width:60px;height:60px;margin-top:-30px;padding:0;border:0;background-color:var(--ink);color:var(--white);font-size:18px;line-height:60px;text-align:center;opacity:0;transition:var(--ease);}
.carousel-prev{left:-85px;}
.carousel-next{right:-85px;}
.related-slider:hover .carousel-prev{left:-65px;opacity:1;}
.related-slider:hover .carousel-next{right:-65px;opacity:1;}
.carousel-nav:focus-visible{opacity:1;outline:2px solid var(--white);outline-offset:-4px;}
@media (max-width:1023px){.carousel-track>*{flex-basis:calc((100% - 5px)/2);}}
@media (max-width:767px){
  .carousel-track>*{flex-basis:100%;}
  .single-related-item .project-title{font-size:16px;}
  .carousel-nav{width:40px;height:40px;line-height:40px;margin-top:-20px;font-size:16px;}
  .related-slider:hover .carousel-prev{left:-45px;}
  .related-slider:hover .carousel-next{right:-45px;}
}
@media (hover:none){
  .carousel-prev{left:-65px;opacity:1;}
  .carousel-next{right:-65px;opacity:1;}
}
@media (hover:none) and (max-width:767px){
  .carousel-prev{left:-45px;}
  .carousel-next{right:-45px;}
}

/* ---------- 11d. Prices page (jewellery-photography-prices.html) in the mondoolfi style ---------- */
.price-intro{display:flex;flex-wrap:wrap;align-items:center;}
.price-lead{font-size:17px;line-height:1.7;margin-bottom:25px;}
.quick-answer{margin:0 0 30px;max-width:none;}
.price-facts{display:flex;border:1px solid var(--line-light);}
.price-facts li{flex:1;padding:18px 15px;text-align:center;border-left:1px solid var(--line-light);font-size:13px;letter-spacing:1px;text-transform:uppercase;color:#666;}
.price-facts li:first-child{border-left:0;}
.price-facts strong{display:block;font-family:var(--heading-font);font-size:24px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--ink);margin-bottom:4px;}
.price-media{position:relative;}
.price-media img{display:block;width:100%;}
.price-badge{position:absolute;left:-15px;bottom:30px;background-color:var(--charcoal);color:var(--white);padding:16px 22px;font-size:12px;line-height:1.4;letter-spacing:1px;text-transform:uppercase;}
.price-badge strong{display:block;font-family:var(--heading-font);font-size:38px;font-weight:400;letter-spacing:0;line-height:1;margin-bottom:6px;}
.tier-row{display:flex;flex-wrap:wrap;}
.tier-row>[class*="col-"]{display:flex;}
.tier-card{display:flex;flex-direction:column;width:100%;background-color:var(--white);border:1px solid var(--line-light);padding:35px 30px 30px;transition:var(--ease);}
.tier-card:hover{box-shadow:0 20px 50px var(--line);}
.tier-name{display:inline-block;align-self:flex-start;background-color:var(--charcoal);color:var(--white);font-family:var(--heading-font);font-size:13px;letter-spacing:2px;text-transform:uppercase;padding:5px 10px;margin-bottom:20px;}
.tier-price{font-family:var(--heading-font);font-size:40px;line-height:1.1;color:var(--ink);margin-bottom:12px;}
.tier-price span{font-size:15px;color:#666;white-space:nowrap;}
.tier-desc{color:#666;}
.tick-list{margin:10px 0 30px;flex-grow:1;}
.tick-list li{position:relative;padding:9px 0 9px 26px;border-top:1px solid var(--line-light);font-size:14px;}
.tick-list li::before{content:"";position:absolute;left:3px;top:15px;width:10px;height:5px;border-left:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);transform:rotate(-45deg);}
.tier-card .bordered-btn{align-self:flex-start;}
.pricing-note{margin:30px 0 0;color:#666;font-size:14px;}
.single-service-item.auto-height{height:auto;min-height:310px;padding-bottom:25px;}
.factor-icon{width:42px;height:42px;margin:10px auto 15px;color:var(--ink);}
.addon{width:100%;padding:28px 25px;background-color:var(--white);border:1px solid var(--line-light);}
.addon p{color:#555;}
.addon-tag{display:inline-block;margin-top:5px;background-color:var(--charcoal);color:var(--white);font-size:11px;letter-spacing:2px;text-transform:uppercase;padding:4px 10px;}
.pullquote{text-align:center;}
.pullquote blockquote{max-width:860px;margin:0 auto 15px;padding:0;border:0;font-family:var(--heading-font);font-size:28px;font-weight:300;line-height:1.4;letter-spacing:1px;color:var(--ink);}
.pullquote cite{font-style:normal;font-size:13px;letter-spacing:3px;text-transform:uppercase;color:#666;}
.badge-row{display:flex;justify-content:center;gap:40px;margin-top:10px;}
.badge-row img{height:110px;width:auto;}
.article-row{display:flex;flex-wrap:wrap;}
.article-row>[class*="col-"]{display:flex;margin-bottom:30px;}
.article-card{display:flex;flex-direction:column;width:100%;padding:28px 25px;background-color:var(--white);border:1px solid var(--line-light);color:var(--ink);transition:var(--ease);}
.article-card:hover,.article-card:focus{color:var(--ink);box-shadow:0 20px 50px var(--line);}
.article-tag{align-self:flex-start;background-color:var(--charcoal);color:var(--white);font-size:11px;letter-spacing:2px;text-transform:uppercase;padding:4px 10px;margin-bottom:18px;}
.article-card .heading-small{line-height:1.35;margin-bottom:10px;}
.article-card p{color:#555;font-size:14px;flex-grow:1;}
.read-more{font-size:13px;letter-spacing:2px;text-transform:uppercase;}
.cta-band{background-color:var(--ink);color:var(--white);}
.cta-band h2{letter-spacing:3px;text-transform:uppercase;margin-bottom:30px;}
.cta-btns{display:flex;flex-wrap:wrap;justify-content:center;gap:15px;}
.cta-band .bordered-btn{border-color:var(--white);color:var(--white);}
.cta-band .bordered-btn:hover{color:var(--ink);}
.cta-band .bordered-btn::after{background-color:#f5f5f5;}
.faq-intro{color:#666;margin-bottom:20px;}
@media (max-width:991px){
  .price-intro>[class*="col-"],.tier-row>[class*="col-"]{width:100%;}
  .price-intro>[class*="col-"]+[class*="col-"]{margin-top:40px;}
  .price-badge{left:15px;}
  .tier-row>[class*="col-"]{margin-bottom:30px;}
}
@media (max-width:767px){
  .article-row>[class*="col-"]{width:100%;}
  .price-facts{flex-direction:column;}
  .price-facts li{border-left:0;border-top:1px solid var(--line-light);}
  .price-facts li:first-child{border-top:0;}
  .pullquote blockquote{font-size:21px;}
  .tier-price{font-size:32px;}
  .badge-row img{height:80px;}
  .cta-band h2{font-size:22px;letter-spacing:1px;}
}

/* ---------- 12. Blog cards ---------- */
.blog-bg{background-color:var(--line);background-position:center center;background-size:cover;display:block;height:270px;position:relative;z-index:1;}
.blog-bg::after{background-color:var(--white);content:"";height:100%;left:0;opacity:0;position:absolute;top:0;transform:scaleX(.5);transition:var(--ease);visibility:hidden;width:100%;z-index:-1;}
.single-blog:hover .blog-bg::after{opacity:.4;transform:scaleX(1);visibility:visible;}
.blog-bg-1{background-image:url("assets/img/blog/1.webp");}
.blog-bg-2{background-image:url("assets/img/blog/2.webp");}
.blog-bg-3{background-image:url("assets/img/blog/3.webp");}
.blog-date{background-color:var(--white);bottom:20px;color:var(--ink);display:inline-block;font-weight:400;padding:10px 20px 8px;position:absolute;right:20px;text-align:center;transition:var(--ease);}
.single-blog:hover .blog-date{background-color:var(--ink);color:var(--white);}
.blog-date span{line-height:24px;}
.blog-date span:first-child{font-size:30px;}
.blog-date span:last-child{display:block;text-transform:uppercase;}
.blog-content{border:1px solid var(--line-light);border-top:none;padding:20px;}
.blog-content h4{margin-bottom:5px;}
.blog-content h4 a{color:var(--ink);font-family:var(--heading-font);position:relative;}
.blog-content h4 a::after{background-color:var(--ink);content:"";height:1px;left:-2%;margin-top:1px;position:absolute;top:50%;transition:var(--ease);width:0;}
.single-blog:hover .blog-content h4 a::after{width:105%;}
.blog-content .info ul{border-bottom:1px solid var(--line-light);margin-bottom:15px;padding-bottom:5px;}
.blog-content .info li{display:inline-block;margin-right:20px;font-size:95%;}
.blog-content .info li:last-child{margin-right:0;}
.blog-content .info li a{color:var(--ink);font-family:var(--body-font);font-weight:300;}
.blog-content .info li a i{margin-right:5px;}
.blog-content .bordered-btn{margin-top:20px;}
.see-more-link{margin-top:30px;}

/* ---------- 13. Contact ---------- */
.find-info li{letter-spacing:1px;margin-bottom:25px;padding-bottom:20px;padding-left:45px;position:relative;}
.find-info li::after{background-color:#ccc;bottom:0;content:"";height:1px;left:0;position:absolute;width:85%;}
.find-info li:last-child{margin:0;}
.contact-form input,.contact-form textarea{margin-bottom:20px;font-family:var(--input-font);font-size:14px;font-style:normal;color:var(--dark);}
.contact-form ::placeholder{font-family:var(--input-font);font-size:14px;font-style:italic;color:#b5b5b5;letter-spacing:.3px;}
.form-messege{margin-bottom:0;}
.form-messege.success,.form-messege.error{color:var(--white);font-weight:500;margin-top:10px;padding:5px 20px;}
.form-messege.success{background-color:var(--ok);}
.form-messege.error{background-color:var(--err);}

.widget-title h4{text-transform:uppercase;}

/* links inside body text */
.inline-link{color:#3d428b;}
.tel-inline{color:inherit;font-family:inherit;font-weight:inherit;}
.find-info .tel-link{color:inherit;font-family:inherit;font-weight:inherit;}
.find-info .tel-link:hover{color:var(--charcoal);}

/* ---------- 13b. FAQ accordion (each answer opens from a "+" box) ---------- */
.faq-list{margin-top:5px;}
.faq-item{background-color:var(--white);border:1px solid var(--line-light);margin-bottom:10px;transition:var(--ease);}
.faq-item:hover{border-color:var(--line);}
.faq-item[open]{border-color:var(--line);box-shadow:0 10px 30px var(--line-light);}
.faq-item summary{position:relative;display:block;padding:15px 55px 15px 20px;cursor:pointer;list-style:none;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary:focus-visible{outline:1px solid var(--ink);outline-offset:-1px;}
.faq-item summary .heading-small{margin:0;line-height:1.4;color:var(--ink);}
/* the "+" is the same 11px cross used in the main menu; it turns into "-" when open */
.faq-plus{position:absolute;right:20px;top:50%;width:11px;height:11px;margin-top:-5px;}
.faq-plus::before,.faq-plus::after{content:"";position:absolute;background-color:var(--ink);transition:var(--ease);}
.faq-plus::before{left:0;top:5px;width:11px;height:1px;}
.faq-plus::after{left:5px;top:0;width:1px;height:11px;}
.faq-item[open] .faq-plus::after{height:0;top:5px;}
.faq-answer{padding:0 20px 15px;}
.faq-answer p{margin:0;}
.faq-item[open] .faq-answer{animation:faq-in .3s ease;}
@keyframes faq-in{from{opacity:0;transform:translateY(-6px);}to{opacity:1;transform:none;}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}.faq-item[open] .faq-answer{animation:none;}}

/* ---------- 14. Footer & scroll-to-top ---------- */
/* Dark footer in the fotonic layout: brand, site links, address + phone, then copyright + social icons */
.site-footer{position:relative;z-index:999;background-color:var(--ink);color:rgba(255,255,255,.7);padding:44px 0 26px;font-size:14px;line-height:1.6;}
.footer-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 30px;padding-bottom:24px;border-bottom:1px solid rgba(255,255,255,.14);}
.footer-brand{color:var(--white);font-family:var(--display);font-size:22px;font-weight:300;letter-spacing:0;text-transform:uppercase;white-space:nowrap;}
.footer-brand span{display:inline-block;background-color:var(--white);color:var(--ink);padding:3px 9px;margin-left:2px;}
.footer-brand:hover,.footer-brand:focus{color:var(--white);}
.footer-nav{display:flex;flex-wrap:wrap;gap:6px 22px;}
.footer-nav a{color:rgba(255,255,255,.75);font-weight:400;}
.footer-nav a:hover,.footer-nav a:focus{color:var(--white);}
.footer-contact{display:flex;flex-wrap:wrap;align-items:center;gap:6px 26px;font-style:normal;}
.footer-contact a{color:var(--white);font-weight:600;white-space:nowrap;}
.footer-contact a:hover,.footer-contact a:focus{color:rgba(255,255,255,.75);}
.footer-bottom{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;padding-top:20px;font-size:13px;}
.copyright-text{margin:0;font-size:inherit;}
.footer-social{display:flex;gap:10px;margin:0;}
.footer-social a{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid rgba(255,255,255,.25);border-radius:50%;color:rgba(255,255,255,.8);}
.footer-social a:hover,.footer-social a:focus{background-color:var(--white);border-color:var(--white);color:var(--ink);}
.footer-social svg{width:16px;height:16px;fill:currentColor;}
@media (min-width:1200px){
  .footer-row{flex-wrap:nowrap;}
  .footer-nav{flex-wrap:nowrap;gap:6px 16px;justify-content:center;font-size:13px;white-space:nowrap;}
  .footer-contact{flex-direction:column;align-items:flex-end;text-align:right;gap:2px;flex-shrink:0;}
}
@media (max-width:1199px){
  .footer-contact br{display:none;}
}
@media (max-width:991px){
  .footer-row{flex-direction:column;align-items:flex-start;}
}
@media (max-width:767px){
  .site-footer{padding:40px 0 24px;text-align:center;}
  .footer-row,.footer-bottom{flex-direction:column;align-items:center;}
  .footer-nav,.footer-contact{justify-content:center;}
  .footer-contact{flex-direction:column;}
  .footer-contact br{display:inline;}
}
.scrollToTop{background-color:var(--dark);bottom:20px;color:var(--white);font-size:20px;height:40px;line-height:40px;position:fixed;right:20px;text-align:center;width:40px;z-index:9999;
  opacity:0;visibility:hidden;transition:opacity .4s,visibility .4s;}
.scrollToTop.is-visible{opacity:1;visibility:visible;}
.scrollToTop:hover{color:var(--white);opacity:.8;}
.scrollToTop:focus{color:var(--white);}

/* ---------- 14b. Image lightbox (portfolio grid), replaces Magnific Popup; same look ---------- */
.mfp-bg{position:fixed;top:0;left:0;width:100%;height:100%;z-index:9999999;overflow:hidden;background:#0b0b0b;opacity:.8;}
.mfp-wrap{position:fixed;top:0;left:0;width:100%;height:100%;z-index:9999999;outline:none!important;}
.mfp-container{position:absolute;top:0;left:0;width:100%;height:100%;padding:0 8px;text-align:center;}
.mfp-container::before{content:"";display:inline-block;height:100%;vertical-align:middle;}
.mfp-content{position:relative;display:inline-block;vertical-align:middle;margin:0 auto;text-align:left;z-index:1045;max-width:100%;}
.mfp-figure{line-height:0;cursor:pointer;}
.mfp-figure::after{content:"";position:absolute;left:0;right:0;top:40px;bottom:40px;z-index:-1;box-shadow:0 0 8px rgba(0,0,0,.6);background:#444;}
.mfp-figure figure{margin:0;}
img.mfp-img{display:block;width:auto;max-width:100%;height:auto;margin:0 auto;padding:40px 0;line-height:0;}
.mfp-close{position:absolute;top:0;right:-6px;width:100%;height:44px;padding:0 6px 18px 10px;border:0;background:transparent;color:#fff;font:28px/44px Arial,Baskerville,monospace;text-align:right;opacity:.65;cursor:pointer;}
.mfp-close:hover,.mfp-close:focus{opacity:1;}
.mfp-bottom-bar{position:absolute;top:100%;left:0;width:100%;margin-top:-36px;cursor:auto;}
.mfp-counter{position:absolute;top:0;right:0;color:#ccc;font-size:12px;line-height:18px;white-space:nowrap;}
.mfp-arrow{position:absolute;top:50%;width:90px;height:110px;margin:-55px 0 0;padding:0;border:0;background:transparent;opacity:.65;cursor:pointer;z-index:1046;}
.mfp-arrow:hover,.mfp-arrow:focus{opacity:1;}
.mfp-arrow::before,.mfp-arrow::after{content:"";display:block;width:0;height:0;position:absolute;left:0;top:0;margin-top:35px;margin-left:35px;border:medium inset transparent;}
.mfp-arrow::after{border-top-width:13px;border-bottom-width:13px;top:8px;}
.mfp-arrow::before{border-top-width:21px;border-bottom-width:21px;opacity:.7;}
.mfp-arrow-left{left:0;}
.mfp-arrow-left::after{border-right:17px solid #fff;margin-left:31px;}
.mfp-arrow-left::before{margin-left:25px;border-right:27px solid #3f3f3f;}
.mfp-arrow-right{right:0;}
.mfp-arrow-right::after{border-left:17px solid #fff;margin-left:39px;}
.mfp-arrow-right::before{border-left:27px solid #3f3f3f;}
@media (max-width:800px){.mfp-arrow{transform:scale(.75);}.mfp-arrow-left{transform-origin:0 0;}.mfp-arrow-right{transform-origin:100% 0;}}

/* ---------- 15. Icon font (flaticon) ---------- */
@font-face{font-family:"flaticon";src:url("assets/fonts/flaticon.woff") format("woff");font-weight:normal;font-style:normal;font-display:block;}
[class^="flaticon-"]::before,[class*=" flaticon-"]::before{font-family:flaticon;font-style:normal;}
.flaticon-user::before{content:"\f104";}
.flaticon-chat::before{content:"\f110";}
.flaticon-like::before{content:"\f112";}
.flaticon-expand::before{content:"\f114";}
.flaticon-back::before{content:"\f117";}
.flaticon-next::before{content:"\f118";}
.flaticon-arrows::before{content:"\f119";}
.flaticon-mail::before{content:"\f11c";}
.flaticon-phone-call::before{content:"\f11b";}

/* ---------- 15b. Mobile sticky "Get a quote" / "Call now" bar ---------- */
.sticky-cta{display:none;}
@media (max-width:767px){
  .sticky-cta{display:flex;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:99990;background:var(--white);border-top:1px solid var(--line-light);
    box-shadow:0 -10px 28px rgba(0,0,0,.12);padding:10px 15px calc(10px + env(safe-area-inset-bottom));
    transform:translateY(110%);transition:transform .25s ease;}
  .sticky-cta.is-visible{transform:none;}
  .sticky-cta a{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 8px;font-size:13px;font-weight:500;letter-spacing:2px;text-transform:uppercase;border:1px solid var(--ink);}
  .sticky-cta a i{font-size:15px;line-height:1;}
  .sticky-cta .cta-quote{background-color:var(--charcoal);border-color:var(--charcoal);color:var(--white);}
  .sticky-cta .cta-call{background-color:var(--white);color:var(--ink);}
  .sticky-cta a:hover,.sticky-cta a:focus{opacity:.85;}
  .sticky-cta .cta-quote:hover,.sticky-cta .cta-quote:focus{color:var(--white);}
  .sticky-cta .cta-call:hover,.sticky-cta .cta-call:focus{color:var(--ink);}
  body.has-sticky-cta{padding-bottom:calc(66px + env(safe-area-inset-bottom));}
  body.cta-up .scrollToTop{bottom:calc(76px + env(safe-area-inset-bottom));}
  body.cta-up #wpcc-floating-icon{bottom:calc(78px + env(safe-area-inset-bottom) + 12px)!important;}
}

/* ---------- 16. Responsive ---------- */
@media (min-width:992px) and (max-width:1200px){
  .single-hero-item h1{font-size:48px;letter-spacing:10px;}
  .single-hero-item h2{font-size:28px;letter-spacing:2px;}
  .single-project-item{height:265px;}
  .blog-bg{height:220px;}
}
@media (min-width:768px) and (max-width:991px){
  .mainmenu ul li a{padding:10px 12px;font-size:14px;}
  .mainmenu>ul>li>a{margin-bottom:12px;}
  .mainmenu ul li.parent::after,.mainmenu ul li.parent::before{top:22px;right:0;}
  .mainmenu ul li.parent::before{right:5px;top:17px;}
  .mainmenu ul li ul li a{font-size:14px;letter-spacing:.7px;}
  .section-padding{padding:60px 0;}
  .single-hero-item h1{font-size:48px;letter-spacing:5px;}
  .single-hero-item h2{font-size:28px;letter-spacing:0;}
}
@media (max-width:767px){
  .container,.container-fluid{width:300px;}
  .mobile-menu-area .container{width:270px;}
  .xs-mt-30{margin-top:30px;}
  .header-area.stick .logo a{margin-top:0;margin-bottom:15px;}
  .stick .mean-container .mean-bar{top:-47px;}
  .js .mainmenu{display:none;}
  .single-hero-item h1{font-size:36px;letter-spacing:4px;}
  .single-hero-item h2{font-size:24px;letter-spacing:2px;}
  .single-hero-item h2 span{line-height:36px;}
  .single-hero-item .bordered-btn{font-size:12px;padding:10px 25px;margin-top:15px;}
  .section-padding{padding:50px 0;}
  .section-heading{margin-bottom:40px;}
  .section-heading h1,.section-heading h2{letter-spacing:1px;text-transform:uppercase;font-size:24px;}
  .details-content h2{font-size:24px;}
  .single-project-item{height:250px!important;}
  .single-blog{margin-bottom:30px;}
  .col-md-4:last-child .single-blog{margin-bottom:0;}
  .blog-bg{height:200px;}
  .contact-form{margin-top:30px;}
  .pager{margin-top:20px;}
  .pager>li>a{margin-top:20px;font-size:12px;letter-spacing:1px;}
  .scrollToTop{bottom:-1px;}
}
@media only screen and (min-width:480px) and (max-width:767px){
  .container,.container-fluid{width:450px;}
  .mobile-menu-area .container{width:420px;}
  .single-service-item{padding:20px 25px 0;}
  .single-project-item{height:375px!important;}
  .blog-bg{height:300px;}
}
