:root{
  --navy:#0b2b40;
  --navy2:#123e58;
  --ink:#132b39;
  --mist:#eaf3f7;
  --ice:#f7fbfd;
  --blue:#91a8b8;
  --gold:#dfbb62;
  --white:#fff;
  --muted:#647783;
  --line:rgba(16,53,74,.14);
  --shadow:0 30px 80px rgba(7,38,57,.16);
  --radius:30px;
  --wrap:1220px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:"Segoe UI",Arial,sans-serif;color:var(--ink);background:var(--white);line-height:1.65;overflow-x:hidden}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
button,input,textarea,select{font:inherit}
.wrap{width:min(var(--wrap),calc(100% - 42px));margin-inline:auto}
.header{position:fixed;left:0;right:0;top:0;z-index:50;transition:.3s;background:transparent}
.header.scrolled{background:rgba(255,255,255,.94);backdrop-filter:blur(15px);box-shadow:0 12px 35px rgba(8,34,49,.09)}
.nav-shell{height:88px;display:flex;align-items:center;justify-content:space-between}
.brand{width:184px;height:70px;display:flex;align-items:center;overflow:hidden}
.brand img{width:100%;height:100%;object-fit:contain}
.nav{display:flex;align-items:center;gap:32px}
.nav a{color:var(--white);font-size:14px;font-weight:750;letter-spacing:.3px;position:relative;padding:31px 0}
.header.scrolled .nav a{color:var(--ink)}
.nav a:not(.nav-cta)::after{content:"";position:absolute;left:0;right:100%;bottom:23px;height:2px;background:var(--gold);transition:.25s}
.nav a:hover::after,.nav a.active::after{right:0}
.nav-cta{padding:12px 20px!important;border:1px solid rgba(255,255,255,.45);border-radius:999px}
.header.scrolled .nav-cta{background:var(--navy);color:#fff!important;border-color:var(--navy)}
.nav-toggle{display:none;border:0;background:transparent;width:45px;height:45px;padding:10px}
.nav-toggle span{height:2px;background:#fff;display:block;margin:6px 0}
.header.scrolled .nav-toggle span{background:var(--navy)}

.hero{
    min-height:100vh;
    display:flex;
    align-items:center;
    position:relative;
    background:
        linear-gradient(
            90deg,
            rgba(5,27,42,.96) 0%,
            rgba(5,27,42,.88) 47%,
            rgba(5,27,42,.2) 100%
        ),
        url("../images/hero-seafood.jpg") center/cover no-repeat;
    color:#fff;
    overflow:hidden;
}

.hero:after{
    content:"";
    position:absolute;
    left:-7%;
    right:-7%;
    bottom:-72px;
    height:145px;
    background:#fff;
    border-radius:50% 50% 0 0/100% 100% 0 0;
}

.hero-watermark{
    position:absolute;
    top:100px;
    left:50%;
    transform:translateX(-50%);
    width:100%;
    text-align:center;

    color:rgba(255,255,255,.035);
    font-family:Georgia,serif;
    font-size:clamp(150px,18vw,330px);
    letter-spacing:24px;
    white-space:nowrap;

    z-index:1;
    pointer-events:none;
}

.inner-hero-watermark{
    position:absolute;
    top:105px;

    left:50%;
    transform:translateX(-50%);

    width:100%;
    text-align:center;

    color:rgba(255,255,255,.035);
    font-family:Georgia,serif;
    font-size:clamp(140px,17vw,300px);
    letter-spacing:18px;
    white-space:nowrap;

    z-index:1;
    pointer-events:none;
}
.hero-content{
    position:relative;
    z-index:2;
    max-width:760px;
    padding:150px 0 170px;
}

.kicker{
    display:flex;
    align-items:center;
    gap:13px;
    color:var(--gold);
    font-size:12px;
    font-weight:850;
    letter-spacing:2px;
    text-transform:uppercase;
}

.kicker:before{
    content:"";
    width:48px;
    height:2px;
    background:currentColor;
}

.hero h1{
    font-size:clamp(54px,7.5vw,102px);
    line-height:.98;
    letter-spacing:-4px;
    margin:23px 0 26px;
}

.hero h1 span{
    display:block;
    font-family:Georgia,serif;
    font-style:italic;
    font-weight:400;
    font-size:.48em;
    letter-spacing:9px;
    color:#d9e8ef;
    margin-top:18px;
}

.hero p{
    max-width:670px;
    font-size:18px;
    color:#d4e1e7;
}
.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:35px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 25px;border-radius:999px;font-weight:800;font-size:14px;transition:.25s}
.btn:hover{transform:translateY(-3px)}
.btn-gold{background:var(--gold);color:var(--navy)}
.btn-outline{border:1px solid rgba(255,255,255,.45);color:#fff;background:rgba(255,255,255,.07)}
.btn-navy{background:var(--navy);color:#fff}
.btn-light{background:#fff;color:var(--navy);border:1px solid var(--line)}

.section{padding:105px 0}
.section-soft{background:var(--ice)}
.section-navy{background:var(--navy);color:#fff}
.heading{max-width:800px;margin-bottom:48px}
.heading.center{text-align:center;margin-inline:auto}
.heading small{color:var(--gold);font-weight:900;letter-spacing:2px;text-transform:uppercase}
.heading h2{font-size:clamp(38px,5vw,64px);line-height:1.08;letter-spacing:-2px;color:var(--navy);margin-top:10px}
.section-navy .heading h2{color:#fff}
.heading p{color:var(--muted);font-size:17px;margin-top:18px}
.section-navy .heading p{color:#bfd0d8}

.who-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center}
.editorial-copy p{color:var(--muted);font-size:17px;margin-bottom:22px}
.mini-points{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:30px}
.mini-point{padding:20px;border-left:3px solid var(--gold);background:var(--ice);border-radius:0 18px 18px 0}
.mini-point strong{display:block;color:var(--navy);margin-bottom:4px}
.product-mosaic{display:grid;grid-template-columns:1fr 1fr;gap:16px;position:relative}
.product-mosaic .tile{overflow:hidden;border-radius:26px;background:var(--mist);box-shadow:var(--shadow)}
.product-mosaic .tile:nth-child(2){transform:translateY(38px)}
.product-mosaic img{width:100%;height:260px;object-fit:cover;background:#eaf3f7}

.capability-band{position:relative;background:linear-gradient(135deg,#0c3048,#164b67);color:#fff;overflow:hidden}
.capability-band:before,.capability-band:after{content:"";position:absolute;left:-10%;right:-10%;height:110px;background:#fff;border-radius:50%}
.capability-band:before{top:-76px}
.capability-band:after{bottom:-76px}
.capabilities{display:grid;grid-template-columns:repeat(4,1fr);gap:0;padding:78px 0}
.capability{padding:25px 32px;text-align:center;border-right:1px solid rgba(255,255,255,.16)}
.capability:last-child{border:0}
.capability strong{display:block;font-size:25px;color:#fff}
.capability span{font-size:13px;color:#bdd0d9;letter-spacing:1px;text-transform:uppercase}

.why-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:80px;align-items:center}
.why-visual{position:relative;min-height:570px}
.why-visual:before{content:"";position:absolute;width:430px;height:430px;border-radius:50%;background:var(--mist);left:5%;top:10%}
.why-visual img{position:absolute;filter:drop-shadow(0 25px 25px rgba(9,43,63,.18))}
.why-visual .fish1{width:65%;left:2%;top:12%;transform:rotate(-8deg)}
.why-visual .fish2{width:47%;right:2%;top:42%;transform:rotate(8deg)}
.why-visual .fish3{width:38%;left:18%;bottom:2%;transform:rotate(4deg)}
.why-list{display:grid;gap:18px}
.why-item{padding:25px 25px 25px 84px;border:1px solid var(--line);border-radius:24px;position:relative;background:#fff}
.why-item .num{position:absolute;left:24px;top:24px;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--mist);color:var(--navy);font-weight:900}
.why-item h3{color:var(--navy);margin-bottom:5px}
.why-item p{color:var(--muted)}

.product-showcase{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.product-card{border-radius:28px;overflow:hidden;background:#fff;box-shadow:0 22px 60px rgba(7,38,57,.12);transition:.3s}
.product-card:hover{transform:translateY(-7px)}
.product-card img{height:300px;width:100%;object-fit:cover;background:#eaf3f7}
.product-card div{padding:24px}
.product-card small{color:var(--gold);font-weight:900;text-transform:uppercase;letter-spacing:1.5px}
.product-card h3{font-size:23px;color:var(--navy);margin:5px 0}
.product-card p{color:var(--muted);font-size:14px}

.brand-story{display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;gap:80px}
.brand-mark{background:var(--blue);border-radius:35px;padding:45px;box-shadow:var(--shadow)}
.brand-mark img{width:100%}
.quote{font-family:Georgia,serif;font-size:clamp(30px,4vw,50px);line-height:1.25;color:#fff}
.quote span{display:block;color:var(--gold);font-family:"Segoe UI",Arial,sans-serif;font-size:13px;text-transform:uppercase;letter-spacing:2px;margin-top:25px}

.cta{padding:95px 0;background:linear-gradient(120deg,#eff7fa,#dceaf0);text-align:center}
.cta h2{font-size:clamp(38px,5vw,62px);color:var(--navy);line-height:1.05}
.cta p{max-width:680px;margin:18px auto 0;color:var(--muted)}

.page-hero{padding:175px 0 100px;color:#fff;background:linear-gradient(90deg,rgba(5,27,42,.96),rgba(5,27,42,.73)),url("../images/hero-seafood.jpg") center/cover no-repeat}
.page-hero h1{font-size:clamp(52px,7vw,84px);line-height:1;letter-spacing:-3px;margin-top:15px}
.page-hero p{max-width:720px;margin-top:22px;color:#d0dfe6;font-size:18px}
.content-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.content-card{padding:34px;border:1px solid var(--line);border-radius:28px;background:#fff;box-shadow:0 18px 50px rgba(7,38,57,.08)}
.content-card h3{color:var(--navy);font-size:25px;margin-bottom:12px}
.content-card p{color:var(--muted)}
.tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.tags span{padding:9px 13px;background:var(--mist);border-radius:999px;color:var(--navy);font-size:13px;font-weight:750}
.gallery-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.gallery-grid img{border-radius:28px;box-shadow:var(--shadow)}
.contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:34px}
.contact-panel,.form-panel{background:#fff;border:1px solid var(--line);border-radius:28px;padding:34px;box-shadow:var(--shadow)}
.contact-row{padding:20px 0;border-bottom:1px solid var(--line)}
.contact-row:last-child{border:0}
.contact-row small{display:block;color:var(--gold);font-weight:900;text-transform:uppercase;letter-spacing:1.4px}
.contact-row a,.contact-row p{display:block;color:var(--navy);font-weight:750;margin-top:5px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field{display:grid;gap:7px}
.field.full{grid-column:1/-1}
.field label{font-size:13px;color:var(--navy);font-weight:800}
.field input,.field textarea,.field select{padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--ice);outline:0}
.field textarea{min-height:150px;resize:vertical}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--blue);box-shadow:0 0 0 4px rgba(145,168,184,.18)}

.footer{background:#061f30;color:#c6d4dc;padding:75px 0 25px}
.footer-main{display:grid;grid-template-columns:1.4fr .7fr 1fr;gap:70px}
.footer-brand img{width:260px;max-height:220px;object-fit:contain;margin-bottom:12px}
.footer h4{color:#fff;margin-bottom:15px}
.footer a,.footer p{display:block;margin:8px 0;color:#bfd0d8;font-size:14px}
.footer-bottom{display:flex;justify-content:space-between;gap:20px;border-top:1px solid rgba(255,255,255,.13);padding-top:22px;margin-top:50px;color:#8fa6b3;font-size:13px}

.reveal{opacity:0;transform:translateY(28px);transition:.75s ease}
.reveal.visible{opacity:1;transform:none}

@media(max-width:1000px){
  .nav-toggle{display:block}
  .nav{position:absolute;left:20px;right:20px;top:78px;background:#fff;border-radius:20px;box-shadow:var(--shadow);padding:15px 22px;display:none;flex-direction:column;align-items:stretch;gap:0}
  .nav.open{display:flex}
  .nav a,.header:not(.scrolled) .nav a{color:var(--ink);padding:14px 0}
  .nav a:after{display:none}
  .nav-cta{background:var(--navy);color:#fff!important;text-align:center;margin-top:8px}
  .who-grid,.why-grid,.brand-story,.contact-grid{grid-template-columns:1fr}
  .capabilities{grid-template-columns:repeat(2,1fr)}
  .capability:nth-child(2){border-right:0}
  .product-showcase{grid-template-columns:repeat(2,1fr)}
  .footer-main{grid-template-columns:1fr 1fr}
  .footer-brand{grid-column:1/-1}
}
@media(max-width:680px){
  .brand{min-width:0;gap:8px}
  .brand img{width:40px;height:40px;flex-basis:40px}
  .brand-copy strong{font-size:17px;letter-spacing:3px}
  .brand-copy small{font-size:7px;letter-spacing:1.4px}
  .wrap{width:min(var(--wrap),calc(100% - 28px))}
  .hero-content{padding:140px 0 150px}
  .hero h1{letter-spacing:-2.5px}
  .hero h1 span{letter-spacing:4px}
  .section{padding:75px 0}
  .mini-points,.capabilities,.product-showcase,.content-grid,.gallery-grid,.form-grid,.footer-main{grid-template-columns:1fr}
  .capability{border-right:0;border-bottom:1px solid rgba(255,255,255,.15)}
  .capability:last-child{border-bottom:0}
  .product-mosaic .tile:nth-child(2){transform:none}
  .product-mosaic img{height:200px}
  .why-visual{min-height:430px}
  .footer-brand{grid-column:auto}
  .footer-bottom{flex-direction:column}
}

.product-mosaic .tile,
.product-card {
  position: relative;
}
.product-mosaic .tile::after,
.product-card::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.20);
}
.image-credit-page a {
  color: var(--navy-2);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.credit-list {
  display: grid;
  gap: 18px;
  margin-top: 28px;
}
.credit-item {
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: var(--white);
}
.credit-item h3 {
  margin-bottom: 8px;
  color: var(--navy);
}
.credit-item p {
  color: var(--muted);
}
.download-status {
  width: min(900px, calc(100% - 32px));
  margin: 40px auto;
  font-family: "Segoe UI", Arial, sans-serif;
}


/* =========================================================
   V3.1 HEADER AND CLEAN INTERNET-PHOTO HERO OVERRIDES
   ========================================================= */

.header {
  height: 84px;
}

.nav-shell {
  height: 84px;
}

.brand {
  width: auto !important;
  height: auto !important;
  min-width: 230px;
  display: inline-flex !important;
  align-items: center;
  gap: 12px;
  overflow: visible !important;
}

.brand > img {
  display: block;
  width: 46px !important;
  height: 46px !important;
  flex: 0 0 46px;
  object-fit: contain !important;
}

.brand-copy {
  display: grid;
  line-height: 1;
}

.brand-copy strong {
  color: #ffffff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 5px;
}

.brand-copy small {
  margin-top: 7px;
  color: #c9d8df;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: 2.1px;
  text-transform: uppercase;
}

.header.scrolled .brand-copy strong {
  color: var(--navy);
}

.header.scrolled .brand-copy small {
  color: var(--muted);
}

.header:not(.scrolled) .brand > img {
  filter: brightness(0) invert(1);
}

.header.scrolled .brand > img {
  filter: none;
}

/* Remove the old composite hero image completely. */
.hero-clean {
  position: relative;
  min-height: 850px;
  display: flex;
  align-items: center;
  overflow: hidden;
  color: #ffffff;
  background:
    radial-gradient(circle at 82% 22%, rgba(86, 142, 169, .46), transparent 30%),
    radial-gradient(circle at 67% 86%, rgba(42, 92, 119, .38), transparent 34%),
    linear-gradient(118deg, #061e2e 0%, #0a2d43 52%, #184e69 100%);
}

.hero-clean::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(105deg, rgba(255,255,255,.025) 1px, transparent 1px),
    linear-gradient(rgba(255,255,255,.02) 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: linear-gradient(90deg, transparent, #000 48%, #000);
}

.hero-clean::after {
  display: none;
}

.hero-layout {
  position: relative;
  z-index: 4;
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(460px, 1.08fr);
  gap: 68px;
  align-items: center;
  padding: 145px 0 155px;
}

.hero-clean .hero-content {
  max-width: 740px;
  padding: 0;
}

.hero-clean h1 {
  margin: 23px 0 26px;
  font-size: clamp(52px, 6.5vw, 92px);
  line-height: .99;
  letter-spacing: -4px;
}

.hero-clean h1 span {
  display: block;
  margin-top: 20px;
  color: #d9e8ef;
  font-family: Georgia, "Times New Roman", serif;
  font-size: .48em;
  font-style: italic;
  font-weight: 400;
  letter-spacing: 8px;
}

.hero-clean p {
  max-width: 670px;
  color: #d1dfe6;
  font-size: 18px;
}

.hero-products {
  position: relative;
  min-height: 610px;
}

.hero-product {
  position: absolute;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 30px;
  background:
    linear-gradient(145deg, rgba(255,255,255,.16), rgba(255,255,255,.05));
  box-shadow: 0 35px 85px rgba(0,0,0,.27);
  backdrop-filter: blur(12px);
}

.hero-product::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, transparent 55%, rgba(2,22,35,.72));
}

.hero-product img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero-product span {
  position: absolute;
  z-index: 2;
  left: 22px;
  bottom: 18px;
  color: #ffffff;
  font-size: 13px;
  font-weight: 850;
  letter-spacing: .6px;
}

.hero-product-main {
  width: 68%;
  height: 440px;
  right: 3%;
  top: 20px;
  transform: rotate(2deg);
}

.hero-product-small {
  width: 42%;
  height: 245px;
}

.hero-product-shrimp {
  left: 0;
  top: 250px;
  transform: rotate(-5deg);
}

.hero-product-lobster {
  right: 4%;
  bottom: 0;
  transform: rotate(5deg);
}

.hero-product.image-missing {
  display: grid;
  place-items: center;
  min-height: 180px;
}

.hero-product.image-missing::before {
  content: "Run download-product-images.php";
  padding: 25px;
  color: #d9e8ef;
  text-align: center;
  font-size: 13px;
  font-weight: 800;
}

.hero-product-note {
  position: absolute;
  z-index: 5;
  left: 5%;
  top: 40px;
  width: 255px;
  padding: 19px 21px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 18px;
  background: rgba(4, 31, 47, .68);
  box-shadow: 0 18px 45px rgba(0,0,0,.18);
  backdrop-filter: blur(13px);
}

.hero-product-note strong,
.hero-product-note small {
  display: block;
}

.hero-product-note strong {
  color: var(--gold);
  font-size: 12px;
  letter-spacing: .8px;
}

.hero-product-note small {
  margin-top: 6px;
  color: #c9d8df;
  line-height: 1.45;
}

.hero-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(2px);
}

.hero-orb-one {
  width: 420px;
  height: 420px;
  right: -140px;
  top: 90px;
  background: rgba(158, 199, 217, .12);
}

.hero-orb-two {
  width: 290px;
  height: 290px;
  right: 34%;
  bottom: 20px;
  border: 1px solid rgba(255,255,255,.09);
}

.hero-curve {
  position: absolute;
  z-index: 5;
  left: -7%;
  right: -7%;
  bottom: -75px;
  height: 150px;
  border-radius: 50% 50% 0 0 / 100% 100% 0 0;
  background: #ffffff;
}

/* Clean internal page heroes. */
.page-hero-clean {
  position: relative;
  overflow: hidden;
  padding: 175px 0 105px;
  color: #ffffff;
  background:
    radial-gradient(circle at 86% 24%, rgba(112, 170, 195, .35), transparent 26%),
    linear-gradient(115deg, #061f30 0%, #0b344c 58%, #215c76 100%);
}

.page-hero-clean::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(105deg, rgba(255,255,255,.025) 1px, transparent 1px),
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px);
  background-size: 46px 46px;
}

.page-hero-clean .wrap {
  position: relative;
  z-index: 2;
}

.page-hero-orb {
  position: absolute;
  width: 420px;
  height: 420px;
  right: -110px;
  bottom: -230px;
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 50%;
}

/* Real downloaded photographs should fill the cards cleanly. */
.product-mosaic img,
.product-card img {
  object-fit: cover !important;
}

/* Desktop */
@media (max-width: 1100px) {
  .hero-layout {
    grid-template-columns: 1fr;
    padding-bottom: 170px;
  }

  .hero-products {
    min-height: 560px;
    width: min(760px, 100%);
    margin-inline: auto;
  }
}

/* Mobile */
@media (max-width: 700px) {
  .header {
    height: 76px;
  }

  .nav-shell {
    height: 76px;
  }

  .brand {
    min-width: 0;
    gap: 8px;
  }

  .brand > img {
    width: 38px !important;
    height: 38px !important;
    flex-basis: 38px;
  }

  .brand-copy strong {
    font-size: 16px;
    letter-spacing: 3px;
  }

  .brand-copy small {
    margin-top: 5px;
    font-size: 6.5px;
    letter-spacing: 1.2px;
  }

  .hero-clean {
    min-height: auto;
  }

  .hero-layout {
    gap: 45px;
    padding: 130px 0 140px;
  }

  .hero-clean h1 {
    font-size: clamp(46px, 15vw, 66px);
    letter-spacing: -2.5px;
  }

  .hero-clean h1 span {
    letter-spacing: 4px;
  }

  .hero-products {
    min-height: 485px;
  }

  .hero-product-main {
    width: 82%;
    height: 320px;
  }

  .hero-product-small {
    width: 50%;
    height: 190px;
  }

  .hero-product-shrimp {
    top: 245px;
  }

  .hero-product-lobster {
    bottom: 0;
  }

  .hero-product-note {
    left: 0;
    top: 10px;
    width: 210px;
  }
}


/* =========================================================
   V4 REFERENCE-QUALITY ORIGINAL HOMEPAGE
   ========================================================= */

.hero-v4 {
  position: relative;
  min-height: 900px;
  overflow: hidden;
  color: #fff;
  background:
    radial-gradient(circle at 82% 22%, rgba(100, 165, 190, .28), transparent 28%),
    linear-gradient(118deg, #041b2a 0%, #0a2f46 58%, #1c617c 100%);
}

.hero-v4::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .22;
  background:
    repeating-linear-gradient(120deg, transparent 0 55px, rgba(255,255,255,.025) 56px 57px);
}

.hero-watermark {
  position: absolute;
  top: 100px;
  right: -40px;
  color: rgba(255,255,255,.035);
  font-family: Georgia, serif;
  font-size: clamp(150px, 18vw, 330px);
  letter-spacing: 24px;
  white-space: nowrap;
}

.hero-v4-grid {
  position: relative;
  z-index: 3;
  display: grid;
  grid-template-columns: .92fr 1.08fr;
  gap: 78px;
  align-items: center;
  padding: 160px 0 165px;
}

.hero-v4-copy h1 {
  margin: 22px 0 26px;
  font-size: clamp(56px, 7.5vw, 104px);
  line-height: .98;
  letter-spacing: -4px;
}

.hero-v4-copy h1 span {
  display: block;
  margin-top: 18px;
  color: #dceaf0;
  font-family: Georgia, serif;
  font-size: .48em;
  font-style: italic;
  font-weight: 400;
  letter-spacing: 7px;
}

.hero-v4-copy p {
  max-width: 660px;
  color: #d2e0e7;
  font-size: 18px;
}

.hero-v4-stage {
  position: relative;
  min-height: 630px;
}

.hero-v4-main-card,
.hero-v4-float {
  position: absolute;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.24);
  background: rgba(255,255,255,.10);
  box-shadow: 0 35px 90px rgba(0,0,0,.28);
  backdrop-filter: blur(10px);
}

.hero-v4-main-card {
  width: 72%;
  height: 460px;
  right: 0;
  top: 40px;
  border-radius: 36px;
  transform: rotate(2deg);
}

.hero-v4-main-card img,
.hero-v4-float img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero-v4-main-card::after,
.hero-v4-float::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 50%, rgba(3,28,43,.78));
}

.hero-v4-main-card div {
  position: absolute;
  z-index: 2;
  left: 28px;
  bottom: 24px;
}

.hero-v4-main-card small,
.hero-v4-main-card strong {
  display: block;
}

.hero-v4-main-card small {
  color: var(--gold);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 1.4px;
  text-transform: uppercase;
}

.hero-v4-main-card strong {
  margin-top: 3px;
  font-size: 24px;
}

.hero-v4-float {
  width: 39%;
  height: 235px;
  border-radius: 28px;
}

.hero-v4-float span {
  position: absolute;
  z-index: 2;
  left: 20px;
  bottom: 17px;
  font-size: 13px;
  font-weight: 850;
}

.card-a {
  left: 0;
  top: 265px;
  transform: rotate(-5deg);
}

.card-b {
  right: 4%;
  bottom: 0;
  transform: rotate(5deg);
}

/* =========================
   HERO PRODUCT HOVER EFFECT
   ========================= */

.hero-v4-main-card,
.hero-v4-float,
.hero-product-note{
    transition:
        transform .45s cubic-bezier(.22,.61,.36,1),
        box-shadow .45s ease,
        border-color .45s ease;
    will-change:transform;
}

/* Images animate smoothly */
.hero-v4-main-card img,
.hero-v4-float img{
    transition:
        transform .65s cubic-bezier(.22,.61,.36,1),
        filter .45s ease;
}

/* MAIN SALMON CARD */
.hero-v4-main-card:hover{
    transform:translateY(-14px) rotate(0deg) scale(1.025);
    box-shadow:0 45px 100px rgba(0,0,0,.38);
    border-color:rgba(255,255,255,.45);
    z-index:10;
}

.hero-v4-main-card:hover img{
    transform:scale(1.07);
    filter:brightness(1.05) saturate(1.06);
}


/* SHRIMP CARD */
.hero-v4-float.card-a:hover{
    transform:translateY(-12px) rotate(-2deg) scale(1.05);
    box-shadow:0 35px 80px rgba(0,0,0,.34);
    border-color:rgba(255,255,255,.45);
    z-index:12;
}

.hero-v4-float.card-a:hover img{
    transform:scale(1.09);
    filter:brightness(1.05) saturate(1.08);
}


/* LOBSTER CARD */
.hero-v4-float.card-b:hover{
    transform:translateY(-12px) rotate(2deg) scale(1.05);
    box-shadow:0 35px 80px rgba(0,0,0,.34);
    border-color:rgba(255,255,255,.45);
    z-index:12;
}

.hero-v4-float.card-b:hover img{
    transform:scale(1.09);
    filter:brightness(1.05) saturate(1.08);
}


/* PRODUCT INFORMATION NOTE */
.hero-product-note:hover{
    transform:translateY(-8px) scale(1.035);
    background:rgba(4,31,47,.88);
    border-color:rgba(223,187,98,.55);
    box-shadow:0 25px 60px rgba(0,0,0,.28);
}
.hero-v4-ring {
  position: absolute;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 50%;
}

.ring-one {
  width: 390px;
  height: 390px;
  top: 0;
  left: 6%;
}

.ring-two {
  width: 250px;
  height: 250px;
  right: 10%;
  bottom: 10%;
}

.hero-v4-wave {
  position: absolute;
  left: -6%;
  right: -6%;
  bottom: -72px;
  height: 145px;
  border-radius: 50% 50% 0 0 / 100% 100% 0 0;
  background: #fff;
}

.intro-v4-grid {
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  gap: 70px;
  align-items: center;
}

.intro-v4-copy > p {
  margin-bottom: 18px;
  color: var(--muted);
  font-size: 17px;
}

.carousel-v4 {
  overflow: hidden;
}

.carousel-v4-track {
  display: grid;
  grid-template-columns: repeat(4, 100%);
  transition: transform .55s ease;
}

.carousel-v4-slide {
  position: relative;
  overflow: hidden;
  height: 560px;
  border-radius: 32px;
  background: var(--mist);
  box-shadow: var(--shadow);
}

.carousel-v4-slide > span {
  position: absolute;
  z-index: 3;
  top: 20px;
  left: 20px;
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: rgba(6,31,47,.82);
  color: #fff;
  font-weight: 900;
}

.carousel-v4-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.carousel-v4-slide::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 58%, rgba(5,31,47,.72));
}

.carousel-v4-slide strong {
  position: absolute;
  z-index: 2;
  left: 28px;
  bottom: 24px;
  color: #fff;
  font-size: 26px;
}

.carousel-v4-controls {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 12px;
  margin-top: 18px;
}

.carousel-v4-controls button {
  width: 42px;
  height: 42px;
  border: 0;
  border-radius: 50%;
  background: var(--navy);
  color: #fff;
  cursor: pointer;
}

.carousel-v4-controls span {
  min-width: 62px;
  color: var(--muted);
  text-align: center;
  font-weight: 750;
}

.stats-v4 {
  position: relative;
  overflow: hidden;
  padding: 90px 0;
  color: #fff;
  background:
    linear-gradient(rgba(5,31,47,.78), rgba(5,31,47,.78)),
    url("../images/internet/salmon.jpg") center/cover no-repeat;
}

.stats-v4::before,
.stats-v4::after {
  content: "";
  position: absolute;
  left: -6%;
  right: -6%;
  height: 90px;
  background: #fff;
  border-radius: 50%;
}

.stats-v4::before {
  top: -62px;
}

.stats-v4::after {
  bottom: -62px;
}

.stats-v4-grid {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}

.stat-v4 {
  padding: 30px;
  text-align: center;
  border-right: 1px solid rgba(255,255,255,.18);
}

.stat-v4:last-child {
  border-right: 0;
}

.stat-v4 strong {
  display: block;
  font-size: clamp(27px, 3.6vw, 48px);
}

.stat-v4 span {
  display: block;
  margin-top: 5px;
  color: #c8d8df;
  font-size: 13px;
  letter-spacing: 1.2px;
  text-transform: uppercase;
}

.why-v4-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.why-v4-card {
  padding: 38px 30px;
  border: 1px solid var(--line);
  border-radius: 28px;
  background: #fff;
  text-align: center;
  box-shadow: 0 18px 48px rgba(7,38,57,.08);
}

.why-v4-icon {
  display: grid;
  place-items: center;
  width: 78px;
  height: 78px;
  margin: 0 auto 20px;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: var(--mist);
  color: var(--navy);
  font-family: Georgia, serif;
  font-size: 30px;
  font-weight: 700;
}

.why-v4-card h3 {
  margin-bottom: 10px;
  color: var(--navy);
  font-size: 24px;
}

.why-v4-card p {
  color: var(--muted);
}

.products-v4-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.product-v4-card {
  overflow: hidden;
  border-radius: 26px;
  background: #fff;
  box-shadow: 0 20px 55px rgba(7,38,57,.10);
}

.product-v4-card img {
  width: 100%;
  height: 330px;
  object-fit: cover;
}

.product-v4-card div {
  padding: 22px;
}

.product-v4-card small {
  color: var(--gold);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.product-v4-card h3 {
  margin-top: 4px;
  color: var(--navy);
  font-size: 23px;
}
/* ==============================
   PRODUCT RANGE CARD HOVER EFFECT
   ============================== */

.product-v4-card{
    position:relative;
    overflow:hidden;

    transition:
        transform .45s cubic-bezier(.22,.61,.36,1),
        box-shadow .45s ease,
        border-color .45s ease;

    will-change:transform;
    cursor:pointer;
}

.product-v4-card img{
    transition:
        transform .65s cubic-bezier(.22,.61,.36,1),
        filter .45s ease;
}

/* Card hover */
.product-v4-card:hover{
    transform:translateY(-12px) scale(1.025);
    box-shadow:0 32px 75px rgba(7,38,57,.20);
    z-index:5;
}

/* Image zoom */
.product-v4-card:hover img{
    transform:scale(1.08);
    filter:brightness(1.04) saturate(1.08);
}

/* Product text */
.product-v4-card h3{
    transition:
        transform .35s ease,
        color .35s ease;
}

.product-v4-card small{
    transition:
        letter-spacing .35s ease,
        color .35s ease;
}

.product-v4-card:hover h3{
    transform:translateX(5px);
}

.product-v4-card:hover small{
    letter-spacing:1.7px;
}

/* Premium light sweep */
.product-v4-card::after{
    content:"";
    position:absolute;
    top:0;
    left:-120%;
    width:70%;
    height:100%;

    background:linear-gradient(
        110deg,
        transparent,
        rgba(255,255,255,.18),
        transparent
    );

    transform:skewX(-20deg);
    transition:left .7s ease;
    pointer-events:none;
}

.product-v4-card:hover::after{
    left:140%;
}

.brand-v4 {
  position: relative;
  overflow: hidden;
  padding: 120px 0 110px;
  color: #fff;
  background:
    radial-gradient(circle at 20% 20%, rgba(81,144,170,.22), transparent 28%),
    linear-gradient(120deg, #051f30, #0d3c56);
}

.brand-v4-grid {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: 80px;
  align-items: center;
}

.brand-v4-logo {
  padding: 35px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 34px;
  background: rgba(255,255,255,.08);
  box-shadow: 0 28px 70px rgba(0,0,0,.20);
}

.brand-v4-logo img {
  width: 100%;
}

.brand-v4-copy small {
  color: var(--gold);
  font-weight: 900;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.brand-v4-copy h2 {
  margin: 12px 0 18px;
  font-size: clamp(38px, 5vw, 65px);
  line-height: 1.08;
}

.brand-v4-copy p {
  max-width: 680px;
  margin-bottom: 26px;
  color: #c4d4dc;
  font-size: 17px;
}

.cta-v4 small {
  color: var(--gold);
  font-weight: 900;
  letter-spacing: 2px;
  text-transform: uppercase;
}

@media (max-width: 1050px) {
  .hero-v4-grid,
  .intro-v4-grid,
  .brand-v4-grid {
    grid-template-columns: 1fr;
  }

  .hero-v4-stage {
    width: min(760px, 100%);
    margin-inline: auto;
  }

  .products-v4-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 720px) {
  .hero-v4 {
    min-height: auto;
  }

  .hero-v4-grid {
    gap: 45px;
    padding: 135px 0 145px;
  }

  .hero-v4-copy h1 {
    font-size: clamp(48px, 15vw, 70px);
    letter-spacing: -2.5px;
  }

  .hero-v4-copy h1 span {
    letter-spacing: 4px;
  }

  .hero-v4-stage {
    min-height: 500px;
  }

  .hero-v4-main-card {
    width: 82%;
    height: 330px;
  }

  .hero-v4-float {
    width: 48%;
    height: 190px;
  }

  .card-a {
    top: 245px;
  }

  .carousel-v4-slide {
    height: 430px;
  }

  .stats-v4-grid,
  .why-v4-grid,
  .products-v4-grid {
    grid-template-columns: 1fr;
  }

  .stat-v4 {
    border-right: 0;
    border-bottom: 1px solid rgba(255,255,255,.18);
  }

  .stat-v4:last-child {
    border-bottom: 0;
  }
}


/* =========================================================
   V4.1 PREMIUM INNER PAGES
   ========================================================= */

.inner-hero {
  position: relative;
  min-height: 760px;
  overflow: hidden;
  color: #fff;
  background:
    radial-gradient(circle at 82% 22%, rgba(100,165,190,.30), transparent 28%),
    linear-gradient(118deg, #041b2a 0%, #0a2f46 58%, #1c617c 100%);
}

.inner-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .20;
  background:
    repeating-linear-gradient(120deg, transparent 0 55px, rgba(255,255,255,.025) 56px 57px);
}

.inner-hero-watermark {
  position: absolute;
  right: -30px;
  top: 105px;
  color: rgba(255,255,255,.035);
  font-family: Georgia, serif;
  font-size: clamp(140px, 17vw, 300px);
  letter-spacing: 18px;
  white-space: nowrap;
}

.inner-hero-grid {
  position: relative;
  z-index: 3;
  display: grid;
  grid-template-columns: .92fr 1.08fr;
  gap: 75px;
  align-items: center;
  padding: 155px 0 145px;
}

.inner-hero-copy h1 {
  margin: 20px 0 24px;
  font-size: clamp(52px, 7vw, 90px);
  line-height: .99;
  letter-spacing: -4px;
}

.inner-hero-copy p {
  max-width: 670px;
  color: #d1dfe6;
  font-size: 18px;
}

.inner-hero-media {
  position: relative;
  min-height: 500px;
}

.inner-main-photo,
.inner-floating-photo {
  position: absolute;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.22);
  background: rgba(255,255,255,.10);
  box-shadow: 0 34px 85px rgba(0,0,0,.28);
  backdrop-filter: blur(10px);
}

.inner-main-photo {
  width: 76%;
  height: 410px;
  right: 0;
  top: 15px;
  border-radius: 36px;
  transform: rotate(2deg);
}

.inner-floating-photo {
  width: 42%;
  height: 215px;
  left: 0;
  border-radius: 26px;
  transform: rotate(-5deg);
}
/* ==================================
   PRODUCTS HERO MEDIA HOVER EFFECT
   ================================== */

.products-hero-media .inner-main-photo,
.products-hero-media .inner-floating-photo,
.products-hero-media .inner-label{
    transition:
        transform .45s cubic-bezier(.22,.61,.36,1),
        box-shadow .45s ease,
        border-color .45s ease;

    will-change:transform;
}

/* Image animation */
.products-hero-media .inner-main-photo img,
.products-hero-media .inner-floating-photo img{
    transition:
        transform .65s cubic-bezier(.22,.61,.36,1),
        filter .45s ease;
}

/* Main salmon photo */
.products-hero-media .inner-main-photo:hover{
    transform:
        translateY(-12px)
        scale(1.025);

    box-shadow:0 42px 95px rgba(0,0,0,.36);
    border-color:rgba(255,255,255,.45);
    z-index:10;
}

.products-hero-media .inner-main-photo:hover img{
    transform:scale(1.07);
    filter:brightness(1.05) saturate(1.08);
}

/* Floating lobster photo */
.products-hero-media .inner-floating-photo:hover{
    transform:
        translateY(-10px)
        rotate(2deg)
        scale(1.05);

    box-shadow:0 32px 75px rgba(0,0,0,.34);
    border-color:rgba(255,255,255,.45);
    z-index:12;
}

.products-hero-media .inner-floating-photo:hover img{
    transform:scale(1.09);
    filter:brightness(1.05) saturate(1.08);
}

/* Fresh / Frozen label */
.products-hero-media .inner-label:hover{
    transform:
        translateY(-7px)
        scale(1.035);

    background:rgba(4,31,47,.90);
    border-color:rgba(223,187,98,.55);
    box-shadow:0 24px 55px rgba(0,0,0,.28);
    z-index:15;
}
/* ==================================
   ABOUT HERO IMAGE HOVER EFFECT
   ================================== */

.about-hero-media .inner-main-photo,
.about-hero-media .inner-floating-photo,
.about-hero-media .inner-label{
    transition:
        transform .45s cubic-bezier(.22,.61,.36,1),
        box-shadow .45s ease,
        border-color .45s ease;
    will-change:transform;
}

/* Image transitions */
.about-hero-media .inner-main-photo img,
.about-hero-media .inner-floating-photo img{
    transition:
        transform .65s cubic-bezier(.22,.61,.36,1),
        filter .45s ease;
}

/* Main sea bream image */
.about-hero-media .inner-main-photo:hover{
    transform:
        translateY(-12px)
        rotate(0deg)
        scale(1.025);

    box-shadow:0 42px 95px rgba(0,0,0,.36);
    border-color:rgba(255,255,255,.45);
    z-index:10;
}

.about-hero-media .inner-main-photo:hover img{
    transform:scale(1.07);
    filter:brightness(1.05) saturate(1.08);
}

/* Floating shrimp image */
.about-hero-media .inner-floating-photo:hover{
    transform:
        translateY(-10px)
        rotate(-2deg)
        scale(1.05);

    box-shadow:0 32px 75px rgba(0,0,0,.34);
    border-color:rgba(255,255,255,.45);
    z-index:12;
}

.about-hero-media .inner-floating-photo:hover img{
    transform:scale(1.09);
    filter:brightness(1.05) saturate(1.08);
}

/* India UAE information label */
.about-hero-media .inner-label:hover{
    transform:
        translateY(-7px)
        scale(1.035);

    background:rgba(4,31,47,.90);
    border-color:rgba(223,187,98,.55);
    box-shadow:0 24px 55px rgba(0,0,0,.28);
    z-index:15;
}
.floating-bottom {
  bottom: 0;
}

.floating-top {
  top: 270px;
}

.inner-main-photo img,
.inner-floating-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.inner-label {
  position: absolute;
  z-index: 5;
  left: 5%;
  top: 28px;
  width: 250px;
  padding: 18px 20px;
  border: 1px solid rgba(255,255,255,.17);
  border-radius: 17px;
  background: rgba(4,31,47,.70);
  backdrop-filter: blur(12px);
}

.inner-label strong,
.inner-label small {
  display: block;
}

.inner-label strong {
  color: var(--gold);
  font-size: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.inner-label small {
  margin-top: 5px;
  color: #c7d7df;
}

.inner-hero-wave {
  position: absolute;
  left: -7%;
  right: -7%;
  bottom: -70px;
  height: 145px;
  border-radius: 50% 50% 0 0 / 100% 100% 0 0;
  background: #fff;
}

/* ABOUT */
.editorial-v41 {
  display: grid;
  grid-template-columns: 120px 1fr .85fr;
  gap: 45px;
  align-items: center;
}

.editorial-v41-number {
  color: var(--mist);
  font-family: Georgia, serif;
  font-size: 110px;
  line-height: 1;
}

.editorial-v41-copy > p {
  margin-bottom: 18px;
  color: var(--muted);
  font-size: 17px;
}

.editorial-v41-visual {
  overflow: hidden;
  height: 540px;
  border-radius: 32px;
  box-shadow: var(--shadow);
}
/* ==================================
   ABOUT EDITORIAL IMAGE HOVER EFFECT
   ================================== */

.editorial-v41-visual{
    position:relative;
    overflow:hidden;

    transition:
        transform .45s cubic-bezier(.22,.61,.36,1),
        box-shadow .45s ease;

    will-change:transform;
}

.editorial-v41-visual img{
    transition:
        transform .7s cubic-bezier(.22,.61,.36,1),
        filter .45s ease;
}

/* Card lift */
.editorial-v41-visual:hover{
    transform:
        translateY(-12px)
        scale(1.025);

    box-shadow:
        0 38px 85px rgba(7,38,57,.22);
}

/* Image zoom */
.editorial-v41-visual:hover img{
    transform:scale(1.08);
    filter:
        brightness(1.04)
        saturate(1.08);
}

/* Premium light sweep */
.editorial-v41-visual::after{
    content:"";
    position:absolute;
    top:0;
    left:-120%;
    width:65%;
    height:100%;

    background:linear-gradient(
        110deg,
        transparent,
        rgba(255,255,255,.18),
        transparent
    );

    transform:skewX(-20deg);

    transition:left .75s ease;

    pointer-events:none;
}

.editorial-v41-visual:hover::after{
    left:145%;
}
.editorial-v41-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.about-principles {
  padding: 85px 0;
  background: var(--navy);
  color: #fff;
}

.principles-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
}

.principle-card {
  padding: 35px;
  border-right: 1px solid rgba(255,255,255,.15);
}

.principle-card:last-child {
  border-right: 0;
}

.principle-card > span {
  color: var(--gold);
  font-weight: 900;
  letter-spacing: 1.8px;
  text-transform: uppercase;
}

.principle-card h3 {
  margin: 10px 0 14px;
  font-size: 28px;
}

.principle-card p {
  color: #c5d5dc;
}

.about-values-grid {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 70px;
  align-items: center;
}

.about-value-list {
  display: grid;
  gap: 16px;
}

.about-value-list > div {
  display: grid;
  grid-template-columns: 50px 1fr;
  gap: 16px;
  align-items: start;
  padding: 20px 0;
  border-bottom: 1px solid var(--line);
}

.about-value-list b {
  color: var(--gold);
  font-size: 18px;
}

.about-value-list span {
  color: var(--muted);
}

.about-value-list strong {
  display: block;
  margin-bottom: 3px;
  color: var(--navy);
}

.about-values-media {
  position: relative;
  overflow: hidden;
  height: 590px;
  border-radius: 34px;
  box-shadow: var(--shadow);
}

.about-values-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* ==================================
   ABOUT VALUES LOBSTER HOVER EFFECT
   ================================== */

.about-values-media{
    position:relative;
    overflow:hidden;

    transition:
        transform .45s cubic-bezier(.22,.61,.36,1),
        box-shadow .45s ease;

    will-change:transform;
}

.about-values-media img{
    transition:
        transform .7s cubic-bezier(.22,.61,.36,1),
        filter .45s ease;
}

/* Lift entire card */
.about-values-media:hover{
    transform:translateY(-12px) scale(1.025);

    box-shadow:
        0 40px 90px rgba(7,38,57,.24);
}

/* Zoom lobster image */
.about-values-media:hover img{
    transform:scale(1.08);

    filter:
        brightness(1.04)
        saturate(1.08);
}

/* Caption animation */
.about-values-caption{
    transition:
        transform .45s ease,
        opacity .45s ease;
}

.about-values-media:hover .about-values-caption{
    transform:translateY(-8px);
}

/* Premium light sweep */
.about-values-media::before{
    content:"";
    position:absolute;
    z-index:3;

    top:0;
    left:-120%;

    width:65%;
    height:100%;

    background:linear-gradient(
        110deg,
        transparent,
        rgba(255,255,255,.16),
        transparent
    );

    transform:skewX(-20deg);

    transition:left .8s ease;

    pointer-events:none;
}

.about-values-media:hover::before{
    left:145%;
}
.about-values-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 52%, rgba(5,31,47,.75));
}

.about-values-caption {
  position: absolute;
  z-index: 2;
  left: 28px;
  right: 28px;
  bottom: 26px;
  color: #fff;
}

.about-values-caption small {
  color: var(--gold);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 1.5px;
}

.about-values-caption strong {
  display: block;
  margin-top: 5px;
  font-size: 24px;
}

/* PRODUCTS */
.product-filter {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-bottom: 38px;
}

.product-filter button {
  padding: 11px 17px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--navy);
  font-weight: 800;
  cursor: pointer;
}

.product-filter button.is-active {
  background: var(--navy);
  color: #fff;
  border-color: var(--navy);
}

.catalogue-v41-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

.catalogue-v41-card {
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  min-height: 330px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 30px;
  background: #fff;
  box-shadow: 0 18px 52px rgba(7,38,57,.09);
  transition: opacity .25s ease, transform .25s ease;
}

.catalogue-v41-card.is-hidden {
  display: none;
}

.catalogue-v41-image {
  min-height: 330px;
  background: var(--mist);
}

.catalogue-v41-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.catalogue-v41-card > div:last-child {
  padding: 30px;
}

.catalogue-v41-card small {
  color: var(--gold);
  font-weight: 900;
  letter-spacing: 1.3px;
  text-transform: uppercase;
}

.catalogue-v41-card h3 {
  margin: 6px 0 12px;
  color: var(--navy);
  font-size: 25px;
}

.catalogue-v41-card p {
  color: var(--muted);
}

.catalogue-placeholder {
  display: grid;
  place-items: center;
  color: #fff;
  background:
    radial-gradient(circle at 70% 30%, rgba(114,177,199,.38), transparent 30%),
    linear-gradient(135deg, #0d354d, #1d6884);
}

.value-placeholder {
  background:
    radial-gradient(circle at 25% 70%, rgba(223,187,98,.28), transparent 32%),
    linear-gradient(135deg, #102f43, #345f74);
}

.catalogue-placeholder span {
  font-family: Georgia, serif;
  font-size: 34px;
  font-style: italic;
}

.product-spec-band {
  padding: 90px 0;
  color: #fff;
  background:
    radial-gradient(circle at 85% 20%, rgba(104,168,193,.24), transparent 28%),
    linear-gradient(120deg, #061f30, #0d3d57);
}

.product-spec-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 65px;
  align-items: center;
}

.product-spec-grid small {
  color: var(--gold);
  font-weight: 900;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

.product-spec-grid h2 {
  margin-top: 8px;
  font-size: clamp(38px, 5vw, 62px);
  line-height: 1.08;
}

.product-spec-points {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

.product-spec-points span {
  padding: 18px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 17px;
  background: rgba(255,255,255,.06);
  text-align: center;
  font-weight: 750;
}

.brochure-v41-grid {
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  gap: 70px;
  align-items: center;
}

.brochure-v41-media {
  overflow: hidden;
  border-radius: 32px;
  box-shadow: var(--shadow);
}

.brochure-v41-media img {
  width: 100%;
}

/* QUALITY */
.process-v41 {
  display: grid;
  gap: 18px;
}

.process-v41-step {
  display: grid;
  grid-template-columns: 84px 1fr;
  gap: 24px;
  align-items: start;
  padding: 28px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: #fff;
}

.process-v41-step b {
  display: grid;
  place-items: center;
  width: 62px;
  height: 62px;
  border-radius: 50%;
  background: var(--mist);
  color: var(--navy);
  font-size: 20px;
}

.process-v41-step small {
  color: var(--gold);
  font-weight: 900;
  letter-spacing: 1.3px;
  text-transform: uppercase;
}

.process-v41-step h3 {
  margin: 3px 0 8px;
  color: var(--navy);
  font-size: 24px;
}

.process-v41-step p {
  color: var(--muted);
}

.quality-feature-band {
  padding: 105px 0;
  color: #fff;
  background:
    radial-gradient(circle at 18% 20%, rgba(100,165,190,.23), transparent 28%),
    linear-gradient(120deg, #061f30, #0d3e58);
}

.quality-feature-grid {
  display: grid;
  grid-template-columns: .95fr 1.05fr;
  gap: 75px;
  align-items: center;
}

.quality-feature-media {
  overflow: hidden;
  height: 570px;
  border-radius: 34px;
  box-shadow: 0 28px 70px rgba(0,0,0,.25);
}

.quality-feature-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.quality-feature-copy small {
  color: var(--gold);
  font-weight: 900;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

.quality-feature-copy h2 {
  margin: 10px 0 18px;
  font-size: clamp(40px, 5vw, 65px);
  line-height: 1.08;
}

.quality-feature-copy p {
  color: #c5d5dc;
  font-size: 17px;
}

.quality-feature-copy ul {
  display: grid;
  gap: 13px;
  margin-top: 25px;
}

.quality-feature-copy li {
  list-style: none;
  padding: 14px 17px;
  border-left: 3px solid var(--gold);
  background: rgba(255,255,255,.06);
}

.quality-priority-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}

.quality-priority {
  padding: 30px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: #fff;
}

.quality-priority span {
  color: var(--navy);
  font-family: Georgia, serif;
  font-size: 27px;
}

.quality-priority p {
  margin-top: 10px;
  color: var(--muted);
}

/* CONTACT */
.contact-hero-card {
  position: absolute;
  z-index: 5;
  left: 0;
  bottom: 18px;
  width: 330px;
  padding: 22px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 20px;
  background: rgba(4,31,47,.76);
  backdrop-filter: blur(12px);
}

.contact-hero-card small,
.contact-hero-card a {
  display: block;
}

.contact-hero-card small {
  color: var(--gold);
  font-weight: 900;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

.contact-hero-card a {
  margin-top: 7px;
  color: #fff;
  font-weight: 800;
}

.contact-v41-grid {
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  gap: 36px;
  align-items: start;
}

.contact-v41-info,
.contact-v41-form {
  padding: 36px;
  border: 1px solid var(--line);
  border-radius: 30px;
  background: #fff;
  box-shadow: var(--shadow);
}

.contact-v41-items {
  display: grid;
}

.contact-v41-items article {
  padding: 18px 0;
  border-bottom: 1px solid var(--line);
}

.contact-v41-items span,
.contact-v41-items strong,
.contact-v41-items a {
  display: block;
}

.contact-v41-items span {
  color: var(--gold);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 1.3px;
  text-transform: uppercase;
}

.contact-v41-items strong,
.contact-v41-items a {
  margin-top: 5px;
  color: var(--navy);
  font-weight: 800;
}

.form-v41-head small {
  color: var(--gold);
  font-weight: 900;
  letter-spacing: 1.4px;
  text-transform: uppercase;
}

.form-v41-head h2 {
  margin: 7px 0 10px;
  color: var(--navy);
  font-size: 42px;
  line-height: 1.08;
}

.form-v41-head p {
  margin-bottom: 25px;
  color: var(--muted);
}

.contact-location-band {
  padding: 92px 0;
  color: #fff;
  background:
    radial-gradient(circle at 78% 38%, rgba(106,172,198,.25), transparent 26%),
    linear-gradient(120deg, #061f30, #0d3e58);
}

.contact-location-grid {
  display: grid;
  grid-template-columns: 1fr .8fr;
  gap: 65px;
  align-items: center;
}

.contact-location-grid small {
  color: var(--gold);
  font-weight: 900;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

.contact-location-grid h2 {
  margin-top: 8px;
  font-size: clamp(40px, 5vw, 64px);
  line-height: 1.08;
}

.contact-location-mark {
  text-align: center;
}

.contact-location-mark span,
.contact-location-mark strong,
.contact-location-mark small {
  display: block;
}

.contact-location-mark span {
  color: #d2e1e7;
  font-size: 18px;
  letter-spacing: 5px;
  text-transform: uppercase;
}

.contact-location-mark strong {
  font-family: Georgia, serif;
  font-size: 105px;
  line-height: .9;
}

.contact-location-mark small {
  margin-top: 15px;
  color: #c2d2da;
}

.contact-support-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}

.contact-support-grid article {
  padding: 28px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: #fff;
  text-align: center;
}

.contact-support-grid b {
  display: block;
  margin-bottom: 8px;
  color: var(--gold);
  font-size: 20px;
}

.contact-support-grid span {
  color: var(--navy);
  font-weight: 800;
}

/* SHARED INNER CTA */
.inner-cta {
  padding: 100px 0;
  color: #fff;
  text-align: center;
  background:
    radial-gradient(circle at 50% 0, rgba(110,173,198,.25), transparent 35%),
    linear-gradient(120deg, #061f30, #0d3e58);
}

.inner-cta small {
  color: var(--gold);
  font-weight: 900;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

.inner-cta h2 {
  max-width: 900px;
  margin: 10px auto 0;
  font-size: clamp(40px, 5vw, 65px);
  line-height: 1.08;
}

@media (max-width: 1050px) {
  .inner-hero-grid,
  .editorial-v41,
  .about-values-grid,
  .product-spec-grid,
  .brochure-v41-grid,
  .quality-feature-grid,
  .contact-v41-grid,
  .contact-location-grid {
    grid-template-columns: 1fr;
  }

  .inner-hero-media {
    width: min(760px, 100%);
    margin-inline: auto;
  }

  .editorial-v41-number {
    display: none;
  }

  .principles-grid,
  .quality-priority-grid,
  .contact-support-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .catalogue-v41-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .inner-hero {
    min-height: auto;
  }

  .inner-hero-grid {
    gap: 45px;
    padding: 135px 0 145px;
  }

  .inner-hero-copy h1 {
    font-size: clamp(46px, 15vw, 68px);
    letter-spacing: -2.5px;
  }

  .inner-hero-media {
    min-height: 455px;
  }

  .inner-main-photo {
    width: 82%;
    height: 310px;
  }

  .inner-floating-photo {
    width: 50%;
    height: 180px;
  }

  .floating-top {
    top: 230px;
  }

  .inner-label {
    width: 210px;
  }

  .principles-grid,
  .quality-priority-grid,
  .contact-support-grid,
  .product-spec-points {
    grid-template-columns: 1fr;
  }

  .principle-card {
    border-right: 0;
    border-bottom: 1px solid rgba(255,255,255,.15);
  }

  .principle-card:last-child {
    border-bottom: 0;
  }

  .catalogue-v41-card {
    grid-template-columns: 1fr;
  }

  .catalogue-v41-image {
    min-height: 260px;
  }

  .quality-feature-media,
  .about-values-media,
  .editorial-v41-visual {
    height: 430px;
  }

  .contact-location-mark strong {
    font-size: 78px;
  }
}

/* =========================================================
   PRODUCT CATALOGUE PREMIUM HOVER EFFECT
   Added without removing or changing existing CSS
   ========================================================= */

.catalogue-v41-card{
    position:relative;
    overflow:hidden;
    transition:
        transform .45s cubic-bezier(.22,.61,.36,1),
        box-shadow .45s ease,
        border-color .45s ease;
    will-change:transform;
}

.catalogue-v41-image{
    overflow:hidden;
}

.catalogue-v41-image img{
    transition:
        transform .7s cubic-bezier(.22,.61,.36,1),
        filter .45s ease;
}

.catalogue-v41-card:hover{
    transform:translateY(-10px) scale(1.018);
    box-shadow:0 30px 70px rgba(7,38,57,.17);
    z-index:5;
}

.catalogue-v41-card:hover .catalogue-v41-image img{
    transform:scale(1.08);
    filter:brightness(1.04) saturate(1.08);
}

.catalogue-v41-card h3{
    transition:
        transform .35s ease,
        color .35s ease;
}

.catalogue-v41-card:hover h3{
    transform:translateX(5px);
}

.catalogue-v41-card > div > small{
    transition:
        letter-spacing .35s ease,
        color .35s ease;
}

.catalogue-v41-card:hover > div > small{
    letter-spacing:1.4px;
}

.catalogue-v41-card .tags span{
    transition:
        transform .3s ease,
        background .3s ease,
        border-color .3s ease;
}

.catalogue-v41-card:hover .tags span{
    transform:translateY(-2px);
}

.catalogue-v41-card::after{
    content:"";
    position:absolute;
    top:0;
    left:-120%;
    width:55%;
    height:100%;
    background:linear-gradient(
        110deg,
        transparent,
        rgba(255,255,255,.15),
        transparent
    );
    transform:skewX(-20deg);
    transition:left .75s ease;
    pointer-events:none;
    z-index:4;
}

.catalogue-v41-card:hover::after{
    left:145%;
}

/* Keep hover motion comfortable on touch devices / reduced-motion systems */
@media (prefers-reduced-motion: reduce){
    .hero-v4-main-card,
    .hero-v4-float,
    .hero-product-note,
    .product-v4-card,
    .products-hero-media .inner-main-photo,
    .products-hero-media .inner-floating-photo,
    .products-hero-media .inner-label,
    .about-hero-media .inner-main-photo,
    .about-hero-media .inner-floating-photo,
    .about-hero-media .inner-label,
    .editorial-v41-visual,
    .about-values-media,
    .catalogue-v41-card,
    .catalogue-v41-card img{
        transition:none !important;
    }
}

/* =========================================================
   ABOUT + CONTACT PAGE PREMIUM ANIMATIONS
   Added after all existing CSS. Existing rules are preserved.
   ========================================================= */

/* ---------- ABOUT: principle cards ---------- */
.principle-card{
    position:relative;
    overflow:hidden;
    transition:
        transform .4s cubic-bezier(.22,.61,.36,1),
        background .4s ease,
        box-shadow .4s ease,
        border-color .4s ease;
}

.principle-card h3,
.principle-card p,
.principle-card > span{
    transition:
        transform .35s ease,
        color .35s ease,
        letter-spacing .35s ease;
}

.principle-card::before{
    content:"";
    position:absolute;
    top:0;
    left:-120%;
    width:55%;
    height:100%;
    background:linear-gradient(
        110deg,
        transparent,
        rgba(255,255,255,.08),
        transparent
    );
    transform:skewX(-20deg);
    transition:left .7s ease;
    pointer-events:none;
}

/* ---------- ABOUT: value list ---------- */
.about-value-list > div{
    position:relative;
    transition:
        transform .35s cubic-bezier(.22,.61,.36,1),
        padding-left .35s ease,
        background .35s ease,
        border-color .35s ease;
}

.about-value-list b,
.about-value-list strong,
.about-value-list span{
    transition:
        transform .35s ease,
        color .35s ease;
}

/* ---------- ABOUT: editorial number ---------- */
.editorial-v41-number{
    transition:
        transform .5s cubic-bezier(.22,.61,.36,1),
        color .5s ease;
}

/* ---------- CONTACT: hero information card ---------- */
.contact-hero-card{
    transition:
        transform .45s cubic-bezier(.22,.61,.36,1),
        box-shadow .45s ease,
        border-color .45s ease,
        background .45s ease;
    will-change:transform;
}

.contact-hero-card small,
.contact-hero-card a{
    transition:
        transform .35s ease,
        color .35s ease,
        letter-spacing .35s ease;
}

/* ---------- CONTACT: main info + enquiry panels ---------- */
.contact-v41-info,
.contact-v41-form{
    position:relative;
    overflow:hidden;
    transition:
        transform .45s cubic-bezier(.22,.61,.36,1),
        box-shadow .45s ease,
        border-color .45s ease;
    will-change:transform;
}

.contact-v41-info::before,
.contact-v41-form::before{
    content:"";
    position:absolute;
    top:0;
    left:-125%;
    width:55%;
    height:100%;
    background:linear-gradient(
        110deg,
        transparent,
        rgba(255,255,255,.65),
        transparent
    );
    transform:skewX(-20deg);
    transition:left .85s ease;
    pointer-events:none;
    z-index:1;
}

.contact-v41-info > *,
.contact-v41-form > *{
    position:relative;
    z-index:2;
}

/* ---------- CONTACT: individual details ---------- */
.contact-v41-items article{
    position:relative;
    transition:
        transform .35s cubic-bezier(.22,.61,.36,1),
        padding-left .35s ease,
        background .35s ease,
        border-color .35s ease;
}

.contact-v41-items article::before{
    content:"";
    position:absolute;
    left:0;
    top:50%;
    width:3px;
    height:0;
    border-radius:999px;
    background:var(--gold);
    transform:translateY(-50%);
    transition:height .35s ease;
}

.contact-v41-items span,
.contact-v41-items strong,
.contact-v41-items a{
    transition:
        transform .35s ease,
        color .35s ease,
        letter-spacing .35s ease;
}

/* ---------- CONTACT: form fields ---------- */
.contact-v41-form .field{
    transition:transform .3s ease;
}

.contact-v41-form input,
.contact-v41-form textarea,
.contact-v41-form select{
    transition:
        transform .3s ease,
        border-color .3s ease,
        background .3s ease,
        box-shadow .3s ease;
}

.contact-v41-form input:focus,
.contact-v41-form textarea:focus,
.contact-v41-form select:focus{
    transform:translateY(-2px);
    background:#fff;
}

/* ---------- CONTACT: UAE location block ---------- */
.contact-location-band{
    position:relative;
    overflow:hidden;
}

.contact-location-band::after{
    content:"";
    position:absolute;
    width:420px;
    height:420px;
    right:-180px;
    top:-190px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:50%;
    transition:
        transform 1s cubic-bezier(.22,.61,.36,1),
        opacity .6s ease;
    pointer-events:none;
}

.contact-location-grid > div:first-child,
.contact-location-mark{
    position:relative;
    z-index:2;
}

.contact-location-mark{
    transition:
        transform .55s cubic-bezier(.22,.61,.36,1),
        filter .55s ease;
    will-change:transform;
}

.contact-location-mark span,
.contact-location-mark strong,
.contact-location-mark small{
    transition:
        transform .4s ease,
        color .4s ease,
        letter-spacing .4s ease;
}

/* ---------- CONTACT: support / requirement cards ---------- */
.contact-support-grid article{
    position:relative;
    overflow:hidden;
    transition:
        transform .4s cubic-bezier(.22,.61,.36,1),
        box-shadow .4s ease,
        border-color .4s ease,
        background .4s ease;
    will-change:transform;
}

.contact-support-grid article::after{
    content:"";
    position:absolute;
    top:0;
    left:-120%;
    width:60%;
    height:100%;
    background:linear-gradient(
        110deg,
        transparent,
        rgba(255,255,255,.75),
        transparent
    );
    transform:skewX(-20deg);
    transition:left .7s ease;
    pointer-events:none;
}

.contact-support-grid b,
.contact-support-grid span{
    position:relative;
    z-index:2;
    transition:
        transform .35s ease,
        color .35s ease;
}

/* Desktop/pointer hover effects */
@media (hover:hover) and (pointer:fine){

    /* ABOUT */
    .principle-card:hover{
        transform:translateY(-8px);
        background:rgba(255,255,255,.045);
        box-shadow:0 28px 65px rgba(0,0,0,.17);
        border-color:rgba(223,187,98,.28);
        z-index:3;
    }

    .principle-card:hover::before{
        left:145%;
    }

    .principle-card:hover > span{
        letter-spacing:2.4px;
    }

    .principle-card:hover h3{
        transform:translateY(-3px);
        color:#fff;
    }

    .principle-card:hover p{
        transform:translateY(-2px);
        color:#d9e6eb;
    }

    .about-value-list > div:hover{
        transform:translateX(8px);
        padding-left:14px;
        background:linear-gradient(90deg, rgba(223,187,98,.08), transparent 72%);
        border-color:rgba(223,187,98,.34);
    }

    .about-value-list > div:hover b{
        transform:scale(1.12);
    }

    .about-value-list > div:hover strong{
        transform:translateX(3px);
    }

    .editorial-v41:hover .editorial-v41-number{
        transform:translateY(-8px) scale(1.035);
        color:rgba(223,187,98,.28);
    }

    /* CONTACT HERO */
    .contact-hero-card:hover{
        transform:translateY(-10px) scale(1.025);
        background:rgba(4,31,47,.92);
        border-color:rgba(223,187,98,.48);
        box-shadow:0 32px 75px rgba(0,0,0,.32);
    }

    .contact-hero-card:hover small{
        letter-spacing:2px;
    }

    .contact-hero-card:hover a{
        transform:translateX(4px);
        color:#fff;
    }

    /* CONTACT MAIN PANELS */
    .contact-v41-info:hover,
    .contact-v41-form:hover{
        transform:translateY(-8px);
        border-color:rgba(11,43,64,.20);
        box-shadow:0 34px 85px rgba(7,38,57,.16);
    }

    .contact-v41-info:hover::before,
    .contact-v41-form:hover::before{
        left:145%;
    }

    .contact-v41-items article:hover{
        transform:translateX(6px);
        padding-left:13px;
        background:linear-gradient(90deg, rgba(234,243,247,.72), transparent);
    }

    .contact-v41-items article:hover::before{
        height:65%;
    }

    .contact-v41-items article:hover span{
        letter-spacing:1.7px;
    }

    .contact-v41-items article:hover strong,
    .contact-v41-items article:hover a{
        transform:translateX(3px);
    }

    .contact-v41-items article:hover a{
        color:var(--navy2);
    }

    /* LOCATION */
    .contact-location-band:hover::after{
        transform:scale(1.14) translate(-18px,18px);
        opacity:.75;
    }

    .contact-location-mark:hover{
        transform:translateY(-8px) scale(1.035);
        filter:drop-shadow(0 22px 30px rgba(0,0,0,.18));
    }

    .contact-location-mark:hover strong{
        transform:scale(1.04);
        color:#fff;
    }

    .contact-location-mark:hover span{
        letter-spacing:6px;
    }

    /* SUPPORT CARDS */
    .contact-support-grid article:hover{
        transform:translateY(-9px) scale(1.018);
        border-color:rgba(223,187,98,.38);
        box-shadow:0 26px 60px rgba(7,38,57,.14);
        background:#fff;
        z-index:4;
    }

    .contact-support-grid article:hover::after{
        left:145%;
    }

    .contact-support-grid article:hover b{
        transform:translateY(-3px) scale(1.08);
    }

    .contact-support-grid article:hover span{
        transform:translateY(-2px);
    }
}

/* Reduced motion accessibility */
@media (prefers-reduced-motion: reduce){
    .principle-card,
    .principle-card *,
    .about-value-list > div,
    .about-value-list > div *,
    .editorial-v41-number,
    .contact-hero-card,
    .contact-hero-card *,
    .contact-v41-info,
    .contact-v41-form,
    .contact-v41-items article,
    .contact-v41-items article *,
    .contact-v41-form .field,
    .contact-v41-form input,
    .contact-v41-form textarea,
    .contact-v41-form select,
    .contact-location-band::after,
    .contact-location-mark,
    .contact-location-mark *,
    .contact-support-grid article,
    .contact-support-grid article *{
        transition:none !important;
        animation:none !important;
    }
}

/* =========================================================
   ABOUT.HTML — COMPLETE IMAGE HOVER / MOTION ENHANCEMENTS
   Safe override block appended at the end of premium-v41.css
   ========================================================= */

/* General image rendering */
.inner-hero-about img,
.about-story img,
.about-values-media img,
.footer-brand img,
.header .brand img{
    -webkit-user-drag:none;
    user-select:none;
}

/* ---------- Header logo ---------- */
.header .brand{
    transition:transform .35s cubic-bezier(.22,.61,.36,1);
}

.header .brand img{
    transition:
        transform .45s cubic-bezier(.22,.61,.36,1),
        filter .35s ease;
}

@media (hover:hover) and (pointer:fine){
    .header .brand:hover{
        transform:translateY(-2px);
    }

    .header .brand:hover img{
        transform:scale(1.045);
    }
}

/* ---------- ABOUT HERO: main + floating seafood photos ---------- */
.about-hero-media .inner-main-photo,
.about-hero-media .inner-floating-photo{
    transform-style:preserve-3d;
    transform-origin:center;
    transition:
        transform .48s cubic-bezier(.22,.61,.36,1),
        box-shadow .48s ease,
        border-color .48s ease;
    will-change:transform;
}

.about-hero-media .inner-main-photo img,
.about-hero-media .inner-floating-photo img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:
        transform .75s cubic-bezier(.22,.61,.36,1),
        filter .5s ease;
}

/* light gloss */
.about-hero-media .inner-main-photo::before,
.about-hero-media .inner-floating-photo::before{
    content:"";
    position:absolute;
    z-index:3;
    top:0;
    left:-120%;
    width:65%;
    height:100%;
    background:linear-gradient(
        110deg,
        transparent,
        rgba(255,255,255,.17),
        transparent
    );
    transform:skewX(-20deg);
    transition:left .8s ease;
    pointer-events:none;
}

@media (hover:hover) and (pointer:fine){
    .about-hero-media .inner-main-photo:hover{
        transform:translateY(-12px) rotate(.5deg) scale(1.025);
        box-shadow:0 45px 100px rgba(0,0,0,.36);
        border-color:rgba(255,255,255,.46);
        z-index:12;
    }

    .about-hero-media .inner-main-photo:hover img{
        transform:scale(1.075);
        filter:brightness(1.05) saturate(1.08);
    }

    .about-hero-media .inner-main-photo:hover::before{
        left:145%;
    }

    .about-hero-media .inner-floating-photo:hover{
        transform:translateY(-11px) rotate(-2deg) scale(1.055);
        box-shadow:0 34px 82px rgba(0,0,0,.35);
        border-color:rgba(255,255,255,.46);
        z-index:14;
    }

    .about-hero-media .inner-floating-photo:hover img{
        transform:scale(1.095);
        filter:brightness(1.06) saturate(1.10);
    }

    .about-hero-media .inner-floating-photo:hover::before{
        left:145%;
    }
}

/* ---------- Hero India/UAE label ---------- */
.about-hero-media .inner-label{
    transition:
        transform .4s cubic-bezier(.22,.61,.36,1),
        background .4s ease,
        box-shadow .4s ease,
        border-color .4s ease;
    will-change:transform;
}

.about-hero-media .inner-label strong,
.about-hero-media .inner-label small{
    transition:
        transform .35s ease,
        letter-spacing .35s ease,
        color .35s ease;
}

@media (hover:hover) and (pointer:fine){
    .about-hero-media .inner-label:hover{
        transform:translateY(-8px) scale(1.035);
        background:rgba(4,31,47,.92);
        border-color:rgba(223,187,98,.56);
        box-shadow:0 26px 62px rgba(0,0,0,.30);
        z-index:16;
    }

    .about-hero-media .inner-label:hover strong{
        transform:translateY(-2px);
        letter-spacing:.7px;
    }
}

/* ---------- Story salmon image ---------- */
.editorial-v41-visual{
    position:relative;
    overflow:hidden;
    transform-style:preserve-3d;
    transition:
        transform .48s cubic-bezier(.22,.61,.36,1),
        box-shadow .48s ease;
    will-change:transform;
}

.editorial-v41-visual img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:
        transform .8s cubic-bezier(.22,.61,.36,1),
        filter .5s ease;
}

.editorial-v41-visual::after{
    content:"";
    position:absolute;
    z-index:3;
    top:0;
    left:-125%;
    width:65%;
    height:100%;
    background:linear-gradient(
        110deg,
        transparent,
        rgba(255,255,255,.18),
        transparent
    );
    transform:skewX(-20deg);
    transition:left .85s ease;
    pointer-events:none;
}

@media (hover:hover) and (pointer:fine){
    .editorial-v41-visual:hover{
        transform:translateY(-12px) scale(1.025);
        box-shadow:0 40px 90px rgba(7,38,57,.23);
    }

    .editorial-v41-visual:hover img{
        transform:scale(1.085);
        filter:brightness(1.04) saturate(1.09);
    }

    .editorial-v41-visual:hover::after{
        left:145%;
    }
}

/* ---------- Principles cards ---------- */
.principle-card{
    transform-style:preserve-3d;
}

@media (hover:hover) and (pointer:fine){
    .principle-card:hover{
        transform:translateY(-9px) scale(1.012);
    }
}

/* ---------- Values lobster image ---------- */
.about-values-media{
    position:relative;
    overflow:hidden;
    transform-style:preserve-3d;
    transition:
        transform .48s cubic-bezier(.22,.61,.36,1),
        box-shadow .48s ease;
    will-change:transform;
}

.about-values-media > img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:
        transform .8s cubic-bezier(.22,.61,.36,1),
        filter .5s ease;
}

.about-values-media::before{
    content:"";
    position:absolute;
    z-index:3;
    top:0;
    left:-125%;
    width:65%;
    height:100%;
    background:linear-gradient(
        110deg,
        transparent,
        rgba(255,255,255,.17),
        transparent
    );
    transform:skewX(-20deg);
    transition:left .85s ease;
    pointer-events:none;
}

.about-values-caption{
    transition:
        transform .45s cubic-bezier(.22,.61,.36,1),
        background .45s ease,
        backdrop-filter .45s ease;
    will-change:transform;
}

.about-values-caption small,
.about-values-caption strong{
    transition:
        transform .35s ease,
        letter-spacing .35s ease;
}

@media (hover:hover) and (pointer:fine){
    .about-values-media:hover{
        transform:translateY(-12px) scale(1.025);
        box-shadow:0 42px 95px rgba(7,38,57,.24);
    }

    .about-values-media:hover > img{
        transform:scale(1.09);
        filter:brightness(1.04) saturate(1.10);
    }

    .about-values-media:hover::before{
        left:145%;
    }

    .about-values-media:hover .about-values-caption{
        transform:translateY(-8px);
        backdrop-filter:blur(12px);
    }

    .about-values-media:hover .about-values-caption strong{
        transform:translateY(-2px);
    }
}

/* ---------- Value rows ---------- */
.about-value-list > div{
    transition:
        transform .36s cubic-bezier(.22,.61,.36,1),
        padding-left .36s ease,
        background .36s ease,
        border-color .36s ease,
        box-shadow .36s ease;
}

@media (hover:hover) and (pointer:fine){
    .about-value-list > div:hover{
        transform:translateX(9px);
        padding-left:15px;
        background:linear-gradient(90deg,rgba(223,187,98,.09),transparent 75%);
        border-color:rgba(223,187,98,.36);
        box-shadow:0 12px 30px rgba(7,38,57,.06);
    }
}

/* ---------- CTA buttons ---------- */
.inner-cta .btn{
    transition:
        transform .35s cubic-bezier(.22,.61,.36,1),
        box-shadow .35s ease,
        background .35s ease,
        border-color .35s ease;
}

@media (hover:hover) and (pointer:fine){
    .inner-cta .btn:hover{
        transform:translateY(-4px);
        box-shadow:0 16px 35px rgba(0,0,0,.16);
    }
}

/* ---------- Footer logo ---------- */
.footer-brand img{
    transform-origin:left center;
    transition:
        transform .45s cubic-bezier(.22,.61,.36,1),
        filter .45s ease;
}

@media (hover:hover) and (pointer:fine){
    .footer-brand img:hover{
        transform:translateY(-4px) scale(1.025);
        filter:drop-shadow(0 14px 25px rgba(0,0,0,.20));
    }
}

/* ---------- Mobile: keep effects stable ---------- */
@media (max-width:720px){
    .about-hero-media .inner-main-photo:hover,
    .about-hero-media .inner-floating-photo:hover,
    .editorial-v41-visual:hover,
    .about-values-media:hover,
    .principle-card:hover,
    .about-value-list > div:hover{
        transform:none;
    }
}

/* ---------- Accessibility ---------- */
@media (prefers-reduced-motion:reduce){
    .header .brand,
    .header .brand img,
    .about-hero-media .inner-main-photo,
    .about-hero-media .inner-floating-photo,
    .about-hero-media .inner-main-photo img,
    .about-hero-media .inner-floating-photo img,
    .about-hero-media .inner-label,
    .about-hero-media .inner-label *,
    .editorial-v41-visual,
    .editorial-v41-visual img,
    .principle-card,
    .about-value-list > div,
    .about-values-media,
    .about-values-media > img,
    .about-values-caption,
    .about-values-caption *,
    .inner-cta .btn,
    .footer-brand img{
        transition:none !important;
        animation:none !important;
    }
}

/* =========================================================
   QUALITY + CONTACT IMAGE / CARD ANIMATIONS
   Existing CSS above is preserved.
   This block is intentionally appended last so it can safely
   enhance the About, Quality and Contact pages.
   ========================================================= */

/* ---------------------------------------------------------
   QUALITY PAGE — HERO MEDIA
   --------------------------------------------------------- */

.quality-hero-media .inner-main-photo,
.quality-hero-media .inner-floating-photo,
.quality-hero-media .inner-label{
    transform-style:preserve-3d;
    transform-origin:center;
    transition:
        transform .48s cubic-bezier(.22,.61,.36,1),
        box-shadow .48s ease,
        border-color .48s ease,
        background .48s ease;
    will-change:transform;
}

.quality-hero-media .inner-main-photo img,
.quality-hero-media .inner-floating-photo img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:
        transform .78s cubic-bezier(.22,.61,.36,1),
        filter .5s ease;
}

/* glossy sweep over the two quality hero photos */
.quality-hero-media .inner-main-photo::before,
.quality-hero-media .inner-floating-photo::before{
    content:"";
    position:absolute;
    z-index:3;
    top:0;
    left:-125%;
    width:65%;
    height:100%;
    background:linear-gradient(
        110deg,
        transparent,
        rgba(255,255,255,.17),
        transparent
    );
    transform:skewX(-20deg);
    transition:left .82s ease;
    pointer-events:none;
}

.quality-hero-media .inner-label strong,
.quality-hero-media .inner-label small{
    transition:
        transform .35s ease,
        letter-spacing .35s ease,
        color .35s ease;
}


/* ---------------------------------------------------------
   QUALITY PAGE — FOUR SUPPLY STEPS
   --------------------------------------------------------- */

.process-v41-step{
    position:relative;
    overflow:hidden;
    transition:
        transform .4s cubic-bezier(.22,.61,.36,1),
        box-shadow .4s ease,
        border-color .4s ease,
        background .4s ease;
    will-change:transform;
}

.process-v41-step::after{
    content:"";
    position:absolute;
    top:0;
    left:-125%;
    width:48%;
    height:100%;
    background:linear-gradient(
        110deg,
        transparent,
        rgba(255,255,255,.82),
        transparent
    );
    transform:skewX(-20deg);
    transition:left .72s ease;
    pointer-events:none;
}

.process-v41-step b{
    position:relative;
    z-index:2;
    transition:
        transform .4s cubic-bezier(.22,.61,.36,1),
        background .4s ease,
        color .4s ease,
        box-shadow .4s ease;
}

.process-v41-step > div{
    position:relative;
    z-index:2;
}

.process-v41-step h3,
.process-v41-step p,
.process-v41-step small{
    transition:
        transform .35s ease,
        color .35s ease,
        letter-spacing .35s ease;
}


/* ---------------------------------------------------------
   QUALITY PAGE — LOBSTER FEATURE IMAGE
   --------------------------------------------------------- */

.quality-feature-media{
    position:relative;
    overflow:hidden;
    transform-style:preserve-3d;
    transition:
        transform .5s cubic-bezier(.22,.61,.36,1),
        box-shadow .5s ease,
        border-color .5s ease;
    will-change:transform;
}

.quality-feature-media img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:
        transform .82s cubic-bezier(.22,.61,.36,1),
        filter .5s ease;
}

.quality-feature-media::after{
    content:"";
    position:absolute;
    z-index:3;
    top:0;
    left:-125%;
    width:65%;
    height:100%;
    background:linear-gradient(
        110deg,
        transparent,
        rgba(255,255,255,.18),
        transparent
    );
    transform:skewX(-20deg);
    transition:left .88s ease;
    pointer-events:none;
}


/* ---------------------------------------------------------
   QUALITY PAGE — COLD-CHAIN LIST + PRIORITY CARDS
   --------------------------------------------------------- */

.quality-feature-copy li{
    transition:
        transform .35s cubic-bezier(.22,.61,.36,1),
        background .35s ease,
        border-color .35s ease;
}

.quality-priority{
    position:relative;
    overflow:hidden;
    transition:
        transform .4s cubic-bezier(.22,.61,.36,1),
        box-shadow .4s ease,
        border-color .4s ease,
        background .4s ease;
    will-change:transform;
}

.quality-priority::after{
    content:"";
    position:absolute;
    top:0;
    left:-120%;
    width:60%;
    height:100%;
    background:linear-gradient(
        110deg,
        transparent,
        rgba(255,255,255,.78),
        transparent
    );
    transform:skewX(-20deg);
    transition:left .72s ease;
    pointer-events:none;
}

.quality-priority span,
.quality-priority p{
    position:relative;
    z-index:2;
    transition:
        transform .35s ease,
        color .35s ease,
        letter-spacing .35s ease;
}


/* ---------------------------------------------------------
   CONTACT PAGE — HERO HAMOUR IMAGE
   --------------------------------------------------------- */

.contact-hero-media .inner-main-photo{
    transform-style:preserve-3d;
    transform-origin:center;
    transition:
        transform .48s cubic-bezier(.22,.61,.36,1),
        box-shadow .48s ease,
        border-color .48s ease;
    will-change:transform;
}

.contact-hero-media .inner-main-photo img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:
        transform .8s cubic-bezier(.22,.61,.36,1),
        filter .5s ease;
}

.contact-hero-media .inner-main-photo::before{
    content:"";
    position:absolute;
    z-index:3;
    top:0;
    left:-125%;
    width:65%;
    height:100%;
    background:linear-gradient(
        110deg,
        transparent,
        rgba(255,255,255,.18),
        transparent
    );
    transform:skewX(-20deg);
    transition:left .84s ease;
    pointer-events:none;
}


/* ---------------------------------------------------------
   CONTACT PAGE — EXISTING CONTACT CARD ENHANCEMENT
   --------------------------------------------------------- */

.contact-hero-card{
    transform-style:preserve-3d;
}

.contact-hero-card::after{
    content:"";
    position:absolute;
    inset:0;
    border-radius:inherit;
    background:
        linear-gradient(
            125deg,
            rgba(255,255,255,.08),
            transparent 35%,
            transparent 70%,
            rgba(223,187,98,.06)
        );
    opacity:0;
    transition:opacity .4s ease;
    pointer-events:none;
}


/* ---------------------------------------------------------
   CONTACT PAGE — FORM BUTTON
   --------------------------------------------------------- */

.contact-v41-form .btn,
.contact-v41-info .btn{
    transition:
        transform .35s cubic-bezier(.22,.61,.36,1),
        box-shadow .35s ease,
        background .35s ease,
        border-color .35s ease;
}


/* ---------------------------------------------------------
   DESKTOP / MOUSE HOVER
   --------------------------------------------------------- */

@media (hover:hover) and (pointer:fine){

    /* QUALITY HERO */
    .quality-hero-media .inner-main-photo:hover{
        transform:translateY(-12px) rotate(.5deg) scale(1.025);
        box-shadow:0 45px 100px rgba(0,0,0,.36);
        border-color:rgba(255,255,255,.46);
        z-index:12;
    }

    .quality-hero-media .inner-main-photo:hover img{
        transform:scale(1.075);
        filter:brightness(1.05) saturate(1.09);
    }

    .quality-hero-media .inner-main-photo:hover::before{
        left:145%;
    }

    .quality-hero-media .inner-floating-photo:hover{
        transform:translateY(-11px) rotate(-2deg) scale(1.055);
        box-shadow:0 34px 82px rgba(0,0,0,.35);
        border-color:rgba(255,255,255,.46);
        z-index:14;
    }

    .quality-hero-media .inner-floating-photo:hover img{
        transform:scale(1.095);
        filter:brightness(1.06) saturate(1.10);
    }

    .quality-hero-media .inner-floating-photo:hover::before{
        left:145%;
    }

    .quality-hero-media .inner-label:hover{
        transform:translateY(-8px) scale(1.035);
        background:rgba(4,31,47,.92);
        border-color:rgba(223,187,98,.56);
        box-shadow:0 26px 62px rgba(0,0,0,.30);
        z-index:16;
    }

    .quality-hero-media .inner-label:hover strong{
        transform:translateY(-2px);
        letter-spacing:.7px;
    }

    /* QUALITY PROCESS */
    .process-v41-step:hover{
        transform:translateY(-7px) scale(1.008);
        border-color:rgba(223,187,98,.34);
        background:#fff;
        box-shadow:0 26px 65px rgba(7,38,57,.11);
        z-index:3;
    }

    .process-v41-step:hover::after{
        left:145%;
    }

    .process-v41-step:hover b{
        transform:scale(1.09) rotate(-3deg);
        background:var(--navy);
        color:#fff;
        box-shadow:0 12px 28px rgba(7,38,57,.18);
    }

    .process-v41-step:hover h3{
        transform:translateX(4px);
    }

    .process-v41-step:hover small{
        letter-spacing:1.8px;
    }

    /* QUALITY FEATURE PHOTO */
    .quality-feature-media:hover{
        transform:translateY(-12px) scale(1.022);
        box-shadow:0 42px 95px rgba(0,0,0,.34);
    }

    .quality-feature-media:hover img{
        transform:scale(1.085);
        filter:brightness(1.045) saturate(1.10);
    }

    .quality-feature-media:hover::after{
        left:145%;
    }

    .quality-feature-copy li:hover{
        transform:translateX(7px);
        background:rgba(255,255,255,.10);
        border-left-color:#f2cc73;
    }

    /* QUALITY PRIORITIES */
    .quality-priority:hover{
        transform:translateY(-9px) scale(1.018);
        border-color:rgba(223,187,98,.36);
        box-shadow:0 28px 65px rgba(7,38,57,.13);
        z-index:4;
    }

    .quality-priority:hover::after{
        left:145%;
    }

    .quality-priority:hover span{
        transform:translateY(-3px);
        color:var(--navy2);
    }

    .quality-priority:hover p{
        transform:translateY(-2px);
    }

    /* CONTACT HERO IMAGE */
    .contact-hero-media .inner-main-photo:hover{
        transform:translateY(-12px) rotate(.5deg) scale(1.025);
        box-shadow:0 45px 100px rgba(0,0,0,.36);
        border-color:rgba(255,255,255,.46);
        z-index:12;
    }

    .contact-hero-media .inner-main-photo:hover img{
        transform:scale(1.08);
        filter:brightness(1.05) saturate(1.09);
    }

    .contact-hero-media .inner-main-photo:hover::before{
        left:145%;
    }

    .contact-hero-card:hover::after{
        opacity:1;
    }

    .contact-v41-form .btn:hover,
    .contact-v41-info .btn:hover{
        transform:translateY(-4px);
        box-shadow:0 16px 34px rgba(7,38,57,.18);
    }
}


/* ---------------------------------------------------------
   MOBILE: remove hover transforms that can feel jumpy
   --------------------------------------------------------- */

@media (max-width:720px){
    .quality-hero-media .inner-main-photo:hover,
    .quality-hero-media .inner-floating-photo:hover,
    .quality-hero-media .inner-label:hover,
    .process-v41-step:hover,
    .quality-feature-media:hover,
    .quality-priority:hover,
    .contact-hero-media .inner-main-photo:hover,
    .contact-hero-card:hover{
        transform:none;
    }
}


/* ---------------------------------------------------------
   ACCESSIBILITY: REDUCED MOTION
   --------------------------------------------------------- */

@media (prefers-reduced-motion:reduce){
    .quality-hero-media .inner-main-photo,
    .quality-hero-media .inner-floating-photo,
    .quality-hero-media .inner-main-photo img,
    .quality-hero-media .inner-floating-photo img,
    .quality-hero-media .inner-label,
    .quality-hero-media .inner-label *,
    .process-v41-step,
    .process-v41-step *,
    .quality-feature-media,
    .quality-feature-media img,
    .quality-feature-copy li,
    .quality-priority,
    .quality-priority *,
    .contact-hero-media .inner-main-photo,
    .contact-hero-media .inner-main-photo img,
    .contact-hero-card,
    .contact-hero-card *,
    .contact-v41-form .btn,
    .contact-v41-info .btn{
        transition:none !important;
        animation:none !important;
    }
}