/*
Theme Name: DN Future Friendly
Theme URI: https://dnfuturefriendly.com
Author: Nitin Kumar Bapna
Author URI: https://dnfuturefriendly.com
Description: Premium, futuristic dark-red/blue/black WooCommerce catalog theme built for DN Future Friendly (Shree Bharirav Siddh Electronics), manufacturers of electrical wiring accessories. Built with variable product support (Color/Size), WhatsApp direct enquiry buttons, and lightweight performance-safe animations.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: dnff
Tags: e-commerce, custom-colors, dark, one-column, right-sidebar, responsive-layout
*/

/* =====================================================================
   0. ROOT VARIABLES
===================================================================== */
:root{
  --dnff-black:        #0a0a0f;
  --dnff-black-soft:    #121218;
  --dnff-panel:         #16161d;
  --dnff-panel-2:       #1c1c25;
  --dnff-border:        #2a2a35;

  --dnff-red:           #b3001b;
  --dnff-red-dark:      #7a0014;
  --dnff-red-bright:    #e8102e;

  --dnff-blue:          #0057ff;
  --dnff-blue-dark:     #002d80;
  --dnff-blue-bright:   #3a8bff;

  --dnff-accent:        #00e5ff;

  --dnff-text:          #eef0f5;
  --dnff-text-dim:      #a7abbd;
  --dnff-white:         #ffffff;

  --dnff-radius:        14px;
  --dnff-radius-sm:     8px;
  --dnff-shadow:        0 10px 30px rgba(0,0,0,0.45);
  --dnff-transition:    0.3s cubic-bezier(.4,0,.2,1);

  --dnff-font-head:     'Orbitron', 'Rajdhani', sans-serif;
  --dnff-font-body:     'Rajdhani', 'Segoe UI', Arial, sans-serif;
}

/* =====================================================================
   1. RESET / BASE
===================================================================== */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  background:var(--dnff-black);
  color:var(--dnff-text);
  font-family:var(--dnff-font-body);
  font-size:17px;
  line-height:1.65;
  margin:0;
  overflow-x:hidden;
  background-image:
    radial-gradient(circle at 15% 20%, rgba(179,0,27,0.12), transparent 40%),
    radial-gradient(circle at 85% 75%, rgba(0,87,255,0.12), transparent 40%);
  background-attachment:fixed;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:var(--dnff-blue-bright); text-decoration:none; transition:color var(--dnff-transition); }
a:hover{ color:var(--dnff-accent); }
h1,h2,h3,h4,h5,h6{
  font-family:var(--dnff-font-head);
  color:var(--dnff-white);
  letter-spacing:0.5px;
  line-height:1.25;
  margin:0 0 0.6em;
}
h1{ font-size:clamp(2rem,5vw,3.4rem); }
h2{ font-size:clamp(1.5rem,3.5vw,2.4rem); }
h3{ font-size:clamp(1.15rem,2.5vw,1.5rem); }
p{ margin:0 0 1em; color:var(--dnff-text-dim); }
ul{ margin:0; padding:0; list-style:none; }
button, input, select, textarea{ font-family:inherit; }
.container{ max-width:1240px; margin:0 auto; padding:0 24px; }
.dnff-section{ padding:70px 0; position:relative; }
.dnff-section-alt{ background:linear-gradient(180deg, rgba(255,255,255,0.015), transparent); }
.text-center{ text-align:center; }
.dnff-eyebrow{
  display:inline-block; color:var(--dnff-accent); font-family:var(--dnff-font-head);
  letter-spacing:3px; font-size:0.78rem; text-transform:uppercase; margin-bottom:10px;
}
.dnff-title-row{ margin-bottom:40px; }
.dnff-title-row p{ max-width:640px; margin:10px auto 0; }

/* Gradient headline accent */
.dnff-gradient-text{
  background:linear-gradient(90deg,var(--dnff-red-bright),var(--dnff-blue-bright) 60%,var(--dnff-accent));
  -webkit-background-clip:text; background-clip:text; color:transparent;
  background-size:200% auto; animation:dnffGradientShift 6s ease infinite;
}
@keyframes dnffGradientShift{
  0%{ background-position:0% 50%; } 50%{ background-position:100% 50%; } 100%{ background-position:0% 50%; }
}

/* =====================================================================
   2. BUTTONS
===================================================================== */
.dnff-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:14px 28px; border-radius:50px; font-weight:700; font-family:var(--dnff-font-head);
  font-size:0.92rem; letter-spacing:0.5px; text-transform:uppercase; cursor:pointer;
  border:1px solid transparent; transition:transform var(--dnff-transition), box-shadow var(--dnff-transition), background var(--dnff-transition), color var(--dnff-transition);
  white-space:nowrap;
}
.dnff-btn svg,.dnff-btn img{ width:20px; height:20px; }
.dnff-btn-primary{
  background:linear-gradient(90deg,var(--dnff-red),var(--dnff-red-bright));
  color:#fff; box-shadow:0 8px 24px rgba(179,0,27,0.35);
}
.dnff-btn-primary:hover{ transform:translateY(-3px); box-shadow:0 12px 30px rgba(179,0,27,0.55); color:#fff; }
.dnff-btn-blue{
  background:linear-gradient(90deg,var(--dnff-blue-dark),var(--dnff-blue));
  color:#fff; box-shadow:0 8px 24px rgba(0,87,255,0.35);
}
.dnff-btn-blue:hover{ transform:translateY(-3px); box-shadow:0 12px 30px rgba(0,87,255,0.55); color:#fff; }
.dnff-btn-outline{
  background:transparent; border-color:var(--dnff-border); color:var(--dnff-text);
}
.dnff-btn-outline:hover{ border-color:var(--dnff-accent); color:var(--dnff-accent); transform:translateY(-2px); }
.dnff-btn-whatsapp{
  background:linear-gradient(90deg,#128c3e,#25D366);
  color:#04140b; box-shadow:0 8px 24px rgba(37,211,102,0.35);
}
.dnff-btn-whatsapp:hover{ transform:translateY(-3px); box-shadow:0 12px 30px rgba(37,211,102,0.55); color:#04140b; }
.dnff-btn-disabled, .dnff-btn.disabled{
  background:var(--dnff-panel-2)!important; color:var(--dnff-text-dim)!important;
  box-shadow:none!important; cursor:not-allowed; pointer-events:none; opacity:0.6;
}
.dnff-btn-block{ width:100%; }

/* =====================================================================
   3. HEADER
===================================================================== */
#dnff-header{
  position:sticky; top:0; z-index:999;
  background:rgba(10,10,15,0.85);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--dnff-border);
}
.dnff-topbar{
  background:linear-gradient(90deg,var(--dnff-red-dark),var(--dnff-black) 60%,var(--dnff-blue-dark));
  font-size:0.85rem; color:var(--dnff-text-dim);
}
.dnff-topbar .container{ display:flex; justify-content:space-between; align-items:center; padding-top:8px; padding-bottom:8px; flex-wrap:wrap; gap:8px; }
.dnff-topbar a{ color:var(--dnff-text); }
.dnff-topbar-links{ display:flex; gap:22px; flex-wrap:wrap; }
.dnff-topbar-links span, .dnff-topbar-links a{ display:inline-flex; align-items:center; gap:6px; }

.dnff-nav-wrap{ display:flex; align-items:center; justify-content:space-between; padding:14px 0; gap:20px; }
.dnff-logo{ display:flex; align-items:center; gap:12px; font-family:var(--dnff-font-head); color:#fff; font-size:1.35rem; font-weight:700; }
.dnff-logo:hover{ color:#fff; }
.dnff-logo-mark{
  width:44px; height:44px; border-radius:12px;
  background:linear-gradient(135deg,var(--dnff-red),var(--dnff-blue));
  display:flex; align-items:center; justify-content:center; font-family:var(--dnff-font-head);
  font-weight:900; color:#fff; box-shadow:0 0 22px rgba(179,0,27,0.55);
  animation:dnffPulseGlow 3.2s ease-in-out infinite;
}
.dnff-logo-text small{ display:block; font-family:var(--dnff-font-body); font-size:0.68rem; letter-spacing:2px; color:var(--dnff-text-dim); font-weight:600; text-transform:uppercase; }
@keyframes dnffPulseGlow{
  0%,100%{ box-shadow:0 0 14px rgba(179,0,27,0.45); } 50%{ box-shadow:0 0 26px rgba(0,87,255,0.55); }
}

.dnff-primary-menu{ display:flex; gap:30px; align-items:center; }
.dnff-primary-menu li{ position:relative; }
.dnff-primary-menu a{
  color:var(--dnff-text); font-weight:600; font-size:0.98rem; padding:8px 2px; position:relative;
}
.dnff-primary-menu a::after{
  content:""; position:absolute; left:0; bottom:0; width:0; height:2px;
  background:linear-gradient(90deg,var(--dnff-red-bright),var(--dnff-accent)); transition:width var(--dnff-transition);
}
.dnff-primary-menu a:hover::after, .dnff-primary-menu .current-menu-item a::after{ width:100%; }
.dnff-primary-menu .sub-menu{
  position:absolute; top:130%; left:0; min-width:220px; background:var(--dnff-panel);
  border:1px solid var(--dnff-border); border-radius:var(--dnff-radius-sm); padding:10px;
  opacity:0; visibility:hidden; transform:translateY(8px); transition:all var(--dnff-transition);
  box-shadow:var(--dnff-shadow); z-index:50;
}
.dnff-primary-menu li:hover > .sub-menu{ opacity:1; visibility:visible; transform:translateY(0); }
.dnff-primary-menu .sub-menu a{ display:block; padding:8px 10px; border-radius:6px; }
.dnff-primary-menu .sub-menu a:hover{ background:rgba(255,255,255,0.05); }

.dnff-header-actions{ display:flex; align-items:center; gap:14px; }
.dnff-menu-toggle{
  display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:8px;
}
.dnff-menu-toggle span{ width:26px; height:2px; background:#fff; border-radius:2px; transition:var(--dnff-transition); }

/* =====================================================================
   4. HERO
===================================================================== */
.dnff-hero{
  position:relative; padding:100px 0 90px; overflow:hidden;
  background:
    radial-gradient(ellipse at top left, rgba(179,0,27,0.28), transparent 55%),
    radial-gradient(ellipse at bottom right, rgba(0,87,255,0.28), transparent 55%),
    var(--dnff-black);
}
.dnff-hero::before{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:0.5;
  background-image:linear-gradient(rgba(255,255,255,0.035) 1px, transparent 1px),
                    linear-gradient(90deg, rgba(255,255,255,0.035) 1px, transparent 1px);
  background-size:42px 42px;
  mask-image:radial-gradient(ellipse at center, black, transparent 75%);
}
.dnff-hero-grid{ display:grid; grid-template-columns:1.1fr 0.9fr; gap:50px; align-items:center; position:relative; z-index:2; }
.dnff-hero-badge{
  display:inline-flex; align-items:center; gap:8px; background:rgba(179,0,27,0.15);
  border:1px solid rgba(179,0,27,0.4); color:#ffb3bd; padding:8px 16px; border-radius:50px;
  font-size:0.8rem; font-weight:700; letter-spacing:1px; text-transform:uppercase; margin-bottom:22px;
}
.dnff-hero h1{ margin-bottom:20px; }
.dnff-hero-lead{ font-size:1.15rem; max-width:520px; margin-bottom:32px; }
.dnff-hero-cta{ display:flex; gap:16px; flex-wrap:wrap; margin-bottom:36px; }
.dnff-hero-stats{ display:flex; gap:34px; flex-wrap:wrap; }
.dnff-hero-stats div strong{ display:block; font-family:var(--dnff-font-head); font-size:1.6rem; color:#fff; }
.dnff-hero-stats div span{ font-size:0.8rem; color:var(--dnff-text-dim); text-transform:uppercase; letter-spacing:1px; }

.dnff-hero-visual{ position:relative; height:420px; display:flex; align-items:center; justify-content:center; }
.dnff-hero-ring{
  position:absolute; border-radius:50%; border:1px solid rgba(0,229,255,0.25);
  animation:dnffSpin 22s linear infinite;
}
.dnff-hero-ring.r1{ width:340px; height:340px; }
.dnff-hero-ring.r2{ width:260px; height:260px; border-color:rgba(179,0,27,0.3); animation-duration:16s; animation-direction:reverse; }
.dnff-hero-ring.r3{ width:180px; height:180px; border-color:rgba(0,87,255,0.35); animation-duration:12s; }
@keyframes dnffSpin{ from{ transform:rotate(0deg);} to{ transform:rotate(360deg);} }
.dnff-hero-core{
  position:relative; z-index:2; width:150px; height:150px; border-radius:24px;
  background:linear-gradient(135deg,var(--dnff-red),var(--dnff-blue));
  display:flex; align-items:center; justify-content:center; color:#fff;
  font-family:var(--dnff-font-head); font-weight:900; font-size:2.2rem;
  box-shadow:0 0 60px rgba(179,0,27,0.45); animation:dnffFloat 4s ease-in-out infinite;
}
@keyframes dnffFloat{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-14px);} }

@media (max-width:960px){
  .dnff-hero-grid{ grid-template-columns:1fr; }
  .dnff-hero-visual{ height:280px; }
}

/* =====================================================================
   5. CATEGORY / PRODUCT GRID CARDS
===================================================================== */
.dnff-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:26px; }
.dnff-card{
  background:linear-gradient(180deg,var(--dnff-panel),var(--dnff-panel-2));
  border:1px solid var(--dnff-border); border-radius:var(--dnff-radius);
  overflow:hidden; position:relative; transition:transform var(--dnff-transition), box-shadow var(--dnff-transition), border-color var(--dnff-transition);
}
.dnff-card:hover{ transform:translateY(-8px); border-color:rgba(0,229,255,0.35); box-shadow:0 16px 40px rgba(0,0,0,0.5); }
.dnff-card-media{
  aspect-ratio:4/3; background:linear-gradient(135deg,rgba(179,0,27,0.18),rgba(0,87,255,0.18));
  display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden;
}
.dnff-card-media img{ width:100%; height:100%; object-fit:cover; transition:transform 0.5s ease; }
.dnff-card:hover .dnff-card-media img{ transform:scale(1.08); }
.dnff-card-media .dnff-noimg{ font-family:var(--dnff-font-head); color:rgba(255,255,255,0.35); font-size:0.85rem; letter-spacing:1px; text-transform:uppercase; }
.dnff-card-body{ padding:20px; }
.dnff-card-body h3{ margin-bottom:6px; font-size:1.1rem; }
.dnff-card-body h3 a{ color:#fff; }
.dnff-card-cat{ color:var(--dnff-accent); font-size:0.75rem; letter-spacing:1.5px; text-transform:uppercase; font-weight:700; }
.dnff-card-price{ font-family:var(--dnff-font-head); color:#fff; font-size:1.05rem; margin:8px 0 16px; }
.dnff-card-actions{ display:flex; gap:10px; }
.dnff-card-actions .dnff-btn{ padding:10px 16px; font-size:0.78rem; flex:1; }

/* =====================================================================
   6. SINGLE PRODUCT
===================================================================== */
.dnff-breadcrumb{ font-size:0.85rem; color:var(--dnff-text-dim); margin-bottom:20px; }
.dnff-breadcrumb a{ color:var(--dnff-text-dim); }
.dnff-breadcrumb a:hover{ color:var(--dnff-accent); }

.woocommerce div.product{
  background:var(--dnff-panel); border:1px solid var(--dnff-border); border-radius:var(--dnff-radius);
  padding:36px; margin-bottom:40px;
}
.woocommerce div.product .woocommerce-product-gallery{
  background:var(--dnff-black-soft); border-radius:var(--dnff-radius-sm); overflow:hidden; border:1px solid var(--dnff-border);
}
.woocommerce div.product .woocommerce-product-gallery__image{ background:var(--dnff-black-soft); }
.woocommerce div.product .woocommerce-product-gallery .dnff-noimg-placeholder{
  aspect-ratio:1/1; display:flex; align-items:center; justify-content:center;
  font-family:var(--dnff-font-head); color:var(--dnff-text-dim); letter-spacing:1px; text-transform:uppercase;
  background:repeating-linear-gradient(45deg, rgba(255,255,255,0.02) 0 10px, transparent 10px 20px);
}
.woocommerce div.product .product_title{ margin-bottom:8px; }
.woocommerce div.product p.price, .woocommerce div.product span.price{
  color:var(--dnff-accent); font-family:var(--dnff-font-head); font-size:1.5rem;
}
.woocommerce div.product .dnff-price-contact{ color:var(--dnff-accent); font-family:var(--dnff-font-head); font-size:1.15rem; }
.woocommerce div.product .stock.in-stock{ color:#3ddc84; font-weight:700; }
.woocommerce div.product .stock.out-of-stock{ color:var(--dnff-red-bright); font-weight:700; }
.woocommerce div.product .sku_wrapper, .woocommerce div.product .posted_in{ color:var(--dnff-text-dim); font-size:0.9rem; display:block; margin-top:6px; }
.woocommerce div.product .sku_wrapper .sku, .woocommerce div.product .posted_in a{ color:var(--dnff-text); }

table.variations{ width:100%; margin:22px 0; border-collapse:collapse; }
table.variations tr{ display:block; margin-bottom:16px; }
table.variations td.label{ display:block; font-family:var(--dnff-font-head); font-size:0.85rem; letter-spacing:1px; text-transform:uppercase; color:var(--dnff-text-dim); margin-bottom:8px; }
table.variations td.value select{
  width:100%; padding:13px 16px; background:var(--dnff-black-soft); color:var(--dnff-text);
  border:1px solid var(--dnff-border); border-radius:var(--dnff-radius-sm); font-size:1rem; appearance:none;
  background-image:linear-gradient(45deg, transparent 50%, var(--dnff-accent) 50%), linear-gradient(135deg, var(--dnff-accent) 50%, transparent 50%);
  background-position:calc(100% - 22px) center, calc(100% - 16px) center; background-size:6px 6px; background-repeat:no-repeat;
  transition:border-color var(--dnff-transition);
}
table.variations td.value select:focus{ outline:none; border-color:var(--dnff-accent); }
table.variations td.value select option:disabled{ color:#555; }
a.reset_variations{ display:inline-block; margin-top:4px; font-size:0.82rem; color:var(--dnff-text-dim); }
a.reset_variations:hover{ color:var(--dnff-red-bright); }

.woocommerce-variation.single_variation{
  background:var(--dnff-black-soft); border:1px dashed var(--dnff-border); border-radius:var(--dnff-radius-sm);
  padding:16px 18px; margin-bottom:18px; min-height:20px;
}
.dnff-enquire-wrap{ margin-top:22px; }
.dnff-enquire-wrap .dnff-btn{ padding:16px 30px; font-size:1rem; }
.dnff-enquire-note{ margin-top:12px; font-size:0.85rem; color:var(--dnff-text-dim); }
.dnff-call-inline{ display:inline-flex; align-items:center; gap:8px; margin-top:14px; color:var(--dnff-text); font-weight:600; }

.dnff-spec-box{
  margin-top:36px; padding-top:28px; border-top:1px solid var(--dnff-border);
}
.dnff-spec-box table{ width:100%; border-collapse:collapse; }
.dnff-spec-box table th, .dnff-spec-box table td{ text-align:left; padding:10px 12px; border-bottom:1px solid var(--dnff-border); color:var(--dnff-text-dim); }
.dnff-spec-box table th{ width:220px; color:var(--dnff-text); font-family:var(--dnff-font-head); font-size:0.8rem; letter-spacing:1px; text-transform:uppercase; }

.woocommerce-breadcrumb{ font-size:0.85rem; color:var(--dnff-text-dim); margin-bottom:24px; display:block; }
.woocommerce-breadcrumb a{ color:var(--dnff-text-dim); }
.woocommerce-breadcrumb a:hover{ color:var(--dnff-accent); }

/* Shop / Archive */
.dnff-shop-toolbar{ display:flex; justify-content:space-between; align-items:center; margin-bottom:30px; flex-wrap:wrap; gap:16px; }
.woocommerce ul.products{ display:grid !important; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:26px; list-style:none; }
.woocommerce ul.products li.product{
  background:linear-gradient(180deg,var(--dnff-panel),var(--dnff-panel-2));
  border:1px solid var(--dnff-border); border-radius:var(--dnff-radius); padding:0 0 20px; text-align:left;
  transition:transform var(--dnff-transition), box-shadow var(--dnff-transition), border-color var(--dnff-transition);
}
.woocommerce ul.products li.product:hover{ transform:translateY(-8px); border-color:rgba(0,229,255,0.35); box-shadow:0 16px 40px rgba(0,0,0,0.5); }
.woocommerce ul.products li.product img{ border-radius:var(--dnff-radius) var(--dnff-radius) 0 0; aspect-ratio:4/3; object-fit:cover; }
.woocommerce ul.products li.product .woocommerce-loop-product__title{ padding:16px 18px 4px; color:#fff; font-family:var(--dnff-font-head); font-size:1.02rem; }
.woocommerce ul.products li.product .price{ padding:0 18px; color:var(--dnff-accent); }
.woocommerce ul.products li.product .button{ margin:16px 18px 0; }

/* Product tabs (description / reviews) - keep readable on dark background */
.woocommerce-tabs{ margin-top:40px; color:var(--dnff-text); }
.woocommerce-tabs ul.tabs{ display:flex; gap:8px; border-bottom:1px solid var(--dnff-border); margin-bottom:24px; padding:0; flex-wrap:wrap; }
.woocommerce-tabs ul.tabs li{ list-style:none; }
.woocommerce-tabs ul.tabs li a{
  display:inline-block; padding:12px 22px; color:var(--dnff-text-dim); font-family:var(--dnff-font-head);
  font-size:0.85rem; letter-spacing:1px; text-transform:uppercase; border-bottom:2px solid transparent;
}
.woocommerce-tabs ul.tabs li.active a{ color:var(--dnff-accent); border-color:var(--dnff-accent); }
.woocommerce-tabs .panel{ color:var(--dnff-text-dim); }
.woocommerce-tabs .panel h2{ margin-bottom:16px; }
.woocommerce-Reviews #comments{ margin-top:10px; }
.woocommerce-Reviews .comment-form-rating select, .woocommerce-Reviews input, .woocommerce-Reviews textarea{
  background:var(--dnff-black-soft); border:1px solid var(--dnff-border); color:var(--dnff-text); border-radius:var(--dnff-radius-sm); padding:10px 12px;
}
.star-rating{ color:var(--dnff-accent); }
.star-rating span::before{ color:var(--dnff-accent); }
p.stars a{ color:var(--dnff-text-dim); }

/* Quantity input (kept for visual consistency even though no cart flow) */
.quantity .qty{
  background:var(--dnff-black-soft); border:1px solid var(--dnff-border); color:var(--dnff-text);
  border-radius:var(--dnff-radius-sm); padding:12px; width:80px;
}

.related.products{ margin-top:60px; padding-top:40px; border-top:1px solid var(--dnff-border); }
.related.products > h2{ margin-bottom:24px; }

/* Sidebar / widgets */
.widget{ background:var(--dnff-panel); border:1px solid var(--dnff-border); border-radius:var(--dnff-radius); padding:22px; margin-bottom:24px; }
.widget-title{ font-family:var(--dnff-font-head); font-size:0.95rem; letter-spacing:1px; text-transform:uppercase; color:#fff; margin-bottom:16px; }
.widget ul li{ padding:8px 0; border-bottom:1px solid var(--dnff-border); }
.widget ul li:last-child{ border-bottom:none; }
.widget ul li a{ color:var(--dnff-text-dim); }
.widget ul li a:hover{ color:var(--dnff-accent); }

/* =====================================================================
   7. ABOUT / CONTACT PAGES
===================================================================== */
.dnff-about-grid{ display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:center; }
.dnff-fact-list{ display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:26px; }
.dnff-fact{ background:var(--dnff-panel); border:1px solid var(--dnff-border); border-radius:var(--dnff-radius-sm); padding:18px; }
.dnff-fact strong{ display:block; font-family:var(--dnff-font-head); color:var(--dnff-accent); font-size:1.4rem; }
.dnff-fact span{ font-size:0.8rem; color:var(--dnff-text-dim); text-transform:uppercase; letter-spacing:1px; }

.dnff-contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:40px; }
.dnff-contact-card{ background:var(--dnff-panel); border:1px solid var(--dnff-border); border-radius:var(--dnff-radius); padding:30px; }
.dnff-contact-item{ display:flex; gap:16px; align-items:flex-start; margin-bottom:22px; }
.dnff-contact-icon{
  width:46px; height:46px; border-radius:12px; flex-shrink:0;
  background:linear-gradient(135deg,var(--dnff-red),var(--dnff-blue));
  display:flex; align-items:center; justify-content:center; color:#fff; font-size:1.2rem;
}
.dnff-map-wrap{ border-radius:var(--dnff-radius); overflow:hidden; border:1px solid var(--dnff-border); margin-top:24px; }
.dnff-map-wrap iframe{ width:100%; height:300px; border:0; filter:grayscale(0.3) invert(0.92) contrast(0.9); display:block; }

.dnff-form label{ display:block; font-size:0.85rem; color:var(--dnff-text-dim); margin-bottom:8px; text-transform:uppercase; letter-spacing:1px; }
.dnff-form input, .dnff-form textarea{
  width:100%; padding:14px 16px; background:var(--dnff-black-soft); border:1px solid var(--dnff-border);
  color:var(--dnff-text); border-radius:var(--dnff-radius-sm); margin-bottom:20px; transition:border-color var(--dnff-transition);
}
.dnff-form input:focus, .dnff-form textarea:focus{ outline:none; border-color:var(--dnff-accent); }
.dnff-form-msg{ padding:14px 18px; border-radius:var(--dnff-radius-sm); margin-bottom:20px; font-weight:600; }
.dnff-form-msg.success{ background:rgba(61,220,132,0.12); border:1px solid rgba(61,220,132,0.4); color:#3ddc84; }
.dnff-form-msg.error{ background:rgba(232,16,46,0.12); border:1px solid rgba(232,16,46,0.4); color:#ff8f9c; }

@media (max-width:860px){
  .dnff-about-grid, .dnff-contact-grid, .dnff-fact-list{ grid-template-columns:1fr; }
}

/* =====================================================================
   8. CATEGORY MARQUEE / STRIP
===================================================================== */
.dnff-marquee{ overflow:hidden; border-top:1px solid var(--dnff-border); border-bottom:1px solid var(--dnff-border); padding:18px 0; background:var(--dnff-black-soft); }
.dnff-marquee-track{ display:flex; gap:60px; width:max-content; animation:dnffMarquee 30s linear infinite; }
.dnff-marquee-track span{ font-family:var(--dnff-font-head); letter-spacing:2px; text-transform:uppercase; color:var(--dnff-text-dim); font-size:0.9rem; white-space:nowrap; }
.dnff-marquee-track span em{ color:var(--dnff-accent); font-style:normal; }
@keyframes dnffMarquee{ from{ transform:translateX(0);} to{ transform:translateX(-50%);} }

/* =====================================================================
   9. FOOTER
===================================================================== */
#dnff-footer{ background:linear-gradient(180deg, var(--dnff-black-soft), #05050a); border-top:1px solid var(--dnff-border); padding-top:60px; }
.dnff-footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:40px; padding-bottom:40px; }
.dnff-footer-col h4{ font-family:var(--dnff-font-head); font-size:0.95rem; letter-spacing:1px; text-transform:uppercase; color:#fff; margin-bottom:18px; }
.dnff-footer-col p, .dnff-footer-col li{ color:var(--dnff-text-dim); font-size:0.92rem; margin-bottom:10px; }
.dnff-footer-col a{ color:var(--dnff-text-dim); }
.dnff-footer-col a:hover{ color:var(--dnff-accent); }
.dnff-footer-bottom{ border-top:1px solid var(--dnff-border); padding:20px 0; text-align:center; font-size:0.85rem; color:var(--dnff-text-dim); }
.dnff-footer-bottom a{ color:var(--dnff-text); }
.dnff-social{ display:flex; gap:12px; margin-top:14px; }
.dnff-social a{
  width:38px; height:38px; border-radius:50%; border:1px solid var(--dnff-border);
  display:flex; align-items:center; justify-content:center; color:var(--dnff-text);
}
.dnff-social a:hover{ border-color:var(--dnff-accent); color:var(--dnff-accent); transform:translateY(-2px); }
@media (max-width:960px){ .dnff-footer-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:600px){ .dnff-footer-grid{ grid-template-columns:1fr; } }

/* =====================================================================
   10. FLOATING WHATSAPP / CALL BUTTONS
===================================================================== */
.dnff-float-stack{ position:fixed; right:22px; bottom:22px; z-index:9999; display:flex; flex-direction:column; gap:14px; }
.dnff-float-btn{
  width:58px; height:58px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  color:#fff; font-size:1.5rem; box-shadow:0 8px 24px rgba(0,0,0,0.5); transition:transform var(--dnff-transition);
  position:relative;
}
.dnff-float-btn:hover{ transform:scale(1.1); color:#fff; }
.dnff-float-btn.whatsapp{ background:#25D366; }
.dnff-float-btn.call{ background:linear-gradient(135deg,var(--dnff-red),var(--dnff-blue)); }
.dnff-float-btn::before{
  content:""; position:absolute; inset:0; border-radius:50%; background:inherit; opacity:0.6;
  animation:dnffPing 2.4s cubic-bezier(0,0,0.2,1) infinite; z-index:-1;
}
@keyframes dnffPing{ 0%{ transform:scale(1); opacity:0.5;} 100%{ transform:scale(1.8); opacity:0;} }

/* =====================================================================
   11. SCROLL REVEAL
===================================================================== */
.dnff-reveal{ opacity:0; transform:translateY(24px); transition:opacity 0.7s ease, transform 0.7s ease; }
.dnff-reveal.is-visible{ opacity:1; transform:translateY(0); }

/* =====================================================================
   12. RESPONSIVE NAV
===================================================================== */
@media (max-width:960px){
  .dnff-primary-menu{
    position:fixed; top:0; right:-320px; width:300px; height:100vh; background:var(--dnff-panel);
    flex-direction:column; align-items:flex-start; padding:90px 26px 26px; gap:6px;
    transition:right var(--dnff-transition); overflow-y:auto; border-left:1px solid var(--dnff-border);
  }
  .dnff-primary-menu.is-open{ right:0; }
  .dnff-primary-menu li{ width:100%; }
  .dnff-primary-menu .sub-menu{ position:static; opacity:1; visibility:visible; transform:none; display:none; border:none; background:none; padding-left:12px; }
  .dnff-primary-menu li.menu-item-has-children.is-open .sub-menu{ display:block; }
  .dnff-menu-toggle{ display:flex; }
  .dnff-menu-toggle.is-active span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
  .dnff-menu-toggle.is-active span:nth-child(2){ opacity:0; }
  .dnff-menu-toggle.is-active span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }
}

/* =====================================================================
   6b. PRODUCT GALLERY (custom, colour-aware)
===================================================================== */
.dnff-gallery{ position:relative; }
.dnff-gallery-main{
  position:relative; aspect-ratio:1/1; border-radius:var(--dnff-radius-sm); overflow:hidden;
  background:var(--dnff-black-soft); border:1px solid var(--dnff-border);
}
.dnff-gallery-main-img{
  width:100%; height:100%; object-fit:cover; cursor:zoom-in;
  transition:opacity 0.35s ease, transform 0.35s ease;
}
.dnff-gallery-main.is-swapping .dnff-gallery-main-img{ opacity:0; transform:scale(0.97); }
.dnff-gallery-zoom{
  position:absolute; right:14px; bottom:14px; width:40px; height:40px; border-radius:50%;
  background:rgba(10,10,15,0.7); border:1px solid var(--dnff-border); color:#fff; cursor:pointer;
  font-size:1.1rem; display:flex; align-items:center; justify-content:center; transition:var(--dnff-transition);
}
.dnff-gallery-zoom:hover{ background:var(--dnff-red); border-color:var(--dnff-red); }
.dnff-gallery-thumbs{ display:flex; gap:10px; margin-top:14px; flex-wrap:wrap; }
.dnff-gallery-thumb{
  width:72px; height:72px; border-radius:10px; overflow:hidden; border:2px solid var(--dnff-border);
  background:var(--dnff-black-soft); padding:0; cursor:pointer; transition:border-color var(--dnff-transition), transform var(--dnff-transition);
}
.dnff-gallery-thumb img{ width:100%; height:100%; object-fit:cover; }
.dnff-gallery-thumb:hover{ transform:translateY(-2px); }
.dnff-gallery-thumb.is-active{ border-color:var(--dnff-accent); }
.dnff-gallery-thumb.dnff-fade-in{ animation:dnffThumbFade 0.4s ease; }
@keyframes dnffThumbFade{ from{ opacity:0; transform:translateY(6px);} to{ opacity:1; transform:translateY(0);} }

.dnff-lightbox{
  position:fixed; inset:0; background:rgba(5,5,8,0.94); z-index:99999; display:flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden; transition:opacity 0.3s ease; padding:40px;
}
.dnff-lightbox.is-open{ opacity:1; visibility:visible; }
.dnff-lightbox-img{ max-width:90vw; max-height:85vh; border-radius:10px; box-shadow:0 20px 60px rgba(0,0,0,0.6); }
.dnff-lightbox-close, .dnff-lightbox-prev, .dnff-lightbox-next{
  position:absolute; background:rgba(255,255,255,0.08); border:1px solid var(--dnff-border); color:#fff;
  border-radius:50%; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:var(--dnff-transition);
}
.dnff-lightbox-close{ top:24px; right:24px; width:44px; height:44px; font-size:1.5rem; }
.dnff-lightbox-prev, .dnff-lightbox-next{ top:50%; transform:translateY(-50%); width:52px; height:52px; font-size:1.8rem; }
.dnff-lightbox-prev{ left:20px; }
.dnff-lightbox-next{ right:20px; }
.dnff-lightbox-close:hover, .dnff-lightbox-prev:hover, .dnff-lightbox-next:hover{ background:var(--dnff-red); border-color:var(--dnff-red); }

/* =====================================================================
   6c. VARIATION SWATCHES (colour circles + size/type pill buttons)
===================================================================== */
.dnff-variations-wrap{ margin-top:10px; }
.dnff-attribute-group{ margin-bottom:24px; }
.dnff-attribute-label{
  display:flex; justify-content:space-between; align-items:baseline; margin-bottom:12px;
  font-family:var(--dnff-font-head); font-size:0.85rem; letter-spacing:1.5px; text-transform:uppercase; color:var(--dnff-text-dim);
}
.dnff-attribute-selected{ color:var(--dnff-accent); font-family:var(--dnff-font-body); font-weight:700; letter-spacing:normal; text-transform:none; font-size:0.95rem; }

.dnff-swatch-group{ display:flex; flex-wrap:wrap; gap:12px; }

.dnff-swatch{
  cursor:pointer; border:none; font-family:var(--dnff-font-body); transition:transform var(--dnff-transition), box-shadow var(--dnff-transition), border-color var(--dnff-transition), opacity var(--dnff-transition);
}

.dnff-swatch-color{
  width:48px; height:48px; border-radius:50%; border:2px solid var(--dnff-border);
  display:flex; align-items:center; justify-content:center; position:relative; box-shadow:inset 0 0 0 3px var(--dnff-panel);
}
.dnff-swatch-color:hover{ transform:translateY(-3px); }
.dnff-swatch-color.is-selected{ border-color:var(--dnff-accent); box-shadow:0 0 0 3px rgba(0,229,255,0.25), inset 0 0 0 3px var(--dnff-panel); }
.dnff-swatch-color .dnff-swatch-letter{ font-family:var(--dnff-font-head); font-size:0.8rem; color:#111; background:#fff; width:100%; height:100%; border-radius:50%; display:flex; align-items:center; justify-content:center; }

.dnff-swatch-pill{
  padding:11px 20px; border-radius:50px; background:var(--dnff-black-soft); border:1px solid var(--dnff-border);
  color:var(--dnff-text); font-weight:600; font-size:0.92rem;
}
.dnff-swatch-pill:hover{ border-color:var(--dnff-accent); color:var(--dnff-accent); transform:translateY(-2px); }
.dnff-swatch-pill.is-selected{ background:linear-gradient(90deg,var(--dnff-red),var(--dnff-blue)); border-color:transparent; color:#fff; box-shadow:0 6px 18px rgba(179,0,27,0.35); }

.dnff-swatch.is-unavailable{ display:none !important; }

.dnff-native-select{
  position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

a.dnff-reset-variations{ display:inline-block; margin-top:2px; font-size:0.85rem; color:var(--dnff-text-dim); }
a.dnff-reset-variations:hover{ color:var(--dnff-red-bright); }

.dnff-variation-whatsapp.disabled{ pointer-events:none; opacity:0.55; }

/* =====================================================================
   13. UTILITIES / MISC
===================================================================== */
.dnff-card-badge{
  position:absolute; top:12px; left:12px; background:rgba(10,10,15,0.75); border:1px solid var(--dnff-accent);
  color:var(--dnff-accent); font-family:var(--dnff-font-head); font-size:0.68rem; letter-spacing:1px; text-transform:uppercase;
  padding:5px 10px; border-radius:50px;
}
.woocommerce .woocommerce-message, .woocommerce .woocommerce-info, .woocommerce .woocommerce-error{
  background:var(--dnff-panel); border-left:4px solid var(--dnff-accent); color:var(--dnff-text);
  border-radius:var(--dnff-radius-sm); padding:16px 20px;
}
.woocommerce nav.woocommerce-pagination ul li{ background:transparent; border:1px solid var(--dnff-border); border-radius:6px; margin-right:6px; }
.woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span{ color:var(--dnff-text); padding:8px 14px; }
.woocommerce nav.woocommerce-pagination ul li span.current{ background:var(--dnff-red); color:#fff; }
.screen-reader-text{ position:absolute !important; clip:rect(1px,1px,1px,1px); overflow:hidden; height:1px; width:1px; }
