/* ==========================================================================
   Angie — Angelica Marica portfolio theme (dark editorial)
   Black · white · rose-pink accent · Jost geometric sans
   ========================================================================== */

:root{
  --black:   #0c0c0c;
  --black-2: #151515;
  --ink:     #1a1a1a;
  --gray:    #6f6f6f;
  --gray-2:  #9a9a9a;
  --light:   #f4f4f4;
  --line:    #e6e6e6;
  --line-dk: #2a2a2a;
  --white:   #ffffff;
  --pink:    #e2668d;
  --pink-2:  #ee7fa2;
  --pink-dk: #cf4f79;

  --font: "Jost", "Century Gothic", "Helvetica Neue", Arial, sans-serif;

  --wrap: 1180px;
  --shadow: 0 20px 45px -24px rgba(0,0,0,.5);
  --ease: cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  margin:0; font-family:var(--font); color:var(--ink);
  background:var(--white); font-size:16px; line-height:1.8; font-weight:300;
  overflow-x:hidden;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; }

.wrap{ width:min(var(--wrap), 90vw); margin-inline:auto; }
.section{ padding:clamp(3.5rem,8vw,7rem) 0; position:relative; }
.center{ text-align:center; }

/* ---- Typography ---- */
h1,h2,h3,h4{ font-weight:500; letter-spacing:.02em; line-height:1.15; margin:0; }
.eyebrow{
  display:inline-block; font-size:.72rem; font-weight:500; letter-spacing:.35em;
  text-transform:uppercase; color:var(--pink); margin-bottom:1rem;
}
.sec-title{
  font-size:clamp(1.9rem,4.5vw,2.9rem); font-weight:500; letter-spacing:.06em;
  text-transform:uppercase; margin:0 0 1.4rem;
}
.sec-title .thin{ font-weight:300; }
.sec-head{ margin-bottom:clamp(2.2rem,5vw,3.4rem); }
.sec-head .divider{ width:70px; height:2px; background:var(--pink); margin-top:1.1rem; }
.sec-head.center .divider{ margin-inline:auto; }
.lead{ font-size:1.02rem; color:var(--gray); font-weight:300; }
p{ margin:0 0 1.1rem; }

/* ---- Buttons ---- */
.btn{
  display:inline-flex; align-items:center; gap:.6rem;
  font-size:.74rem; font-weight:500; letter-spacing:.2em; text-transform:uppercase;
  padding:1.05em 2.1em; background:var(--pink); color:#fff; border:1px solid var(--pink);
  transition:.35s var(--ease);
}
.btn:hover{ background:transparent; color:var(--pink); }
.btn--ghost{ background:transparent; color:#fff; border-color:rgba(255,255,255,.5); }
.btn--ghost:hover{ background:#fff; color:var(--ink); border-color:#fff; }
.btn--dark{ background:var(--ink); border-color:var(--ink); color:#fff; }
.btn--dark:hover{ background:transparent; color:var(--ink); }

/* ==========================================================================
   Header (top nav)
   ========================================================================== */
.site-header{
  position:absolute; top:0; left:0; right:0; z-index:60; background:transparent;
}
.site-header.is-solid,.site-header.scrolled{
  position:fixed; background:rgba(12,12,12,.95); backdrop-filter:blur(8px);
  box-shadow:0 6px 30px -20px rgba(0,0,0,.9);
}
.nav{ display:flex; align-items:center; justify-content:space-between; gap:1.5rem; padding:1.4rem 0; }
.brand{ display:flex; flex-direction:column; line-height:1; }
.brand .mark{ font-size:1.5rem; font-weight:500; letter-spacing:.42em; color:#fff; text-transform:uppercase; }
.brand .sub{ font-size:.52rem; letter-spacing:.42em; text-transform:uppercase; color:var(--pink); margin-top:.45rem; }
.site-header.on-light .brand .mark{ color:var(--ink); }

.menu{ display:flex; align-items:center; gap:1.7rem; list-style:none; margin:0; padding:0; }
.menu > li{ position:relative; }
.menu a{
  font-size:.76rem; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:#fff;
  padding:.4rem 0; transition:.25s; white-space:nowrap;
}
.menu a:hover,.menu .current a{ color:var(--pink); }
.site-header.on-light .menu a{ color:var(--ink); }
.site-header.on-light .menu a:hover{ color:var(--pink); }
.menu .has-sub > a::after{ content:"⌄"; margin-left:.35rem; font-size:.9em; opacity:.8; }
.sub-menu{
  position:absolute; top:100%; left:-1rem; min-width:170px; background:#161616;
  list-style:none; margin:.6rem 0 0; padding:.6rem 0; opacity:0; visibility:hidden;
  transform:translateY(8px); transition:.28s var(--ease); box-shadow:var(--shadow);
}
.menu li:hover > .sub-menu{ opacity:1; visibility:visible; transform:translateY(0); }
.sub-menu a{ display:block; padding:.55rem 1.3rem; color:#ddd; letter-spacing:.12em; }
.sub-menu a:hover{ color:var(--pink); background:#1e1e1e; }

.nav-cart{ position:relative; color:#fff; display:inline-flex; }
.site-header.on-light .nav-cart{ color:var(--ink); }
.nav-cart .count{
  position:absolute; top:-8px; right:-10px; background:var(--pink); color:#fff;
  font-size:.6rem; width:16px; height:16px; border-radius:50%; display:grid; place-items:center;
}
.nav-toggle{ display:none; background:none; border:0; padding:.3rem; }
.nav-toggle span{ display:block; width:26px; height:2px; background:#fff; margin:6px 0; transition:.3s var(--ease); }
.site-header.on-light .nav-toggle span{ background:var(--ink); }

/* ==========================================================================
   Hero (home)
   ========================================================================== */
.hero{ position:relative; min-height:100vh; display:flex; align-items:flex-end;
  background:var(--black); color:#fff; overflow:hidden; }
.hero::before{ content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(8,8,8,.82) 0%, rgba(8,8,8,.35) 45%, rgba(8,8,8,.15) 100%); z-index:1; }
.hero-bg{ position:absolute; inset:0; }
.hero-bg img{ width:100%; height:100%; object-fit:cover; object-position:60% 30%; }
.hero .wrap{ position:relative; z-index:2; padding:0 0 clamp(4rem,10vh,9rem); }
.hero .eyebrow{ color:var(--pink-2); }
.hero-title{ font-size:clamp(2.8rem,8vw,6rem); font-weight:400; letter-spacing:.04em;
  text-transform:uppercase; line-height:1.02; margin:.4rem 0 1rem; }
.hero-title b{ font-weight:600; }
.hero-roles{ display:flex; flex-wrap:wrap; gap:.6rem 1.6rem; margin:0 0 2rem; color:#d7d7d7;
  font-size:.8rem; letter-spacing:.22em; text-transform:uppercase; }
.hero-roles span{ display:flex; align-items:center; gap:.6rem; }
.hero-roles span::before{ content:""; width:6px; height:6px; background:var(--pink); border-radius:50%; }
.hero-actions{ display:flex; flex-wrap:wrap; gap:1rem; }
.scroll-cue{ position:absolute; left:50%; bottom:1.6rem; z-index:2; transform:translateX(-50%);
  width:1px; height:52px; background:linear-gradient(var(--pink),transparent); }

/* ==========================================================================
   About
   ========================================================================== */
.about .wrap{ display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(2rem,5vw,4.5rem); align-items:center; }
.about-media{ position:relative; }
.about-media img{ width:100%; aspect-ratio:4/5; object-fit:cover; }
.about-media::after{ content:""; position:absolute; inset:14px -14px -14px 14px; border:1px solid var(--pink); z-index:-1; }
.about-cols{ display:grid; grid-template-columns:1fr 1fr; gap:1.5rem 2rem; margin:1.6rem 0; }
.about-cols h3{ font-size:.8rem; letter-spacing:.2em; text-transform:uppercase; color:var(--pink); margin-bottom:.5rem; }
.about-cols p{ font-size:.95rem; color:var(--gray); margin:0; }
.awards{ display:flex; flex-wrap:wrap; gap:1.4rem 2.4rem; align-items:center; margin-top:1.8rem;
  padding-top:1.6rem; border-top:1px solid var(--line); }
.awards .stat b{ font-size:1.7rem; font-weight:500; color:var(--pink); display:block; line-height:1; }
.awards .stat span{ font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; color:var(--gray); }

/* ==========================================================================
   Services icon band (dark)
   ========================================================================== */
.svc-band{ background:var(--black); color:#fff; }
.svc-band .wrap{ display:grid; grid-template-columns:1fr 1.3fr; gap:clamp(2rem,5vw,4rem); align-items:center; }
.svc-band-media img{ width:100%; aspect-ratio:3/4; object-fit:cover; }
.svc-icons{ display:grid; grid-template-columns:1fr 1fr; gap:1.4rem; }
.svc-icon{ display:flex; gap:1rem; align-items:flex-start; padding:1.1rem; border:1px solid var(--line-dk);
  transition:.35s var(--ease); }
.svc-icon:hover{ border-color:var(--pink); background:#141414; transform:translateY(-4px); }
.svc-icon .ic{ flex:0 0 40px; width:40px; height:40px; display:grid; place-items:center; color:var(--pink); }
.svc-icon .ic svg{ width:30px; height:30px; }
.svc-icon h4{ font-size:.92rem; letter-spacing:.06em; text-transform:uppercase; margin:.1rem 0 .3rem; }
.svc-icon p{ font-size:.82rem; color:var(--gray-2); margin:0; }

/* ==========================================================================
   Team / On-camera trio
   ========================================================================== */
.team-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.6rem; }
.member{ text-align:center; }
.member .photo{ position:relative; overflow:hidden; }
.member .photo img{ width:100%; aspect-ratio:3/4; object-fit:cover; transition:.6s var(--ease); }
.member:hover .photo img{ transform:scale(1.05); }
.member .photo::after{ content:""; position:absolute; inset:0; background:rgba(226,102,141,.0); transition:.4s; }
.member:hover .photo::after{ background:rgba(226,102,141,.12); }
.member h4{ font-size:1.05rem; letter-spacing:.1em; text-transform:uppercase; margin:1.1rem 0 .25rem; }
.member span{ font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:var(--pink); }

/* ==========================================================================
   Pricing / Packages
   ========================================================================== */
.pricing{ position:relative; color:#fff; background:var(--black); }
.pricing-bg{ position:absolute; inset:0; opacity:.22; }
.pricing-bg img{ width:100%; height:100%; object-fit:cover; }
.pricing .wrap{ position:relative; z-index:2; }
.price-cols{ display:grid; grid-template-columns:1fr 1fr; gap:1.6rem; }
.price-card{ background:rgba(10,10,10,.72); border:1px solid var(--line-dk); padding:clamp(1.8rem,3vw,2.6rem); }
.price-card h3{ font-size:1rem; letter-spacing:.16em; text-transform:uppercase; color:var(--pink); margin-bottom:1.4rem;
  padding-bottom:.9rem; border-bottom:1px solid var(--line-dk); }
.price-row{ display:flex; justify-content:space-between; gap:1rem; align-items:baseline; padding:.7rem 0;
  border-bottom:1px dashed var(--line-dk); }
.price-row:last-child{ border-bottom:0; }
.price-row .name{ font-size:.92rem; letter-spacing:.03em; }
.price-row .amt{ font-size:.92rem; color:var(--pink); white-space:nowrap; letter-spacing:.06em; }

/* ==========================================================================
   Portfolio 3x3
   ========================================================================== */
.portfolio{ background:var(--light); }
.gallery{ display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.shot{ position:relative; overflow:hidden; background:#ddd; }
.shot img{ width:100%; aspect-ratio:4/5; object-fit:cover; transition:.7s var(--ease); }
.shot::after{ content:""; position:absolute; inset:0; background:rgba(12,12,12,.55); opacity:0; transition:.4s var(--ease); }
.shot .meta{ position:absolute; inset:auto 0 1.2rem 1.2rem; z-index:2; color:#fff; opacity:0; transform:translateY(12px); transition:.4s var(--ease); }
.shot .meta b{ display:block; font-size:1rem; letter-spacing:.08em; text-transform:uppercase; font-weight:500; }
.shot .meta span{ font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; color:var(--pink-2); }
.shot:hover img{ transform:scale(1.08); }
.shot:hover::after{ opacity:1; }
.shot:hover .meta{ opacity:1; transform:translateY(0); }

/* ==========================================================================
   Reviews (dark band)
   ========================================================================== */
.reviews{ position:relative; color:#fff; background:var(--black); text-align:center; }
.reviews-bg{ position:absolute; inset:0; opacity:.16; }
.reviews-bg img{ width:100%; height:100%; object-fit:cover; }
.reviews .wrap{ position:relative; z-index:2; max-width:760px; }
.reviews .quote{ font-size:clamp(1.2rem,2.6vw,1.6rem); font-weight:300; line-height:1.6; margin:1.2rem 0; }
.reviews .who{ font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:var(--pink); }
.reviews .stars{ color:var(--pink); letter-spacing:.3em; margin-bottom:1rem; }
.rev-dots{ display:flex; gap:.5rem; justify-content:center; margin-top:1.6rem; }
.rev-dots i{ width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.3); }
.rev-dots i.on{ background:var(--pink); }

/* ==========================================================================
   Latest News (blog cards)
   ========================================================================== */
.news-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.6rem; }
.news-card{ background:#fff; box-shadow:0 14px 40px -30px rgba(0,0,0,.5); transition:.4s var(--ease); }
.news-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow); }
.news-card .thumb{ overflow:hidden; }
.news-card .thumb img{ width:100%; aspect-ratio:3/2; object-fit:cover; transition:.6s var(--ease); }
.news-card:hover .thumb img{ transform:scale(1.06); }
.news-card .body{ padding:1.5rem 1.5rem 1.8rem; }
.news-card .cat{ font-size:.66rem; letter-spacing:.18em; text-transform:uppercase; color:var(--pink); }
.news-card h3{ font-size:1.1rem; letter-spacing:.04em; text-transform:uppercase; margin:.6rem 0 .8rem; }
.news-card h3 a:hover{ color:var(--pink); }
.news-card p{ font-size:.9rem; color:var(--gray); margin:0 0 1rem; }
.news-card .date{ font-size:.72rem; color:var(--gray-2); letter-spacing:.06em; }

/* ==========================================================================
   Contact
   ========================================================================== */
.contact .wrap{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,4rem); align-items:start; }
.contact-list{ list-style:none; margin:1.6rem 0 0; padding:0; }
.contact-list li{ display:flex; gap:1rem; align-items:center; padding:.8rem 0; border-bottom:1px solid var(--line); }
.contact-list .ic{ width:40px; height:40px; flex:0 0 40px; display:grid; place-items:center; color:var(--pink); border:1px solid var(--line); border-radius:50%; }
.contact-list b{ display:block; font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; color:var(--gray); }
.contact-list span{ font-size:.98rem; }
.form{ }
.form .row{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.field{ margin-bottom:1rem; }
.field input,.field textarea{
  width:100%; font-family:var(--font); font-size:.92rem; color:var(--ink);
  background:var(--light); border:1px solid var(--line); padding:.95rem 1rem; transition:.25s;
}
.field input:focus,.field textarea:focus{ outline:none; border-color:var(--pink); background:#fff; }
.field textarea{ min-height:130px; resize:vertical; }

/* ==========================================================================
   Page hero (subpages)
   ========================================================================== */
.page-hero{ position:relative; min-height:360px; display:flex; align-items:center; background:var(--black); color:#fff; overflow:hidden; }
.page-hero::before{ content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(8,8,8,.85), rgba(8,8,8,.25) 70%); z-index:1; }
.page-hero-bg{ position:absolute; inset:0; }
.page-hero-bg img{ width:100%; height:100%; object-fit:cover; object-position:70% 30%; }
.page-hero .wrap{ position:relative; z-index:2; padding:5.5rem 0 3rem; }
.page-hero .eyebrow{ color:var(--pink-2); }
.page-hero h1{ font-size:clamp(2rem,5vw,3.2rem); font-weight:400; letter-spacing:.08em; text-transform:uppercase; }
.page-hero .divider{ width:60px; height:2px; background:#fff; margin-top:1rem; }

/* ==========================================================================
   Services listing (Template-02) — 2-col cards w/ labels
   ========================================================================== */
.svc-list{ display:grid; grid-template-columns:1fr 1fr; gap:1.8rem 1.8rem; }
.svc-item{ position:relative; }
.svc-item .img{ overflow:hidden; }
.svc-item .img img{ width:100%; aspect-ratio:16/11; object-fit:cover; transition:.6s var(--ease); }
.svc-item:hover .img img{ transform:scale(1.05); }
.svc-item .label{ background:#fff; box-shadow:var(--shadow); margin:-2.8rem 1.4rem 0; position:relative; z-index:2;
  padding:1.15rem 1.5rem; display:flex; justify-content:space-between; align-items:center; }
.svc-item .label h3{ font-size:1.02rem; letter-spacing:.06em; text-transform:uppercase; font-weight:400; }
.svc-item .label .go{ color:var(--pink); font-size:1.1rem; }

/* ==========================================================================
   Sidebar layout (Template-03/04/05/06)
   ========================================================================== */
.layout-sidebar{ display:grid; grid-template-columns:230px 1fr; gap:0; }
.side-nav{ padding:clamp(2rem,4vw,3.5rem) 2rem clamp(2rem,4vw,3.5rem) 0; }
.side-nav .brand{ margin-bottom:2.6rem; }
.side-nav .brand .mark{ color:var(--pink); font-size:1.5rem; }
.side-nav .vmenu{ list-style:none; margin:0; padding:0; }
.side-nav .vmenu li{ margin:.1rem 0; }
.side-nav .vmenu a{ font-size:.78rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ink); padding:.55rem 0; display:inline-block; }
.side-nav .vmenu a:hover,.side-nav .vmenu .current a{ color:var(--pink); }
.side-nav .socials{ display:flex; gap:.9rem; margin-top:2rem; color:var(--gray); }
.side-nav .socials a:hover{ color:var(--pink); }
.side-nav .copy{ font-size:.66rem; color:var(--gray-2); margin-top:1.4rem; letter-spacing:.04em; }
.side-main{ min-width:0; }

.svc-detail{ display:grid; grid-template-columns:1fr 300px; gap:clamp(1.6rem,3vw,2.6rem); padding:clamp(2rem,4vw,3.5rem) 0; }
.svc-widget{ background:var(--black); color:#fff; padding:1.8rem 1.6rem; align-self:start; }
.svc-widget h3{ font-size:1rem; letter-spacing:.16em; text-transform:uppercase; margin-bottom:1rem; padding-bottom:.8rem; border-bottom:2px solid var(--pink); }
.svc-widget ul{ list-style:none; margin:0; padding:0; }
.svc-widget li a{ display:flex; justify-content:space-between; align-items:center; padding:.7rem .9rem; font-size:.82rem; letter-spacing:.08em; color:#cfcfcf; transition:.25s; }
.svc-widget li a:hover,.svc-widget li.current a{ background:var(--pink); color:#fff; }
.svc-widget li a .go{ opacity:.7; }
.detail-title{ font-size:1.5rem; letter-spacing:.06em; text-transform:uppercase; margin:1.4rem 0 1rem; }
.detail-body{ color:var(--gray); font-size:.95rem; }
.price-line{ display:flex; justify-content:space-between; gap:1rem; align-items:baseline; margin-top:1.2rem; padding-bottom:.3rem; border-bottom:1px solid var(--line); }
.price-line .n{ color:var(--pink); letter-spacing:.06em; }
.price-line .p{ color:var(--pink); font-weight:500; }
.detail-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-top:1.6rem; }
.detail-grid img{ width:100%; aspect-ratio:1/1; object-fit:cover; }

/* Blog */
.blog-layout{ display:grid; grid-template-columns:1fr 300px; gap:clamp(1.6rem,3vw,2.6rem); }
.post-card{ background:#fff; margin-bottom:2.2rem; box-shadow:0 14px 40px -30px rgba(0,0,0,.5); }
.post-card .thumb img{ width:100%; aspect-ratio:16/10; object-fit:cover; }
.post-card .body{ padding:1.6rem 1.8rem 2rem; }
.post-card .cat{ font-size:.66rem; letter-spacing:.18em; text-transform:uppercase; color:var(--pink); }
.post-card h2{ font-size:1.3rem; letter-spacing:.04em; text-transform:uppercase; margin:.6rem 0 .8rem; }
.post-card h2 a:hover{ color:var(--pink); }
.post-card p{ color:var(--gray); font-size:.92rem; }
.post-card .date{ font-size:.72rem; color:var(--gray-2); }
.widget{ background:var(--black); color:#fff; padding:1.6rem 1.5rem; margin-bottom:1.4rem; }
.widget h3{ font-size:.92rem; letter-spacing:.16em; text-transform:uppercase; margin-bottom:1rem; padding-bottom:.7rem; border-bottom:2px solid var(--pink); }
.widget .search{ display:flex; }
.widget .search input{ flex:1; background:#fff; border:0; padding:.7rem .8rem; font-family:var(--font); }
.widget .search button{ background:var(--pink); color:#fff; border:0; padding:0 1rem; }
.widget ul{ list-style:none; margin:0; padding:0; }
.widget li{ padding:.4rem 0; font-size:.85rem; color:#cfcfcf; border-bottom:1px dashed var(--line-dk); }
.widget li:last-child{ border:0; }
.widget .rp{ display:flex; gap:.8rem; align-items:center; padding:.5rem 0; }
.widget .rp img{ width:56px; height:44px; object-fit:cover; }
.tagcloud{ display:flex; flex-wrap:wrap; gap:.5rem; }
.tagcloud a{ background:var(--pink); color:#fff; font-size:.66rem; letter-spacing:.1em; padding:.4em .8em; }

/* Pagination */
.pager{ display:flex; gap:.5rem; justify-content:center; margin-top:2rem; }
.pager a,.pager span{ min-width:40px; height:40px; display:grid; place-items:center; background:#fff; border:1px solid var(--line); font-size:.8rem; }
.pager .cur{ background:var(--pink); color:#fff; border-color:var(--pink); }

/* ==========================================================================
   Shop (WooCommerce-style)
   ========================================================================== */
.shop-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; }
.product{ position:relative; background:#fff; overflow:hidden; }
.product .pimg{ position:relative; overflow:hidden; }
.product .pimg img{ width:100%; aspect-ratio:1/1; object-fit:cover; transition:.6s var(--ease); }
.product:hover .pimg img{ transform:scale(1.05); }
.product .price-tag{ position:absolute; top:1rem; right:0; background:var(--pink); color:#fff; font-size:.72rem; letter-spacing:.06em; padding:.3rem .7rem; writing-mode:vertical-rl; }
.product .pname{ position:absolute; left:1.1rem; bottom:1rem; color:#fff; font-size:1.05rem; letter-spacing:.06em; z-index:2; text-shadow:0 2px 10px rgba(0,0,0,.5); }
.product .pactions{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; gap:.7rem; background:rgba(12,12,12,.35); opacity:0; transition:.35s; }
.product:hover .pactions{ opacity:1; }
.product .pactions a{ width:44px; height:44px; border-radius:50%; background:#fff; color:var(--ink); display:grid; place-items:center; transition:.25s; }
.product .pactions a:hover{ background:var(--pink); color:#fff; }

/* Single product */
.product-single{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,4vw,3.5rem); }
.p-gallery .main img{ width:100%; aspect-ratio:1/1; object-fit:cover; }
.p-gallery .thumbs{ display:grid; grid-template-columns:repeat(4,1fr); gap:.6rem; margin-top:.6rem; }
.p-gallery .thumbs img{ width:100%; aspect-ratio:1/1; object-fit:cover; cursor:pointer; }
.p-info h1{ font-size:2rem; letter-spacing:.02em; margin-bottom:.6rem; }
.p-info .rating{ color:var(--pink); letter-spacing:.2em; font-size:.9rem; }
.p-info .rating small{ color:var(--gray); letter-spacing:normal; margin-left:.5rem; }
.p-info .price{ color:var(--pink); font-size:1.7rem; margin:1rem 0; }
.p-info .desc{ color:var(--gray); font-size:.95rem; }
.qty-row{ display:flex; gap:1rem; align-items:center; margin:1.6rem 0; }
.qty{ display:flex; align-items:center; border:1px solid var(--line); }
.qty button{ width:44px; height:44px; background:var(--pink); color:#fff; border:0; font-size:1.1rem; }
.qty input{ width:56px; height:44px; text-align:center; border:0; font-family:var(--font); }
.p-meta{ font-size:.84rem; color:var(--gray); }
.p-meta a{ color:var(--pink); }
.p-tabs{ display:flex; gap:.6rem; flex-wrap:wrap; margin:2.5rem 0 1.4rem; }
.p-tabs button{ background:#fff; border:1px solid var(--line); padding:.8rem 1.6rem; font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; }
.p-tabs button.on{ background:var(--pink); color:#fff; border-color:var(--pink); }

/* Cart */
.cart-table{ width:100%; border-collapse:collapse; }
.cart-table th{ background:var(--pink); color:#fff; font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; font-weight:500; padding:1rem; }
.cart-table td{ border:1px solid var(--line); padding:1rem; text-align:center; font-size:.9rem; }
.cart-table img{ width:80px; height:80px; object-fit:cover; margin:auto; }
.cart-totals{ max-width:420px; margin-left:auto; margin-top:2rem; }
.cart-totals h3{ font-size:1.4rem; letter-spacing:.04em; text-transform:uppercase; margin-bottom:1rem; }
.cart-totals table{ width:100%; border-collapse:collapse; }
.cart-totals td{ border:1px solid var(--line); padding:.9rem 1rem; }

/* ==========================================================================
   Footer
   ========================================================================== */
.site-footer{ background:var(--black); color:#bdbdbd; padding:clamp(3rem,6vw,4.5rem) 0 1.6rem; }
.footer-top{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:2.4rem; padding-bottom:2.4rem; }
.footer-top .fbrand{ font-size:1.6rem; letter-spacing:.4em; text-transform:uppercase; color:var(--pink); }
.footer-top p{ font-size:.9rem; margin:1.1rem 0; max-width:34ch; }
.footer-top .ftitle{ font-size:.82rem; letter-spacing:.2em; text-transform:uppercase; color:var(--pink); margin-bottom:1.3rem; }
.footer-top ul{ list-style:none; margin:0; padding:0; }
.footer-top li{ display:flex; gap:.7rem; padding:.4rem 0; font-size:.9rem; }
.footer-top li .k{ color:var(--pink); min-width:96px; }
.fsocials{ display:flex; gap:1rem; margin-top:.4rem; color:var(--pink); }
.fsocials a{ transition:.25s; } .fsocials a:hover{ color:#fff; }
.footer-bottom{ border-top:1px solid var(--line-dk); padding-top:1.4rem; text-align:center; font-size:.76rem; color:var(--gray); letter-spacing:.06em; }

/* ==========================================================================
   Reveal
   ========================================================================== */
.reveal{ opacity:0; transform:translateY(26px); transition:.8s var(--ease); }
.reveal.in{ opacity:1; transform:none; }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width:1024px){
  .team-grid,.gallery,.news-grid,.shop-grid{ grid-template-columns:repeat(2,1fr); }
  .svc-detail,.blog-layout,.product-single{ grid-template-columns:1fr; }
  .layout-sidebar{ grid-template-columns:1fr; }
  .side-nav{ padding-right:0; }
  .side-nav .vmenu{ display:flex; flex-wrap:wrap; gap:.4rem 1.4rem; }
}
@media (max-width:860px){
  .menu,.nav-cart{ display:none; }
  .nav-toggle{ display:block; }
  .about .wrap,.svc-band .wrap,.contact .wrap,.price-cols,.svc-icons,.svc-list{ grid-template-columns:1fr; }
  .about-media,.svc-band-media{ max-width:440px; margin-inline:auto; }
  .menu.open{ display:flex; position:fixed; inset:0; z-index:200; flex-direction:column;
    justify-content:center; align-items:center; gap:1.6rem; background:rgba(12,12,12,.98); }
  .menu.open a{ color:#fff; font-size:1.1rem; }
  .menu.open .sub-menu{ position:static; opacity:1; visibility:visible; transform:none; background:transparent; box-shadow:none; text-align:center; }
  body.nav-open{ overflow:hidden; }
  .nav-toggle.active{ position:fixed; right:5vw; top:1.5rem; z-index:201; }
  .nav-toggle.active span{ background:#fff; }
  .nav-toggle.active span:nth-child(1){ transform:translateY(8px) rotate(45deg); }
  .nav-toggle.active span:nth-child(2){ opacity:0; }
  .nav-toggle.active span:nth-child(3){ transform:translateY(-8px) rotate(-45deg); }
}
@media (max-width:560px){
  .team-grid,.gallery,.news-grid,.shop-grid,.about-cols,.detail-grid,.footer-top{ grid-template-columns:1fr; }
  .form .row{ grid-template-columns:1fr; }
  .gallery{ grid-template-columns:1fr 1fr; gap:.5rem; }
}

/* Elementor takeover */
.elementor-page .site-main > .fallback-content{ display:none; }