/*
Theme Name: Aluoxiprint
Theme URI: https://aluoxiprint.pl
Author: Aluoxiprint
Author URI: https://aluoxiprint.pl
Description: Motyw dla Aluoxiprint — blachy aluminiowe anodowane. Model sklepu: zapytanie ofertowe (bez koszyka i płatności online). Zbudowany na bazie prototypu w skali szarości, styl minimalistyczny/przemysłowy.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Tested up to: 6.6
Text Domain: aluoxiprint
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/

:root{
  --ink:#1B1B1B;
  --steel-100:#F6F6F6;
  --steel-200:#E7E7E7;
  --steel-300:#C9C9C9;
  --steel-400:#8F8F8F;
  --steel-500:#5C5C5C;
  --radius:2px;
}

/* ---------- RESET / BASE ---------- */
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--steel-100);
  color:var(--ink);
  font-family:'Inter',sans-serif;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; height:auto; display:block;}
a{color:inherit; text-decoration:none;}
ul{list-style:none;}
.mono{font-family:'IBM Plex Mono',monospace; letter-spacing:0.02em;}
.wrap{max-width:1180px; margin:0 auto; padding:0 32px;}

/* ---------- NAV ---------- */
nav{
  position:sticky; top:0; z-index:50;
  background:rgba(246,246,246,0.92);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--steel-300);
}
nav .wrap{display:flex; align-items:center; justify-content:space-between; height:72px;}
.logo{
  font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:19px; letter-spacing:-0.01em;
  display:flex; align-items:center; gap:10px;
}
.logo-mark{width:20px; height:20px; background:linear-gradient(135deg, var(--ink), var(--steel-400)); border-radius:1px;}
.nav-links{display:flex; align-items:center; gap:32px; font-size:14px; font-weight:500;}
.nav-links ul{display:flex; align-items:center; gap:32px;}
.nav-links a{color:var(--ink); opacity:0.7; transition:opacity .15s;}
.nav-links a:hover{opacity:1;}
.nav-cta{font-size:13px; font-weight:600; padding:10px 18px; background:var(--ink); color:var(--steel-100); border-radius:var(--radius);}
@media(max-width:820px){.nav-links{display:none;}}

/* ---------- HERO ---------- */
.hero{padding:92px 0 56px; display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center;}
.eyebrow{
  font-family:'IBM Plex Mono',monospace; font-size:12px; font-weight:600;
  letter-spacing:0.08em; text-transform:uppercase; color:var(--steel-400);
  display:flex; align-items:center; gap:10px; margin-bottom:22px;
}
.eyebrow::before{content:''; width:22px; height:1px; background:var(--steel-400);}
h1{font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:48px; line-height:1.08; letter-spacing:-0.02em; margin-bottom:22px;}
h1 .thin{color:var(--steel-400); font-weight:500;}
.hero p.lead{font-size:16.5px; color:var(--steel-500); max-width:430px; margin-bottom:32px;}
.btn-row{display:flex; gap:14px; flex-wrap:wrap;}
.btn-primary{background:var(--ink); color:var(--steel-100); padding:14px 26px; font-size:14px; font-weight:600; border-radius:var(--radius); display:inline-block; transition:opacity .15s; border:none; cursor:pointer;}
.btn-primary:hover{opacity:0.82;}
.btn-secondary{border:1px solid var(--steel-300); padding:14px 26px; font-size:14px; font-weight:600; border-radius:var(--radius); display:inline-block; transition:border-color .15s;}
.btn-secondary:hover{border-color:var(--ink);}
.ship-note{margin-top:26px; font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--steel-400); display:flex; align-items:center; gap:8px;}
.ship-note .dot{width:5px; height:5px; border-radius:50%; background:var(--steel-400);}

.swatch-stage{position:relative; aspect-ratio:4/5; border-radius:3px; overflow:hidden; cursor:pointer; box-shadow:0 1px 2px rgba(0,0,0,0.05), 0 20px 40px -20px rgba(0,0,0,0.3);}
.swatch-metal{position:absolute; inset:0; background:repeating-linear-gradient(115deg,#e2e2e2 0px,#ededed 2px,#d7d7d7 3px,#ededed 5px), linear-gradient(160deg,#f0f0f0,#cfcfcf);}
.swatch-print{position:absolute; inset:0; background:radial-gradient(circle at 28% 22%,#4a4a4a,transparent 55%), radial-gradient(circle at 74% 70%,#6b6b6b,transparent 55%), linear-gradient(135deg,#141414,#2b2b2b); clip-path:polygon(0 0,0 0,0 0,0 0); transition:clip-path .85s cubic-bezier(.65,0,.35,1);}
.swatch-stage:hover .swatch-print{clip-path:polygon(0 0,100% 0,100% 100%,0% 100%);}
.swatch-label{position:absolute; left:18px; bottom:18px; z-index:2; font-family:'IBM Plex Mono',monospace; font-size:12px; color:#fff; background:rgba(20,20,20,0.55); padding:6px 10px; border-radius:2px; opacity:0; transition:opacity .3s;}
.swatch-stage:hover .swatch-label{opacity:1;}
.swatch-hint{position:absolute; top:18px; right:18px; z-index:2; font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--ink); background:rgba(255,255,255,0.78); padding:6px 10px; border-radius:2px;}

/* ---------- WHY US ---------- */
.why{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--steel-300); border-top:1px solid var(--steel-300); border-bottom:1px solid var(--steel-300);}
.why-card{background:var(--steel-100); padding:26px 30px; display:flex; gap:16px; align-items:flex-start;}
.why-num{font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--steel-400); flex-shrink:0; padding-top:2px;}
.why-card h4{font-family:'Space Grotesk',sans-serif; font-size:15px; font-weight:600; margin-bottom:4px;}
.why-card p{font-size:12.5px; color:var(--steel-500);}

/* ---------- RULER ---------- */
.ruler{border-top:1px solid var(--steel-300); border-bottom:1px solid var(--steel-300); padding:14px 0; overflow:hidden;}
.ruler .wrap{display:flex; align-items:center; gap:40px; font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--steel-400); white-space:nowrap; overflow-x:auto;}
.ruler span{display:flex; align-items:center; gap:8px; flex-shrink:0;}
.ruler span::before{content:''; width:1px; height:12px; background:var(--steel-300);}

/* ---------- SECTIONS ---------- */
.section{padding:88px 0;}
.section-head{max-width:560px; margin-bottom:48px;}
.section-head .eyebrow{margin-bottom:14px;}
.section-head h2{font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:30px; letter-spacing:-0.01em; margin-bottom:14px;}
.section-head p{color:var(--steel-500); font-size:15.5px;}

/* ---------- ABOUT ---------- */
.about-grid{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start;}
.about-copy p{color:var(--steel-500); font-size:15px; margin-bottom:14px;}
.photo-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:12px;}
.photo-tile{aspect-ratio:3/4; border-radius:3px; position:relative; overflow:hidden; display:flex; align-items:flex-end; padding:12px; background-size:cover; background-position:center;}
.photo-tile span{font-family:'IBM Plex Mono',monospace; font-size:10.5px; color:rgba(255,255,255,0.85); background:rgba(20,20,20,0.4); padding:4px 8px; border-radius:2px;}
.photo-tile.t1{background-color:#eef0f1; background-image:linear-gradient(150deg,#eef0f1,#c7ccd0 45%,#f2f3f4 75%);}
.photo-tile.t2{background-color:#2a2a2a; background-image:linear-gradient(150deg,#2a2a2a,#141414);}
.photo-tile.t3{background-color:#dfe1e2; background-image:linear-gradient(150deg,#dfe1e2,#b8bcbf 50%,#e5e7e8);}

/* ---------- PRODUCT TEASER CARDS (front page) ---------- */
.products{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.p-card{border:1px solid var(--steel-300); border-radius:3px; overflow:hidden; background:#fff; transition:border-color .2s, transform .2s; display:flex; flex-direction:column;}
.p-card:hover{border-color:var(--ink); transform:translateY(-3px);}
.p-swatch{height:150px; position:relative; background-size:cover; background-position:center;}
.p-swatch.silver{background-image:linear-gradient(150deg,#eef0f1,#c7ccd0 45%,#f2f3f4 75%);}
.p-swatch.black{background-image:linear-gradient(150deg,#2a2a2a,#141414);}
.p-swatch.natural{background-image:linear-gradient(150deg,#dfe1e2,#b8bcbf 50%,#e5e7e8);}
.p-body{padding:18px; display:flex; flex-direction:column; flex:1;}
.p-body .btn-secondary, .p-body .p-inquire{margin-top:auto !important; padding-top:14px !important;}
.p-body h3{font-family:'Space Grotesk',sans-serif; font-size:16px; font-weight:600; margin-bottom:6px;}
.p-body p{font-size:13px; color:var(--steel-500);}
.p-spec{margin-top:12px; font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--steel-400); display:flex; justify-content:space-between; border-top:1px dashed var(--steel-300); padding-top:10px;}

/* ---------- SPEC TABLE ---------- */
.spec-table{border:1px solid var(--steel-300); border-radius:3px; overflow:hidden; background:#fff;}
.spec-row{display:grid; grid-template-columns:1.2fr 1fr 1fr 1.6fr; font-family:'IBM Plex Mono',monospace; font-size:13px;}
.spec-row > div{padding:16px 20px; border-bottom:1px solid var(--steel-200);}
.spec-row:last-child > div{border-bottom:none;}
.spec-row.head{background:var(--ink); color:var(--steel-100); font-weight:600; font-size:11.5px; text-transform:uppercase; letter-spacing:0.06em;}
.spec-row.head > div{border-bottom:none;}
.spec-row:not(.head):hover > div{background:var(--steel-100);}

/* ---------- APPLICATIONS ---------- */
.apps{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--steel-300); border:1px solid var(--steel-300);}
.app-card{background:var(--steel-100); padding:28px 22px; min-height:150px; display:flex; flex-direction:column; justify-content:space-between;}
.app-num{font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--steel-400);}
.app-card h4{font-family:'Space Grotesk',sans-serif; font-size:15.5px; font-weight:600; margin-top:20px;}
.app-card p{font-size:12.5px; color:var(--steel-500); margin-top:6px;}

/* ---------- FAQ ---------- */
.faq-list{border-top:1px solid var(--steel-300);}
.faq-item{border-bottom:1px solid var(--steel-300); padding:22px 0;}
.faq-item h4{font-family:'Space Grotesk',sans-serif; font-size:15.5px; font-weight:600; margin-bottom:8px; display:flex; gap:12px;}
.faq-item h4 .q-mark{font-family:'IBM Plex Mono',monospace; font-size:13px; color:var(--steel-400); flex-shrink:0;}
.faq-item p{font-size:13.5px; color:var(--steel-500); padding-left:24px;}
.faq-more{margin-top:24px;}

/* ---------- INTL / SHIPPING ---------- */
.intl{border:1px solid var(--steel-300); border-radius:3px; background:#fff; padding:36px 40px; display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:32px; align-items:center;}
.intl h4{font-family:'Space Grotesk',sans-serif; font-size:17px; font-weight:600; margin-bottom:8px;}
.intl p{font-size:13.5px; color:var(--steel-500);}
.intl-stat{border-left:1px solid var(--steel-200); padding-left:24px;}
.intl-stat .num{font-family:'IBM Plex Mono',monospace; font-size:22px; font-weight:600; color:var(--ink);}
.intl-stat .lbl{font-size:12px; color:var(--steel-400); margin-top:4px;}

/* ---------- CTA ---------- */
.cta{background:var(--ink); color:var(--steel-100); border-radius:4px; padding:64px 56px; display:flex; align-items:center; justify-content:space-between; gap:40px;}
.cta h3{font-family:'Space Grotesk',sans-serif; font-size:27px; font-weight:600; max-width:420px;}
.cta p{color:var(--steel-300); font-size:14px; margin-top:10px; max-width:380px;}
.cta .btn-primary{background:var(--steel-100); color:var(--ink);}

/* ---------- FOOTER ---------- */
footer{padding:40px 0 60px; border-top:1px solid var(--steel-300); margin-top:20px;}
footer .wrap{display:flex; flex-direction:column; align-items:flex-start; gap:16px; font-size:13px; color:var(--steel-400);}
.footer-top{display:flex; justify-content:space-between; align-items:center; width:100%; flex-wrap:wrap; gap:10px;}
.footer-legal{display:flex; gap:22px; flex-wrap:wrap;}
.footer-legal a{font-size:12.5px; color:var(--steel-400); transition:color .15s;}
.footer-legal a:hover{color:var(--ink);}
.footer-legal ul{display:flex; gap:22px; flex-wrap:wrap;}

@media(max-width:900px){
  .hero{grid-template-columns:1fr; padding-top:60px;}
  h1{font-size:34px;}
  .why{grid-template-columns:1fr;}
  .about-grid{grid-template-columns:1fr;}
  .products{grid-template-columns:repeat(2,1fr);}
  .apps{grid-template-columns:repeat(2,1fr);}
  .spec-row{grid-template-columns:1fr 1fr;}
  .cta{flex-direction:column; align-items:flex-start; padding:40px 28px;}
  .intl{grid-template-columns:1fr;}
  .intl-stat{border-left:none; padding-left:0; border-top:1px solid var(--steel-200); padding-top:16px;}
}


/* ---------- GUIDES / KNOWLEDGE ---------- */
.guides{display:grid; grid-template-columns:repeat(4,1fr); gap:20px;}
.guide-card{
  border:1px solid var(--steel-300); border-radius:3px; background:#fff; padding:22px;
  display:flex; flex-direction:column; justify-content:space-between; min-height:200px;
  transition:border-color .2s, transform .2s;
}
.guide-card:hover{border-color:var(--ink); transform:translateY(-3px);}
.guide-tag{
  font-family:'IBM Plex Mono',monospace; font-size:10.5px; color:var(--steel-400);
  text-transform:uppercase; letter-spacing:0.06em; margin-bottom:14px; display:block;
}
.guide-card h4{font-family:'Space Grotesk',sans-serif; font-size:15.5px; font-weight:600; margin-bottom:8px; line-height:1.3;}
.guide-card p{font-size:12.5px; color:var(--steel-500); flex-grow:1;}
.guide-read{
  font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--ink);
  margin-top:16px; display:flex; align-items:center; gap:6px;
}

/* =====================================================================
   FORMULARZ ZAPYTANIA OFERTOWEGO
   Zastępuje koszyk/checkout — klient wysyła zapytanie, właściciel
   odpowiada z wyceną ręcznie. Obsługa w functions.php (wp_mail, bez wtyczek).
   ===================================================================== */

.form-notice{
  border-radius:3px; padding:16px 20px; font-size:14px; margin-bottom:24px;
  border-left:3px solid var(--ink);
}
.form-notice--ok{background:#eef4ee; border-left-color:#3d7a4a; color:#2e5c38;}
.form-notice--error{background:#faeeee; border-left-color:#a13d3d; color:#7a2e2e;}

.inquiry-form{
  border:1px solid var(--steel-300); border-radius:3px; background:#fff;
  padding:36px 40px; max-width:760px;
}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-bottom:20px;}
.form-row-full{display:block; margin-bottom:20px;}
.inquiry-form label{
  font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--steel-400);
  text-transform:uppercase; letter-spacing:0.05em; display:block;
}
.inquiry-form input, .inquiry-form select, .inquiry-form textarea{
  margin-top:8px; width:100%; border:1px solid var(--steel-300); border-radius:var(--radius);
  padding:12px 14px; font-family:'Inter',sans-serif; font-size:14px; color:var(--ink);
  background:#fff; text-transform:none; letter-spacing:normal;
}
.inquiry-form input:focus, .inquiry-form select:focus, .inquiry-form textarea:focus{
  outline:none; border-color:var(--ink);
}
.inquiry-form textarea{resize:vertical;}
.inquiry-form button{border:none; cursor:pointer;}

@media(max-width:700px){
  .guides{grid-template-columns:repeat(2,1fr);}
  .form-row{grid-template-columns:1fr;}
  .inquiry-form{padding:28px 22px;}
}