/*
Theme Name: UniGrano S.A. 2026 Web
Theme URI: https://unigranosa.com
Author: UniGrano S.A.
Description: Premium responsive corporate website inspired by the official UniGrano S.A. 2026 brochure. Built as a real website with bilingual content, product cards, trade flow, responsive navigation and transparent brand assets.
Version: 2.0.0
Requires at least: 6.0
Tested up to: 7.1
Requires PHP: 7.4
Text Domain: unigrano-web-2026
*/

:root{
  --navy:#031529;
  --navy2:#07223e;
  --navy3:#0b3156;
  --ink:#d9e4ef;
  --muted:#9fb1c3;
  --gold:#d4a32f;
  --gold2:#f2d77b;
  --line:rgba(212,163,47,.28);
  --panel:rgba(8,31,55,.72);
  --white:#fff;
  --max:1200px;
  --radius:22px;
  --shadow:0 28px 80px rgba(0,0,0,.28);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--navy)}
body{margin:0;background:var(--navy);color:var(--white);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;-webkit-font-smoothing:antialiased}
body.admin-bar .ug-header{top:32px}
a{color:inherit}
img{max-width:100%;display:block}
button,input,textarea{font:inherit}
::selection{background:var(--gold);color:var(--navy)}

.ug-shell{width:min(var(--max),calc(100% - 40px));margin-inline:auto}
.ug-kicker{display:inline-flex;align-items:center;gap:9px;color:var(--gold2);font-size:.78rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.ug-kicker:before{content:"";width:28px;height:1px;background:var(--gold)}
.ug-title{font-family:Georgia,"Times New Roman",serif;font-size:clamp(2.2rem,5vw,4.6rem);line-height:.98;margin:10px 0 18px;letter-spacing:-.025em}
.ug-title em{font-style:normal;color:var(--gold2)}
.ug-lead{font-size:clamp(1rem,1.5vw,1.22rem);line-height:1.75;color:var(--ink);max-width:760px}
.ug-es{display:none}
html[data-lang="es"] .ug-en{display:none!important}
html[data-lang="es"] .ug-es{display:initial}
html[data-lang="es"] div.ug-es,html[data-lang="es"] p.ug-es,html[data-lang="es"] section.ug-es{display:block}

/* Header */
.ug-header{position:fixed;top:0;left:0;right:0;z-index:1000;background:linear-gradient(180deg,rgba(3,21,41,.96),rgba(3,21,41,.80));backdrop-filter:blur(14px);border-bottom:1px solid rgba(212,163,47,.16);transition:.25s ease}
.ug-header.is-scrolled{background:rgba(3,21,41,.97);box-shadow:0 14px 40px rgba(0,0,0,.22)}
.ug-header-inner{width:min(var(--max),calc(100% - 40px));height:84px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:28px}
.ug-brand{display:flex;align-items:center;text-decoration:none;flex:none}
.ug-brand img{width:230px;height:auto;background:transparent!important}
.ug-nav{display:flex;align-items:center;gap:24px;margin-left:auto}
.ug-nav a{text-decoration:none;color:#eaf0f6;font-size:.84rem;font-weight:750;letter-spacing:.02em;opacity:.88;transition:.18s ease}
.ug-nav a:hover{color:var(--gold2);opacity:1}
.ug-tools{display:flex;align-items:center;gap:10px}
.ug-lang{display:inline-flex;border:1px solid var(--line);border-radius:999px;padding:3px;background:rgba(255,255,255,.03)}
.ug-lang button{border:0;background:transparent;color:#b8c4d0;font-weight:800;font-size:.72rem;padding:7px 9px;border-radius:999px;cursor:pointer}
.ug-lang button.is-active{background:linear-gradient(135deg,var(--gold2),var(--gold));color:var(--navy)}
.ug-menu-btn{display:none;border:1px solid var(--line);background:rgba(255,255,255,.04);color:#fff;border-radius:12px;padding:10px 12px;cursor:pointer}

/* Hero */
.ug-hero{min-height:760px;display:flex;align-items:center;position:relative;padding:150px 0 80px;overflow:hidden;background:#031529}
.ug-hero:before{content:"";position:absolute;inset:0;background-image:linear-gradient(90deg,rgba(3,21,41,.98) 0%,rgba(3,21,41,.91) 37%,rgba(3,21,41,.42) 68%,rgba(3,21,41,.18) 100%),linear-gradient(180deg,rgba(3,21,41,.08),rgba(3,21,41,.5)),url('assets/images/hero.webp');background-size:cover;background-position:center 54%}
.ug-hero:after{content:"";position:absolute;inset:auto 0 0;height:170px;background:linear-gradient(transparent,var(--navy));pointer-events:none}
.ug-hero-inner{position:relative;z-index:1;width:min(var(--max),calc(100% - 40px));margin:auto}
.ug-hero-copy{max-width:760px}
.ug-hero h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(3rem,6.7vw,6.4rem);line-height:.92;margin:18px 0 20px;letter-spacing:-.04em;text-wrap:balance}
.ug-hero h1 span{color:var(--gold2)}
.ug-hero p{max-width:650px;color:#dce5ee;font-size:clamp(1rem,1.6vw,1.25rem);line-height:1.68}
.ug-hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.ug-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 20px;border-radius:12px;text-decoration:none;font-weight:850;font-size:.88rem;letter-spacing:.01em;transition:.2s ease}
.ug-btn-primary{background:linear-gradient(135deg,var(--gold2),var(--gold));color:var(--navy);box-shadow:0 12px 32px rgba(212,163,47,.20)}
.ug-btn-secondary{border:1px solid rgba(242,215,123,.44);background:rgba(3,21,41,.38);color:#fff}
.ug-btn:hover{transform:translateY(-2px)}
.ug-hero-meta{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin-top:74px;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:var(--line);max-width:960px;box-shadow:var(--shadow)}
.ug-meta-item{background:rgba(3,21,41,.88);padding:19px 22px}
.ug-meta-item strong{display:block;color:var(--gold2);font-size:.88rem;margin-bottom:5px}
.ug-meta-item span{font-size:.75rem;color:#b5c3d1;line-height:1.45}

/* Sections */
.ug-section{position:relative;padding:108px 0;scroll-margin-top:90px}
.ug-section-alt{background:linear-gradient(180deg,#041a30,#031529)}
.ug-grid-2{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);gap:64px;align-items:center}
.ug-image-frame{position:relative;border-radius:var(--radius);overflow:hidden;min-height:520px;border:1px solid var(--line);box-shadow:var(--shadow);background:#0a2847}
.ug-image-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ug-image-frame:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(3,21,41,.62))}
.ug-note{margin-top:26px;padding:17px 19px;border-left:2px solid var(--gold);background:rgba(255,255,255,.035);color:#c9d5df;line-height:1.65;border-radius:0 12px 12px 0}

.ug-card-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:40px}
.ug-card{border:1px solid var(--line);border-radius:16px;background:linear-gradient(180deg,rgba(11,43,74,.64),rgba(4,24,44,.72));padding:22px;min-height:168px;transition:.2s ease}
.ug-card:hover{transform:translateY(-4px);border-color:rgba(242,215,123,.52);background:linear-gradient(180deg,rgba(14,52,88,.78),rgba(4,24,44,.82))}
.ug-card-index{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:rgba(212,163,47,.11);border:1px solid rgba(242,215,123,.42);color:var(--gold2);font-size:.75rem;font-weight:900;margin-bottom:18px}
.ug-card h3{margin:0 0 8px;font-size:1rem}.ug-card p{margin:0;color:var(--muted);font-size:.88rem;line-height:1.58}

/* Fertilizer feature */
.ug-feature-pair{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:42px}
.ug-feature{position:relative;overflow:hidden;min-height:470px;border-radius:var(--radius);border:1px solid var(--line);box-shadow:var(--shadow);display:flex;align-items:flex-end;text-decoration:none}
.ug-feature img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .55s ease}
.ug-feature:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,21,41,.08) 26%,rgba(3,21,41,.96) 93%)}
.ug-feature:hover img{transform:scale(1.045)}
.ug-feature-copy{position:relative;z-index:2;padding:32px;width:100%}
.ug-feature-copy small{color:var(--gold2);font-weight:900;letter-spacing:.11em;text-transform:uppercase}
.ug-feature-copy h3{font-family:Georgia,"Times New Roman",serif;font-size:clamp(2rem,4vw,3.4rem);margin:7px 0 10px;line-height:1}
.ug-feature-copy p{color:#d7e0e9;line-height:1.6;margin:0;max-width:520px}

/* Product sections */
.ug-product-layout{display:grid;grid-template-columns:1.05fr .95fr;gap:54px;align-items:center}
.ug-product-image{min-height:620px;border-radius:var(--radius);overflow:hidden;position:relative;border:1px solid var(--line);box-shadow:var(--shadow)}
.ug-product-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ug-product-image:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 58%,rgba(3,21,41,.5))}
.ug-benefits{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:28px 0}
.ug-benefit{padding:15px;border:1px solid var(--line);border-radius:13px;background:rgba(255,255,255,.025)}
.ug-benefit strong{display:block;color:#f2f5f8;font-size:.9rem}.ug-benefit span{display:block;color:var(--gold2);font-size:.75rem;margin-top:4px}
.ug-specs{border:1px solid var(--line);border-radius:16px;overflow:hidden;margin-top:26px}
.ug-specs-row{display:grid;grid-template-columns:1fr 1.2fr;padding:13px 16px;border-bottom:1px solid rgba(212,163,47,.12);gap:16px}
.ug-specs-row:last-child{border-bottom:0}.ug-specs-row span:first-child{color:#9fb0c1;font-size:.83rem}.ug-specs-row strong{font-size:.86rem}
.ug-pill-list{display:flex;flex-wrap:wrap;gap:9px;margin-top:24px}
.ug-pill{border:1px solid var(--line);border-radius:999px;padding:9px 12px;color:#dce4ec;font-size:.78rem;background:rgba(255,255,255,.025)}

/* Commodities */
.ug-commodities{background:radial-gradient(circle at 90% 10%,rgba(212,163,47,.08),transparent 30%),linear-gradient(180deg,#031529,#041b31)}
.ug-product-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:42px}
.ug-product-card{overflow:hidden;border-radius:18px;border:1px solid var(--line);background:#061f39;transition:.2s ease}
.ug-product-card:hover{transform:translateY(-4px);border-color:rgba(242,215,123,.48)}
.ug-product-card img{width:100%;height:188px;object-fit:cover}
.ug-product-card div{padding:18px 18px 20px}
.ug-product-card h3{margin:0;font-family:Georgia,"Times New Roman",serif;font-size:1.35rem}.ug-product-card p{margin:5px 0 0;color:var(--gold2);font-size:.82rem}
.ug-industrial{display:grid;grid-template-columns:1fr 1.2fr;gap:20px;margin-top:20px;border:1px solid var(--line);border-radius:20px;overflow:hidden;background:linear-gradient(135deg,#082441,#041729)}
.ug-industrial img{width:100%;height:100%;min-height:260px;object-fit:cover}.ug-industrial-copy{padding:34px}.ug-industrial-copy h3{font-family:Georgia,"Times New Roman",serif;font-size:2.2rem;margin:6px 0 10px}.ug-industrial-copy p{color:var(--muted);line-height:1.7}

/* Trade */
.ug-trade-visual{min-height:520px;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);position:relative;box-shadow:var(--shadow)}
.ug-trade-visual img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ug-flow{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:42px 0}
.ug-flow-step{position:relative;padding:24px 16px 20px;border-radius:16px;border:1px solid var(--line);background:linear-gradient(180deg,rgba(12,46,78,.75),rgba(4,24,44,.82));text-align:center}
.ug-flow-step b{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;margin:0 auto 12px;background:linear-gradient(135deg,var(--gold2),var(--gold));color:var(--navy);font-size:.78rem}.ug-flow-step strong{display:block;font-size:.88rem}.ug-flow-step span{display:block;color:var(--gold2);font-size:.73rem;margin-top:4px}
.ug-service-list{display:grid;grid-template-columns:1fr 1fr;gap:10px}.ug-service{padding:15px 16px;border-radius:12px;background:rgba(255,255,255,.025);border:1px solid rgba(212,163,47,.14);color:#dbe4ed;font-size:.88rem}

/* Contact */
.ug-contact{padding:0;position:relative;overflow:hidden}
.ug-contact-bg{position:absolute;inset:0}
.ug-contact-bg img{width:100%;height:100%;object-fit:cover}
.ug-contact-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,21,41,.98),rgba(3,21,41,.80) 52%,rgba(3,21,41,.44)),linear-gradient(180deg,rgba(3,21,41,.15),rgba(3,21,41,.8))}
.ug-contact-inner{position:relative;z-index:1;min-height:680px;display:flex;align-items:center;padding:100px 0}
.ug-contact-panel{width:min(690px,100%);padding:36px;border:1px solid rgba(242,215,123,.32);border-radius:22px;background:rgba(3,21,41,.72);backdrop-filter:blur(12px);box-shadow:var(--shadow)}
.ug-contact-panel h2{font-family:Georgia,"Times New Roman",serif;font-size:clamp(2.5rem,5vw,4.6rem);line-height:1;margin:10px 0 18px}
.ug-contact-panel p{color:#d9e3ec;line-height:1.7;font-size:1.04rem}.ug-contact-details{display:grid;gap:10px;margin:26px 0}.ug-contact-detail{display:flex;gap:12px;align-items:flex-start;color:#dfe7ee}.ug-contact-detail b{color:var(--gold2);min-width:86px}.ug-contact-detail a{text-decoration:none}.ug-contact-detail a:hover{color:var(--gold2)}

/* Footer */
.ug-footer{background:#020d19;border-top:1px solid rgba(212,163,47,.16)}
.ug-footer-inner{width:min(var(--max),calc(100% - 40px));margin:auto;padding:28px 0 36px;display:flex;align-items:center;justify-content:space-between;gap:22px;color:#8fa1b3;font-size:.78rem}
.ug-footer-logo{width:190px;opacity:.88}.ug-footer a{text-decoration:none;color:#c7d3df}.ug-footer a:hover{color:var(--gold2)}

/* Reveal */
.ug-reveal{opacity:0;transform:translateY(20px);transition:opacity .65s ease,transform .65s ease}.ug-reveal.is-visible{opacity:1;transform:none}

@media (max-width:1020px){
  body.admin-bar .ug-header{top:46px}
  .ug-nav{display:none;position:absolute;top:100%;left:0;right:0;padding:18px 20px 24px;background:rgba(3,21,41,.98);border-bottom:1px solid var(--line);flex-direction:column;align-items:flex-start;gap:15px}
  .ug-nav.is-open{display:flex}.ug-menu-btn{display:block}.ug-header-inner{height:74px}.ug-brand img{width:200px}
  .ug-grid-2,.ug-product-layout{grid-template-columns:1fr}.ug-grid-2{gap:34px}.ug-image-frame,.ug-product-image{min-height:470px}
  .ug-card-grid{grid-template-columns:1fr 1fr}.ug-flow{grid-template-columns:1fr 1fr 1fr}.ug-hero-meta{grid-template-columns:1fr 1fr}.ug-feature-pair{grid-template-columns:1fr}.ug-feature{min-height:420px}
}
@media (max-width:720px){
  .ug-shell,.ug-header-inner,.ug-hero-inner,.ug-footer-inner{width:min(100% - 24px,var(--max))}
  .ug-header-inner{gap:12px}.ug-brand img{width:168px}.ug-tools{gap:6px}.ug-lang button{padding:6px 8px}.ug-menu-btn{padding:8px 9px}
  .ug-hero{min-height:690px;padding-top:130px}.ug-hero:before{background-image:linear-gradient(180deg,rgba(3,21,41,.90) 0%,rgba(3,21,41,.78) 55%,rgba(3,21,41,.92) 100%),url('assets/images/hero.webp');background-position:56% center}.ug-hero h1{font-size:clamp(2.75rem,13vw,4.2rem)}.ug-hero-meta{margin-top:42px;grid-template-columns:1fr 1fr}.ug-meta-item{padding:15px}.ug-meta-item span{font-size:.69rem}
  .ug-section{padding:76px 0}.ug-title{font-size:clamp(2rem,10vw,3.4rem)}.ug-card-grid,.ug-product-cards,.ug-benefits,.ug-service-list{grid-template-columns:1fr}.ug-feature{min-height:380px}.ug-feature-copy{padding:24px}.ug-image-frame,.ug-product-image,.ug-trade-visual{min-height:390px}.ug-product-cards{gap:12px}.ug-product-card img{height:170px}.ug-industrial{grid-template-columns:1fr}.ug-industrial img{min-height:220px}.ug-industrial-copy{padding:26px}.ug-flow{grid-template-columns:1fr 1fr}.ug-contact-inner{min-height:640px;padding:76px 0}.ug-contact-panel{padding:26px}.ug-contact-detail{display:grid;gap:4px}.ug-footer-inner{flex-direction:column;align-items:flex-start}.ug-footer-logo{width:170px}
}
@media (max-width:430px){
  .ug-hero-meta{grid-template-columns:1fr}.ug-flow{grid-template-columns:1fr}.ug-tools .ug-lang{display:none}.ug-brand img{width:182px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.ug-reveal{opacity:1;transform:none;transition:none}.ug-feature img,.ug-btn,.ug-card,.ug-product-card{transition:none}}
