.product-range-page{background:var(--cloud);color:var(--navy)}
.product-range-page .restaurant-shell{background:var(--cloud)}
.pack-wrap{width:88%;max-width:1280px;margin-inline:auto}
.pack-heading{background:var(--navy);color:var(--cloud);padding:145px 0 45px;position:relative}
.pack-heading:after{content:'';height:5px;width:100%;position:absolute;bottom:0;left:0;background:linear-gradient(90deg,var(--gold) 0%,var(--gold) 18%,#1c579e 18%,#1c579e 100%)}
.pack-back{font-size:14px;display:inline-block;color:#cad9eb;margin-bottom:25px}
.pack-back:hover{color:var(--gold)}
.pack-heading .eyebrow{color:var(--gold);font-size:12px;letter-spacing:.13em;margin-bottom:16px}
.pack-heading h1{font-size:clamp(36px,4.4vw,64px);letter-spacing:-.045em;line-height:1.08;margin:0 0 18px;max-width:850px}
.pack-heading h1 span{color:var(--gold)}
.pack-intro{font-size:16px;line-height:1.75;color:#cad9eb;max-width:560px;margin:0}
.pack-catalogue{padding-block:35px 45px}
.pack-catalogue-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:25px}
.pack-catalogue-heading h2{font-size:25px;margin:0;line-height:1.2}
.pack-catalogue-heading>span{font-size:14px;color:#526b83}
.pack-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px 24px;align-items:stretch}
.pack-tile{background:white;border:1px solid #dce4ec;border-radius:20px;overflow:hidden;display:flex;flex-direction:column}
.pack-tile-image{height:240px;padding:25px 18px 15px;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#f8fafc,white)}
.pack-tile-image img{width:94%;height:100%;object-fit:contain;filter:drop-shadow(0 11px 7px #092a651a);transition:transform .25s}
.pack-tile:hover img{transform:translateY(-4px)}
.pack-tile-copy{padding:18px 20px 22px;border-top:1px solid #eef2f6;margin-top:auto}
.pack-tile-copy h2{font-size:19px;line-height:1.3;letter-spacing:-.025em;margin:0 0 10px}
.pack-tile-copy p{font-size:14px;font-weight:700;line-height:1.5;padding:5px 12px;background:#f4edcf;color:var(--navy);border-radius:20px;display:inline-block;margin:0}
.pack-enquiry{background:var(--navy);color:var(--cloud);padding:30px 35px;display:flex;align-items:center;justify-content:space-between;gap:30px;border-radius:18px}
.pack-enquiry .eyebrow{color:var(--gold);margin-bottom:12px;font-size:12px}
.pack-enquiry h2{font-size:clamp(25px,2.7vw,36px);margin:0 0 12px}
.pack-enquiry p{color:#cad9eb;font-size:15px;margin:0}
.pack-enquiry .gold-button{background:var(--gold);color:var(--navy);white-space:nowrap}
.pack-return{display:flex;justify-content:space-between;gap:20px;padding-block:25px 35px;font-size:14px;font-weight:700}
.pack-return a:hover{color:var(--blue)}
.product-range-page .restaurant-footer{background:#061d47}
@media(max-width:1050px){.pack-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.pack-tile-image{height:215px}}
@media(max-width:740px){.pack-wrap{width:90%}.pack-heading{padding-top:125px;padding-bottom:35px}.pack-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.pack-tile-image{height:205px}.pack-enquiry{display:block;padding:26px}.pack-enquiry .gold-button{margin-top:23px;white-space:normal}.pack-back{margin-bottom:20px}}
@media(max-width:480px){.pack-heading h1{font-size:36px}.pack-catalogue-heading h2{font-size:22px}.pack-catalogue-heading>span{font-size:12px}.pack-grid{gap:14px}.pack-tile{border-radius:15px}.pack-tile-image{height:180px;padding:18px 10px 10px}.pack-tile-copy{padding:14px 12px 17px}.pack-tile-copy h2{font-size:16px}.pack-tile-copy p{font-size:12px;padding:5px 9px}.pack-return{font-size:13px}.pack-intro{font-size:15px}}
@media(max-width:350px){.pack-grid{grid-template-columns:1fr}.pack-tile-image{height:220px}}
@media(prefers-reduced-motion:reduce){.pack-tile-image img{transition:none}}
/* Product showcase — golden stage, navy detail panel. */
.product-range-page .restaurant-shell{background:#f7f8fb}
.pack-wrap{width:92%;max-width:1680px}
.variant-section{padding:140px 0 55px;background:#0a2856;color:#fff;position:relative}
.product-range-page .header{background:#f7f8fb;color:var(--navy)}
.product-range-page .refreshed-header .menu-toggle{color:var(--navy);border-color:#092a6555}
.product-range-page .refreshed-header .nav-links{color:var(--cloud)}
.variant-section .pack-back{color:#d9e4f4;font-size:14px;margin-bottom:26px;text-decoration:none}
.variant-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(30px,5vw,90px);align-items:center}
.variant-visual{position:relative;isolation:isolate;min-height:570px;height:100%;display:flex;align-items:center;justify-content:center;padding:62px 40px 75px;background:radial-gradient(ellipse at 50% 36%,#ffe9a3,#efbd35 75%);border-radius:28px;overflow:hidden}
.variant-visual:before{content:attr(data-product-title);text-transform:uppercase;line-height:1.15;position:absolute;top:28px;left:30px;right:30px;font-size:clamp(20px,2.5vw,40px);font-weight:900;letter-spacing:.05em;color:#775209}
.variant-visual:after{content:'OUR QUALITY. OUR PRIORITY.';position:absolute;bottom:27px;left:30px;color:#684906;font-size:13px;letter-spacing:.12em;font-weight:800}
.variant-visual img{position:relative;z-index:1;width:100%;height:450px;object-fit:contain;filter:drop-shadow(16px 24px 14px #70450040);transform:rotate(-7deg);transition:transform .35s}
.variant-visual:hover img{transform:rotate(-3deg) translateY(-5px)}
.variant-info{padding:12px 0;min-width:0}
.variant-info .eyebrow{color:#f3c54b;font-weight:800;font-size:14px;letter-spacing:.17em;margin:0 0 18px}
.variant-info h1{color:white;font-size:clamp(40px,4.7vw,76px);font-weight:850;line-height:1.02;letter-spacing:-.045em;margin:0 0 28px;max-width:700px}
.variant-label{font-size:16px;color:#cbd7e9;margin:0 0 16px;line-height:1.5}
.variant-label strong{color:#ffcf53;margin-left:5px}
.variant-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.variant-button{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;min-height:98px;padding:9px 6px;border:1px solid #4c6486;border-radius:12px;background:#163664;color:white;cursor:pointer;font:inherit;font-size:14px;font-weight:700;line-height:1.25;transition:background .2s,transform .2s;overflow-wrap:anywhere}
.variant-button img{width:40px;height:43px;object-fit:contain;pointer-events:none}
.variant-button[aria-pressed=true]{background:#ffcf53;color:#102c54;border-color:#ffcf53;box-shadow:0 5px 16px #0002}
.variant-button:hover{transform:translateY(-3px);border-color:#ffcf53}
.variant-button:focus-visible,.pack-select:focus-visible{outline:3px solid #edaa20;outline-offset:4px}
.variant-enquiry{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:25px;padding:20px 0;border-top:1px solid #385275;border-bottom:1px solid #385275}
.variant-enquiry h2{font-size:16px;color:#d6e0ed;margin:0}
.variant-enquiry .gold-button{background:#ffcf53;color:#102c54;border-radius:50px;padding:15px 27px;font-size:16px;min-height:50px}
.variant-description{margin-top:22px}
.variant-description h2{font-size:14px;color:#ffcf53;margin:0 0 8px}
.variant-description p{font-size:16px;line-height:1.65;color:#cfdaea;margin:0}
.pack-catalogue{padding-block:50px}
.pack-catalogue-heading h2{font-size:clamp(28px,3vw,42px);letter-spacing:-.04em}
.pack-tile{border-radius:18px;border-color:#e3e8ef;transition:box-shadow .2s,transform .2s}
.pack-tile:hover{transform:translateY(-4px);box-shadow:0 14px 32px #092a6512}
.pack-tile-image{background:#eef2f7;height:270px}
.pack-select{padding:0;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer;display:flex;flex-direction:column;width:100%;height:100%}
.pack-select .pack-tile-image,.pack-select .pack-tile-copy{width:100%}
@media(min-width:1500px){.variant-visual{min-height:650px}.variant-visual img{height:510px}}
@media(max-width:1050px){.variant-layout{gap:30px}.variant-visual{min-height:550px;padding-inline:20px}.variant-options{grid-template-columns:repeat(3,minmax(0,1fr))}.variant-info h1{font-size:46px}.variant-visual img{height:390px}}
@media(max-width:740px){.variant-section{padding:125px 0 35px}.variant-layout{grid-template-columns:1fr;gap:30px}.variant-visual{min-height:390px;padding:55px 25px;height:390px}.variant-visual img{height:285px}.variant-visual:before{font-size:26px;top:22px;left:24px}.variant-visual:after{left:24px;bottom:20px;font-size:12px}.variant-info h1{font-size:clamp(38px,9vw,58px);margin-bottom:22px}.variant-options{grid-template-columns:repeat(3,minmax(0,1fr))}.variant-button{min-height:93px}.pack-catalogue{padding-block:32px}.pack-tile-image{height:200px}}
@media(max-width:360px){.variant-options{grid-template-columns:repeat(2,minmax(0,1fr))}.variant-enquiry{align-items:flex-start;flex-direction:column}}
@media(prefers-reduced-motion:reduce){.variant-button,.variant-visual img,.pack-tile{transition:none}.variant-button:hover,.variant-visual:hover img,.pack-tile:hover{transform:none}}
.product-range-page .refreshed-header{top:0;height:120px}
.product-range-page .refreshed-header .nav{position:relative;top:24px}
@media(max-width:700px){.product-range-page .refreshed-header{height:108px}.product-range-page .refreshed-header .nav{top:10px;background:transparent;border:0;box-shadow:none;backdrop-filter:none;padding-inline:0}.product-range-page .refreshed-header .nav-links{top:88px}}

/* v42: standalone menu and the home hero's food texture. */
.product-range-page .restaurant-shell{position:relative}
.product-range-page .product-floating-nav{position:absolute;top:28px;right:clamp(16px,2.5vw,48px);z-index:20}
.product-range-page .product-floating-nav .menu-toggle{display:grid;place-items:center;width:54px;height:54px;padding:0;border:1px solid #ffffff70;border-radius:50%;background:#092a6570;color:#fff;cursor:pointer}
.product-range-page .product-floating-nav .menu-toggle:hover{background:#1c579e}
.product-range-page .product-floating-nav .nav-links{display:none;position:absolute;top:66px;right:0;left:auto;width:min(300px,calc(100vw - 32px));margin:0;padding:18px;background:#092a65;color:#fff;border:1px solid #71a4c665;border-radius:20px;box-shadow:0 18px 50px #00163266}
.product-range-page .product-floating-nav .nav-links.open{display:flex;flex-direction:column;align-items:stretch;gap:8px}
.product-range-page .product-floating-nav .nav-links a{display:block;padding:12px 20px;font-size:15px;white-space:normal;border-radius:30px}
.product-range-page .product-floating-nav .nav-links a:hover{background:#1c579e}
.product-range-page .product-floating-nav .nav-contact{background:#ffcf53;color:#092a65;border:0}
.product-range-page .variant-section{padding-top:32px;isolation:isolate;background:radial-gradient(ellipse at 50% 62%,#1c579e 0%,#103977 40%,#092a65 75%)}
.product-range-page .variant-section:before{content:'';position:absolute;inset:0;z-index:-1;background:url('assets/fast-food-texture.webp') center/650px;opacity:.25;mask-image:linear-gradient(90deg,#000,transparent 45%,transparent 55%,#000);pointer-events:none}
.product-range-page .variant-section .pack-back{max-width:calc(100% - 74px);margin-bottom:40px;min-height:24px}
@media(max-width:740px){.product-range-page .variant-section{padding-top:28px}.product-range-page .product-floating-nav{top:18px}.product-range-page .variant-section .pack-back{margin-bottom:32px}}

/* Keep longer product names clear above the pack image. */
.variant-visual[data-product-title="White Synthetic Vinegar"]:before,
.variant-visual[data-product-title="Tomato & Chilli Garlic"]:before,
.variant-visual[data-product-title="Chilli Garlic Sauce"]:before,
.variant-visual[data-product-title="Green Chilli Sauce"]:before{font-size:clamp(18px,2.1vw,32px)}
@media(max-width:740px){.variant-visual:before{font-size:22px}.variant-visual[data-product-title]:before{line-height:1.15}}


/* Premium product image hover effect - straight floating product */
.product-range-page .variant-visual img{
    animation: productFloat 3.8s ease-in-out infinite;
    transition: filter .45s ease;
    will-change: transform;
}

@keyframes productFloat{
    0%,100%{
        transform: translateY(0) rotate(0deg) scale(1);
    }
    50%{
        transform: translateY(-14px) rotate(0deg) scale(1);
    }
}

@keyframes productFloatHover{
    0%,100%{
        transform: translateY(0) rotate(0deg) scale(1.08);
    }
    50%{
        transform: translateY(-14px) rotate(0deg) scale(1.08);
    }
}

.product-range-page .variant-visual:hover img{
    animation: productFloatHover 3.8s ease-in-out infinite;
    filter: drop-shadow(20px 30px 18px #70450055);
}

.product-range-page .variant-visual:hover{
    box-shadow: inset 0 0 45px rgba(255,255,255,.12);
}

@media(max-width:740px){
    .product-range-page .variant-visual img{
        animation-duration:3.5s;
    }
}