
/* ============================================================
   COMINO MAGAZINE V4.4 — SEA + SUN MEDITERRANEAN SYSTEM
   Coherent palette: Aegean / turquoise / seafoam / limestone /
   warm sand / sun gold / restrained coral.
   ============================================================ */
:root{
  --cm-deep:#032D49;
  --cm-navy:#073A5A;
  --cm-sea:#006F98;
  --cm-blue:#078DB5;
  --cm-aqua:#11AEB9;
  --cm-turq:#33C7BF;
  --cm-foam:#E8F7F3;
  --cm-foam2:#D8F2EE;
  --cm-sand:#F5E8CF;
  --cm-limestone:#FFF9EE;
  --cm-sun:#F6C744;
  --cm-sun2:#F2B63F;
  --cm-coral:#E98258;
  --cm-ink:#082E3F;
  --cm-white:#FFFFFF;
  --cm-shadow:0 24px 65px rgba(0,63,89,.14);
}
html{scroll-behavior:smooth}
body{
  color:var(--cm-ink)!important;
  background:
    radial-gradient(circle at 85% 4%,rgba(246,199,68,.22),transparent 21%),
    radial-gradient(circle at 4% 21%,rgba(51,199,191,.16),transparent 24%),
    linear-gradient(180deg,#fffaf0 0%,#f7fcfb 47%,#fff8eb 100%)!important;
}
body:before{
  background-image:
    linear-gradient(45deg,transparent 48%,rgba(0,111,152,.026) 49%,rgba(0,111,152,.026) 51%,transparent 52%)!important;
  background-size:54px 54px!important;
  opacity:.45!important;
}

/* Header: sea + sun only */
.announce{
  background:var(--cm-deep)!important;
  color:#DFF7F3!important;
  border:0!important;
}
.site-header{
  background:rgba(255,250,239,.97)!important;
  box-shadow:0 8px 32px rgba(0,56,78,.08)!important;
}
.site-header:after{
  height:4px!important;
  background:linear-gradient(90deg,var(--cm-sea) 0 52%,var(--cm-aqua) 52% 82%,var(--cm-sun) 82% 100%)!important;
}
.logo,.brand{color:var(--cm-deep)!important}
.nav a,.desktop-nav a{color:#163E4B!important}
.nav a:hover,.desktop-nav a:hover{color:var(--cm-sea)!important}
.nav .commercial-link{color:var(--cm-sea)!important;border-bottom-color:var(--cm-aqua)!important}

/* Make Work With Us impossible to miss */
.site-header .nav a.btn-dark,
.site-header a.btn-dark[href*="contact"],
.site-header .v4-actions a,
a[href="/contact/"].btn-dark{
  background:var(--cm-sun)!important;
  color:var(--cm-deep)!important;
  border:2px solid var(--cm-sun)!important;
  font-weight:950!important;
  text-shadow:none!important;
  box-shadow:0 10px 28px rgba(199,145,26,.20)!important;
}
.site-header .nav a.btn-dark:hover,
.site-header a.btn-dark[href*="contact"]:hover{
  background:var(--cm-deep)!important;
  color:#fff!important;
  border-color:var(--cm-deep)!important;
}

.btn-dark{
  background:linear-gradient(135deg,var(--cm-sea),var(--cm-deep))!important;
  color:#fff!important;
  border:0!important;
}
.btn-dark:hover{background:linear-gradient(135deg,var(--cm-aqua),var(--cm-sea))!important}
.btn-light{color:var(--cm-deep)!important}
.eyebrow{color:var(--cm-sea)!important}
.section-title{color:var(--cm-deep)!important}

/* Hero: deep water + golden sun */
.mediterranean-home .hero:before{
  background:radial-gradient(circle,var(--cm-sun),rgba(246,199,68,.18) 45%,transparent 70%)!important;
  opacity:.72!important;
}
.mediterranean-home .hero:after{
  background:radial-gradient(circle,var(--cm-aqua),rgba(17,174,185,.12) 54%,transparent 72%)!important;
}
.mediterranean-home .hero-panel{
  background-image:
    linear-gradient(104deg,rgba(3,37,61,.93) 0%,rgba(0,74,105,.78) 42%,rgba(3,92,119,.32) 70%,rgba(0,42,61,.16) 100%),
    url('/assets/ferdies/hero-interior.webp')!important;
  outline:6px solid rgba(255,255,255,.72)!important;
  box-shadow:0 34px 95px rgba(0,69,94,.25)!important;
}
.mediterranean-home .hero-panel:before{
  height:8px!important;
  background:linear-gradient(90deg,var(--cm-sea),var(--cm-aqua) 68%,var(--cm-sun))!important;
}
.mediterranean-home .hero-panel:after{
  border-color:rgba(246,199,68,.40)!important;
  box-shadow:0 0 0 70px rgba(51,199,191,.07),0 0 0 140px rgba(246,199,68,.04)!important;
}
.mediterranean-home .hero-left h1:after{color:var(--cm-sun)!important}
.mediterranean-home .hero-actions .btn-white:first-child{
  background:var(--cm-sun)!important;color:var(--cm-deep)!important;
  box-shadow:0 14px 35px rgba(200,145,25,.25)!important
}
.mediterranean-home .hero-card{
  background:linear-gradient(145deg,rgba(255,251,242,.98),rgba(224,248,243,.97))!important;
}
.mediterranean-home .hero-card .eyebrow{color:var(--cm-sea)!important}

/* Trust signals: coherent sea/sun striping */
.signal:before{background:var(--cm-sea)!important}
.signal:nth-child(2):before{background:var(--cm-aqua)!important}
.signal:nth-child(3):before{background:var(--cm-sun)!important}
.signal:nth-child(4):before{background:var(--cm-coral)!important}

/* Experiences: seafoam + limestone, not spectrum colours */
.experience-showcase{
  background:
    radial-gradient(circle at 9% 16%,rgba(246,199,68,.30),transparent 23%),
    radial-gradient(circle at 91% 15%,rgba(17,174,185,.18),transparent 27%),
    linear-gradient(135deg,#DCF6F1 0%,#FFF7E7 58%,#F4E7CD 100%)!important;
}
.experience-showcase:before{
  background-image:url('/assets/images/ui/sea-sun-fish.svg')!important;
  background-repeat:no-repeat!important;
  background-position:right 20px bottom -10px!important;
  background-size:min(690px,58vw)!important;
  opacity:.13!important;
  mask-image:none!important;
}
.experience-card:nth-child(2),
.experience-card:nth-child(3){background:#fff!important}
.experience-media{border-bottom:5px solid var(--cm-sea)!important}
.experience-card:nth-child(2) .experience-media{border-bottom-color:var(--cm-sun)!important}
.experience-card:nth-child(3) .experience-media{border-bottom-color:var(--cm-aqua)!important}
.experience-tag{background:rgba(3,45,73,.92)!important}

/* Discovery: Aegean water with actual sea/sun visual motif */
.discovery-wow{
  background:
    linear-gradient(125deg,rgba(3,45,73,.98),rgba(0,111,152,.96) 58%,rgba(17,174,185,.92)),
    url('/assets/images/ui/sea-sun-fish.svg') right center/760px auto no-repeat!important;
}
.discovery-wow:before{
  background:radial-gradient(circle,var(--cm-sun),rgba(246,199,68,.17) 45%,transparent 68%)!important;
}
.discovery-wow:after{display:none!important}
.discovery-wow .eyebrow{color:#FFE38B!important}
.discovery-wow .system-card:nth-child(1){background:#DDF7F2!important}
.discovery-wow .system-card:nth-child(2){background:#FFF8E7!important}
.discovery-wow .system-card:nth-child(3){background:#FBE7C1!important}
.discovery-wow .system-card:nth-child(4){background:#DDEFF3!important}

/* Platform and creator sections: coastal palette */
.platform-wow{
  background:
    radial-gradient(circle at 92% 20%,rgba(246,199,68,.24),transparent 25%),
    linear-gradient(135deg,#E3F7F3 0%,#FFF8E9 55%,#F5E9D1 100%)!important;
}
.platform-wow:before{
  background:linear-gradient(180deg,var(--cm-sea),var(--cm-aqua))!important;
}
.platform-wow .pillar:nth-child(1){border-top-color:var(--cm-sea)!important}
.platform-wow .pillar:nth-child(2){border-top-color:var(--cm-sun)!important}
.platform-wow .pillar:nth-child(3){border-top-color:var(--cm-aqua)!important}
.platform-wow .pillar-number{color:var(--cm-sea)!important}

.creator-wow{
  background:
    linear-gradient(90deg,rgba(255,255,255,.90),rgba(255,255,255,.94)),
    repeating-linear-gradient(45deg,#DDF5F2 0 18px,#FFF5D9 18px 36px,#D8EDF1 36px 54px)!important;
}
.creator-wow:after{
  border-color:rgba(17,174,185,.15)!important;
  box-shadow:0 0 0 65px rgba(246,199,68,.09),0 0 0 130px rgba(0,111,152,.05)!important;
}
.creator-card:before{background:var(--cm-sea)!important}
.creator-card:nth-child(3n+2):before{background:var(--cm-sun)!important}
.creator-card:nth-child(3n):before{background:var(--cm-aqua)!important}
.creator-image{background:linear-gradient(145deg,#DDF5F2,#FFF1CF)!important}

/* Dark/commercial sections: underwater depth + sunlight */
.dark-section{
  background:
    radial-gradient(circle at 92% 10%,rgba(246,199,68,.16),transparent 22%),
    radial-gradient(circle at 12% 20%,rgba(51,199,191,.21),transparent 24%),
    linear-gradient(135deg,#02243B 0%,#034C6B 50%,#00788E 100%)!important;
}
.dark-section:after{
  background:linear-gradient(90deg,var(--cm-sea),var(--cm-aqua) 72%,var(--cm-sun))!important;
}
.dark-card:nth-child(1){border-top-color:var(--cm-aqua)!important}
.dark-card:nth-child(2){border-top-color:var(--cm-sun)!important}
.dark-card:nth-child(3){border-top-color:#7ADDD5!important}

/* Proof + newsletter */
.difference-wow{
  background:
    radial-gradient(circle at 85% 20%,rgba(17,174,185,.16),transparent 25%),
    linear-gradient(135deg,#FFF3C7 0%,#F6E7C8 53%,#DFF4EF 100%)!important;
}
.difference-wow .proof-small:last-child{
  background:#E2F5F1!important;border-left-color:var(--cm-aqua)!important
}
.newsletter-wow{
  background:linear-gradient(135deg,#DDF6F2 0%,#E5F4F5 56%,#FFF0CE 100%)!important;
}
.newsletter-wow .newsletter-box{
  background:linear-gradient(115deg,var(--cm-deep),var(--cm-sea) 62%,var(--cm-aqua))!important;
}
.newsletter-wow .newsletter-form .btn-dark{
  background:var(--cm-sun)!important;color:var(--cm-deep)!important
}

/* Final CTA: sun over sea, not a multicolour stripe */
.final-box{
  background:
    radial-gradient(circle at 88% 28%,rgba(255,255,255,.24),transparent 18%),
    linear-gradient(120deg,#F7D36A 0%,#F6C744 48%,#E9A84A 100%)!important;
}
.final-box:after{
  border-color:rgba(0,111,152,.18)!important;
  box-shadow:0 0 0 48px rgba(17,174,185,.11)!important
}

/* Internal page hero */
.page-panel{
  background:
    radial-gradient(circle at 87% 10%,rgba(246,199,68,.33),transparent 23%),
    linear-gradient(135deg,var(--cm-deep) 0%,var(--cm-sea) 62%,var(--cm-aqua) 100%)!important;
}
.content-card:nth-child(4n+1),.media-kit-card:nth-child(4n+1){background:#E4F6F2!important}
.content-card:nth-child(4n+2),.media-kit-card:nth-child(4n+2){background:#FFF3D9!important}
.content-card:nth-child(4n+3),.media-kit-card:nth-child(4n+3){background:#E4F0F2!important}
.content-card:nth-child(4n),.media-kit-card:nth-child(4n){background:#F4E9D5!important}

/* Commercial recommendation engine callout */
.comino-recommendation-inclusion{
  margin-top:34px;
  padding:34px;
  border-radius:26px;
  background:
    linear-gradient(120deg,rgba(3,45,73,.98),rgba(0,111,152,.96)),
    url('/assets/images/ui/sea-sun-fish.svg') right center/480px auto no-repeat;
  color:#fff;
  box-shadow:var(--cm-shadow);
  position:relative;overflow:hidden
}
.comino-recommendation-inclusion .eyebrow{color:#FFE28A!important}
.comino-recommendation-inclusion h3{
  margin:8px 0 13px;
  font:400 clamp(32px,4vw,50px)/1.02 Georgia,"Times New Roman",serif;
  color:#fff!important
}
.comino-recommendation-inclusion p{max-width:920px;color:#E8F8F5!important;font-size:16px}
.comino-recommendation-inclusion strong{color:#FFE28A}

/* ============================================================
   FIXED SIDE TABS — LABELLED, COMPACT, NOT COVERING THE FOOTER
   ============================================================ */
.comino-floating-stack{
  position:fixed!important;
  right:0!important;
  top:46%!important;
  bottom:auto!important;
  transform:translateY(-50%)!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-end!important;
  gap:9px!important;
  z-index:170!important;
  transition:opacity .22s ease,transform .22s ease!important;
}
.comino-floating-stack.near-footer{
  opacity:0!important;
  pointer-events:none!important;
  transform:translate(100%,-50%)!important
}
.comino-float-btn{
  width:48px!important;
  height:126px!important;
  min-width:48px!important;
  min-height:126px!important;
  padding:10px 0!important;
  border:2px solid rgba(255,255,255,.94)!important;
  border-right:0!important;
  border-radius:18px 0 0 18px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:center!important;
  gap:8px!important;
  color:#fff!important;
  font-size:11px!important;
  box-shadow:0 16px 38px rgba(0,45,66,.21)!important;
}
.comino-float-btn:before{display:none!important}
.comino-float-icon{font-size:18px!important;line-height:1!important}
.comino-float-text{
  display:block!important;
  font-size:11px!important;
  font-weight:900!important;
  letter-spacing:.7px!important;
  writing-mode:vertical-rl!important;
  transform:rotate(180deg)!important;
  text-transform:none!important
}
.comino-ask-btn{background:linear-gradient(180deg,var(--cm-sea),var(--cm-deep))!important}
.comino-wa-btn{background:linear-gradient(180deg,#18B866,#078B50)!important}
.comino-widget-panel{
  background:#FFFDF7!important;
  border:1px solid #DCE9E6!important;
  color:var(--cm-ink)!important;
  box-shadow:0 30px 100px rgba(0,43,69,.29)!important
}
.comino-widget-panel h3{color:var(--cm-deep)!important}
.comino-widget-panel label,.comino-widget-panel p,.comino-form-status{color:#244751!important}
.comino-widget-panel input,.comino-widget-panel textarea{
  border:2px solid #CFE4E0!important;color:#153D49!important;background:#fff!important
}
.comino-answer-card{background:#DFF5F0!important;color:#173E49!important}
.comino-answer-notice{background:#FFF2D1!important;color:#4A3B1B!important;border-left:5px solid var(--cm-sun)!important}

/* ============================================================
   CORRECT SHARED FOOTER — explicit styles also fix custom articles
   ============================================================ */
.comino-site-footer{
  position:relative!important;
  overflow:hidden!important;
  margin:0!important;
  padding:0!important;
  background:
    linear-gradient(118deg,#021F34 0%,#043D58 54%,#006477 100%)!important;
  color:#fff!important;
  border:0!important
}
.comino-site-footer:before{
  content:""!important;
  position:absolute!important;
  top:0!important;left:0!important;right:0!important;height:6px!important;
  background:linear-gradient(90deg,var(--cm-sea),var(--cm-aqua) 72%,var(--cm-sun))!important
}
.comino-footer-art{
  position:absolute;
  right:-65px;bottom:-18px;
  width:min(620px,46vw);height:310px;
  background:url('/assets/images/ui/sea-sun-fish.svg') center/contain no-repeat;
  opacity:.13;pointer-events:none
}
.comino-site-footer .container{
  width:min(1380px,calc(100% - 70px))!important;
  margin:0 auto!important;
  max-width:none!important
}
.comino-site-footer .comino-footer-grid{
  position:relative;z-index:1;
  display:grid!important;
  grid-template-columns:1.45fr repeat(4,minmax(0,1fr))!important;
  gap:42px!important;
  padding-top:64px!important;
  padding-bottom:46px!important
}
.comino-site-footer section{padding:0!important;margin:0!important;background:none!important}
.comino-footer-logo{
  font:400 28px/1 Georgia,"Times New Roman",serif!important;
  letter-spacing:1.5px!important;
  color:#fff!important;margin-bottom:17px!important
}
.comino-footer-tagline{
  max-width:320px!important;color:#D9EFED!important;
  font-size:14px!important;line-height:1.55!important;margin:0 0 18px!important
}
.comino-footer-badges{display:flex;flex-wrap:wrap;gap:7px}
.comino-footer-badges span{
  display:inline-flex;padding:7px 9px;border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.07);border-radius:999px;
  color:#EAF8F5;font-size:10px
}
.comino-site-footer h4{
  color:#FFD86B!important;
  font:700 12px/1.2 Arial,Helvetica,sans-serif!important;
  letter-spacing:1.35px!important;text-transform:uppercase!important;
  margin:0 0 18px!important
}
.comino-site-footer a{
  display:block!important;
  color:#E8F6F3!important;
  font-size:13px!important;
  line-height:1.35!important;
  margin:10px 0!important;
  text-decoration:none!important
}
.comino-site-footer a:hover{color:#FFD86B!important}
.comino-footer-contact strong{color:#fff!important}
.comino-footer-chat,.comino-footer-work{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  min-height:42px!important;padding:0 16px!important;border-radius:999px!important;
  margin-top:10px!important;font-weight:800!important;font-size:11px!important;
  letter-spacing:.3px!important
}
.comino-footer-chat{
  border:1px solid rgba(255,255,255,.28)!important;background:rgba(255,255,255,.09)!important;color:#fff!important
}
.comino-footer-work{
  background:var(--cm-sun)!important;color:var(--cm-deep)!important;margin-right:auto!important
}
.comino-site-footer .comino-footer-bottom{
  position:relative;z-index:1;
  display:flex!important;justify-content:space-between!important;gap:18px!important;flex-wrap:wrap!important;
  border-top:1px solid rgba(255,255,255,.13)!important;
  padding-top:20px!important;padding-bottom:28px!important;
  color:#CDE6E3!important;font-size:11px!important
}
.comino-footer-bottom strong{color:#FFD86B!important}

/* Old generic footer selector must not override the new component */
.comino-site-footer .footer-grid,.comino-site-footer .footer-legal-line{all:unset}

/* Better article footer spacing even when article has its own CSS */
body > .comino-site-footer{font-family:Arial,Helvetica,sans-serif!important}
body > .comino-site-footer *{box-sizing:border-box!important}

/* Cookie box less intrusive */
.cookie-panel{left:16px!important;right:auto!important;bottom:16px!important;max-width:620px!important}
.cookie-inner{background:rgba(3,36,59,.96)!important}

/* Responsive */
@media(max-width:1100px){
  .comino-site-footer .comino-footer-grid{
    grid-template-columns:1.4fr 1fr 1fr!important
  }
}
@media(max-width:760px){
  .comino-site-footer .container{width:calc(100% - 30px)!important}
  .comino-site-footer .comino-footer-grid{grid-template-columns:1fr 1fr!important;gap:30px 20px!important}
  .comino-footer-brand,.comino-footer-contact{grid-column:1/-1}
  .comino-footer-art{width:90vw;opacity:.08}
  .comino-floating-stack{
    top:auto!important;bottom:16px!important;right:12px!important;
    transform:none!important;flex-direction:row!important;gap:8px!important
  }
  .comino-floating-stack.near-footer{transform:translateY(130%)!important}
  .comino-float-btn{
    width:auto!important;height:46px!important;min-width:105px!important;min-height:46px!important;
    border-radius:999px!important;border:2px solid #fff!important;
    padding:0 14px!important;flex-direction:row!important
  }
  .comino-float-text{
    writing-mode:horizontal-tb!important;transform:none!important;font-size:11px!important
  }
}
