/*
Theme Name: studiomaunau
Theme URI: https://studio.vn/
Author: dev.com.vn
Author URI: https://dev.com.vn/
Description: Studio.vn cream/caramel creative platform theme converted from the supplied HTML. Font system preserved exactly: Cormorant Garamond for logo/headings and Inter for body/menu/buttons.
Version: 1.0.1
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: studiomaunau
Tags: custom-logo, custom-menu, featured-images, editor-style, wide-blocks, woocommerce
*/

:root{
      --paper:#fbf7f0;--paper2:#f2e5d4;--white:#fffdf8;--ink:#4a3023;--muted:#806b59;
      --gold:#b8773f;--gold2:#d9b17e;--line:#ead8c5;--shadow:0 18px 42px rgba(108,72,39,.11);--container:1220px;
    }
    *{box-sizing:border-box} html{scroll-behavior:smooth;background:var(--paper)} 
    body{margin:0;background:radial-gradient(circle at 8% 8%,rgba(184,119,63,.10),transparent 25%),radial-gradient(circle at 95% 46%,rgba(184,119,63,.09),transparent 27%),var(--paper);font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);font-size:15px;line-height:1.55}
    a{color:inherit;text-decoration:none} img{display:block;max-width:100%} svg{display:block} .container{width:min(calc(100% - 48px),var(--container));margin:0 auto}
    .site-header{height:58px;background:rgba(255,253,248,.96);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50;backdrop-filter:blur(10px)} .site-header .container{height:100%;display:flex;align-items:center;gap:34px}
    .logo{font-family:"Cormorant Garamond",serif;font-size:36px;color:var(--gold);font-weight:600;letter-spacing:.01em;margin-right:auto} .logo span{font-size:24px} .nav{display:flex;gap:30px;font-size:11px;font-weight:600;color:#664f3e} .nav a.active{color:var(--gold)} .header-btn{height:38px;border-radius:8px;background:var(--gold);color:#fff;display:inline-flex;align-items:center;padding:0 22px;font-size:12px;font-weight:600}
    .hero{background:linear-gradient(90deg,#fffdf8 0%,#fffdf8 47%,#f2e5d4 100%);border-bottom:1px solid var(--line);overflow:hidden} .hero-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:34px;align-items:center;min-height:340px} .hero-content{padding:50px 0 43px} h1{font-family:"Cormorant Garamond",serif;font-size:60px;line-height:.98;font-weight:500;margin:0 0 18px;color:var(--ink)} .hero p{max-width:480px;color:#745d4b;margin:0 0 22px} .hero-img{height:330px;width:100%;object-fit:cover;object-position:center;border-bottom-left-radius:160px;filter:saturate(.95)}
    .btn-row{display:flex;gap:14px;flex-wrap:wrap} .btn{height:42px;border-radius:999px;border:1px solid #d0a577;display:inline-flex;align-items:center;gap:8px;padding:0 20px;font-size:12px;text-transform:uppercase;font-weight:600;color:var(--gold);background:#fffdf8} .btn.primary{background:var(--gold);color:#fff;border-color:var(--gold)} .btn svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
    .stats-wrap{margin-top:-18px;position:relative;z-index:3} .stats{background:rgba(255,253,248,.98);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);display:grid;grid-template-columns:repeat(4,1fr);overflow:hidden} .stat{display:flex;align-items:center;justify-content:center;gap:13px;padding:20px;border-right:1px solid var(--line)} .stat:last-child{border-right:0} .stat svg{width:29px;height:29px;stroke:var(--gold);fill:none;stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round} .stat strong{display:block;color:#a76b3a;font-size:20px} .stat span{display:block;color:#7d6a59;font-size:11px;line-height:1.25}
    .section{padding:54px 0;border-bottom:1px solid var(--line)} .solution-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:20px} .solution{position:relative;min-height:210px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fffdf8;box-shadow:var(--shadow)} .solution img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.58} .solution-content{position:relative;z-index:1;padding:25px 28px;max-width:73%} .solution h2,.section-title{font-family:"Cormorant Garamond",serif;font-size:34px;line-height:1.05;font-weight:500;margin:0 0 8px;color:#7b482c} .solution p{font-size:13px;color:#715f4f;margin:0 0 14px} .icon-row{display:flex;gap:9px;flex-wrap:wrap;margin:10px 0 14px} .chip{background:rgba(255,253,248,.9);border:1px solid var(--line);border-radius:8px;padding:8px 10px;min-width:58px;text-align:center;font-size:10px;color:#755d4a} .chip svg{width:22px;height:22px;margin:0 auto 4px;stroke:var(--gold);fill:none;stroke-width:1.6}
    .strengths{display:grid;grid-template-columns:repeat(5,1fr);gap:24px} .strength{background:#fffdf8;border:1px solid var(--line);border-radius:8px;text-align:center;padding:23px 18px;box-shadow:0 10px 24px rgba(88,61,38,.07)} .strength .ico{width:48px;height:48px;margin:0 auto 12px;display:grid;place-items:center;color:var(--gold)} .strength svg{width:36px;height:36px;stroke:currentColor;fill:none;stroke-width:1.45} .strength h3{font-size:14px;margin:0 0 7px;color:#65412b} .strength p{font-size:12px;margin:0;color:#7d6a59}
    .service-ecosystem{background:#fffdf8} .split-head{display:grid;grid-template-columns:210px 1fr;gap:24px;align-items:start} .split-head .section-title{font-size:31px} .mini-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:9px} .mini-card{background:#fff;border:1px solid var(--line);border-radius:7px;overflow:hidden;box-shadow:0 8px 18px rgba(90,61,36,.07)} .mini-card img{height:66px;width:100%;object-fit:cover} .mini-label{height:31px;display:flex;align-items:center;justify-content:center;gap:6px;font-size:11px;color:#664834} .mini-label span{width:17px;height:17px;color:var(--gold)} .mini-label svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.5}
    .two-column{display:grid;grid-template-columns:1fr 1fr;gap:18px} .panel{background:#fffdf8;border:1px solid var(--line);border-radius:10px;padding:18px;box-shadow:var(--shadow)} .panel h2{font-family:"Cormorant Garamond",serif;text-align:center;font-weight:500;color:#8a5734;font-size:30px;margin:0 0 12px} .panel .mini-grid{grid-template-columns:repeat(3,1fr)}
    .process .steps{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;position:relative} .steps:before{content:"";position:absolute;left:7%;right:7%;top:31px;height:1px;background:#d8b68c} .step{text-align:center;position:relative;z-index:1} .circle{width:58px;height:58px;border-radius:50%;background:#fffdf8;border:1px solid #d8b68c;margin:0 auto 10px;display:grid;place-items:center;color:var(--gold)} .circle svg{width:30px;height:30px;stroke:currentColor;fill:none;stroke-width:1.45} .step b{font-family:"Cormorant Garamond";font-size:20px;color:var(--gold);display:block} .step h3{font-size:12px;color:#654834;margin:4px 0 4px} .step p{font-size:11px;color:#7b6959;margin:0;line-height:1.35}
    .center-head{text-align:center;margin-bottom:24px} .center-head .section-title{font-size:32px} .tabs{display:flex;justify-content:center;gap:8px;margin:10px 0 14px;flex-wrap:wrap} .tabs span{font-size:10px;border:1px solid var(--line);border-radius:999px;padding:6px 18px;color:#755f4f} .tabs .active{background:var(--gold);border-color:var(--gold);color:#fff} .project-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:9px} .project-card{background:#fff;border:1px solid var(--line);border-radius:7px;overflow:hidden;text-align:center} .project-card img{height:78px;width:100%;object-fit:cover} .project-card h3{font-family:"Cormorant Garamond";font-size:16px;color:#633f29;margin:7px 5px 8px}
    .pricing{background:#fffdf8} .plans{display:grid;grid-template-columns:repeat(3,1fr);gap:26px} .plan{background:#fff;border:1px solid #ddbe98;border-radius:8px;padding:22px;text-align:center;box-shadow:0 10px 24px rgba(80,55,34,.06)} .plan.popular{border-color:var(--gold);box-shadow:0 0 0 2px rgba(184,119,63,.11)} .plan h3{font-family:"Cormorant Garamond";font-size:25px;margin:0;color:#80502f} .price{font-family:"Cormorant Garamond";font-size:30px;color:var(--gold);margin:5px 0 10px} .plan ul{list-style:none;margin:0 0 16px;padding:0;font-size:12px;color:#766451;display:grid;gap:5px} .plan li:before{content:"• ";color:var(--gold)}
    .testimonials{background:#fffdf8} .testimonial-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px} .quote-card{background:#fff;border:1px solid var(--line);border-radius:8px;padding:20px;box-shadow:0 10px 24px rgba(80,55,34,.06)} .quote-card .top{display:flex;align-items:center;gap:10px;margin-bottom:10px} .quote-card img{width:42px;height:42px;border-radius:50%;object-fit:cover} .quote-card strong{font-size:13px;color:#613f2c} .quote-card span{font-size:11px;color:#8c7a6b;display:block} .quote-card p{font-size:13px;color:#6d5c4f;margin:0 0 10px} .stars{color:#d8a14a;letter-spacing:2px;font-size:14px}
    .cta{background:linear-gradient(90deg,#e6d1b8,#fffdf8,#e4cfb4);position:relative;overflow:hidden;text-align:center} .cta .container{min-height:136px;display:grid;place-items:center;position:relative} .cta img.left{position:absolute;left:-60px;bottom:0;height:140px;opacity:.58} .cta img.right{position:absolute;right:-30px;bottom:0;height:140px;opacity:.55} .cta h2{font-family:"Cormorant Garamond";font-size:35px;color:#7a4a2d;font-weight:500;margin:0 0 10px}
    .footer{background:#fffdf8;padding:38px 0 20px;border-top:1px solid var(--line)} .footer-grid{display:grid;grid-template-columns:1.2fr repeat(5,1fr);gap:28px} .footer h3{font-family:"Cormorant Garamond";font-size:35px;color:var(--gold);font-weight:500;margin:0 0 10px} .footer h4{font-size:13px;text-transform:uppercase;color:#694a34;margin:0 0 12px} .footer p,.footer a{display:block;font-size:12px;color:#7a6858;margin:6px 0} .footer input{width:100%;height:36px;border:1px solid var(--line);border-radius:7px;background:#fff;padding:0 10px;margin-top:5px} .copyright{text-align:center;border-top:1px solid var(--line);margin-top:25px;padding-top:12px;color:#a08c78;font-size:12px}
    /* IMPLEMENTATION NOTES:
       - Every icon/symbol block is rebuilt with inline SVG graphics: stats, chips, strengths, service labels, process, cards, contact and arrows.
       - Raster crops from the uploaded screenshot are used for photo/mockup/project areas to preserve the visual direction.
       - Layout follows the supplied Studio.vn cream/caramel premium creative-platform design.
    */
    @media(max-width:1050px){.container{width:min(calc(100% - 30px),var(--container))}.site-header{height:auto}.site-header .container{flex-wrap:wrap;padding:12px 0}.nav{order:3;width:100%;justify-content:center;gap:14px;flex-wrap:wrap}.hero-grid,.solution-grid,.split-head,.two-column{grid-template-columns:1fr}.hero-img{height:300px;border-radius:0}.stats,.strengths,.mini-grid,.project-grid,.plans,.testimonial-grid,.footer-grid{grid-template-columns:repeat(2,1fr)}.process .steps{grid-template-columns:repeat(3,1fr)}.steps:before{display:none}}
    @media(max-width:560px){h1{font-size:40px}.section-title,.solution h2{font-size:28px}.stats,.strengths,.mini-grid,.project-grid,.plans,.testimonial-grid,.footer-grid,.panel .mini-grid,.process .steps{grid-template-columns:1fr}.section{padding:42px 0}.stat{border-right:0;border-bottom:1px solid var(--line)}}

/* WordPress integration fixes - keep original HTML visual language and font system */
.site-header .nav .menu, .site-header .nav ul{display:flex;gap:30px;list-style:none;margin:0;padding:0;align-items:center}
.site-header .nav li{margin:0;padding:0}
.site-header .nav a[aria-current="page"], .site-header .nav .current-menu-item>a{color:var(--gold)}
.logo, .logo:visited{font-family:"Cormorant Garamond",serif;color:var(--gold)}
.footer a svg{width:14px;height:14px;display:inline-block;vertical-align:-2px;margin-right:6px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.wp-site-blocks, .stmn-page{background:transparent}
.stmn-page-hero{padding:54px 0 28px;border-bottom:1px solid var(--line);background:linear-gradient(90deg,#fffdf8 0%,#fffdf8 55%,#f2e5d4 100%)}
.stmn-page-hero h1{font-family:"Cormorant Garamond",serif;font-size:48px;line-height:1.02;font-weight:500;margin:0;color:var(--ink)}
.stmn-page-content{padding:44px 0}
.stmn-content-card{background:#fffdf8;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:28px;color:#6d5c4f}
.stmn-content-card h1,.stmn-content-card h2,.stmn-content-card h3,.entry-title{font-family:"Cormorant Garamond",serif;font-weight:500;color:#7b482c}
.stmn-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:28px;align-items:start}
.stmn-sidebar{position:sticky;top:82px;background:#fffdf8;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:20px}
.stmn-sidebar h3{font-family:"Cormorant Garamond",serif;font-size:25px;font-weight:500;color:#80502f;margin:0 0 12px}
.stmn-card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.stmn-card{background:#fffdf8;border:1px solid var(--line);border-radius:10px;overflow:hidden;box-shadow:0 10px 24px rgba(80,55,34,.06)}
.stmn-card img{width:100%;height:170px;object-fit:cover;background:#f2e5d4}
.stmn-card-body{padding:16px}
.stmn-card h2,.stmn-card h3{font-family:"Cormorant Garamond",serif;font-size:24px;font-weight:500;margin:0 0 8px;color:#80502f}
.stmn-meta{font-size:12px;color:var(--gold);font-weight:600;text-transform:uppercase;letter-spacing:.03em;margin-bottom:7px}
.stmn-pagination{margin-top:28px;display:flex;gap:8px;flex-wrap:wrap}
.stmn-pagination a,.stmn-pagination span{border:1px solid var(--line);border-radius:999px;padding:8px 14px;background:#fffdf8;color:#765c45}
.stmn-pagination .current{background:var(--gold);color:#fff;border-color:var(--gold)}
.stmn-search-form{display:flex;gap:8px;margin-bottom:18px}
.stmn-search-form input{height:42px;border:1px solid var(--line);border-radius:8px;background:#fff;padding:0 12px;min-width:0;flex:1}
.stmn-search-form button{border:0;border-radius:8px;background:var(--gold);color:#fff;padding:0 16px;font-weight:600}
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product{background:#fffdf8;border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 24px rgba(80,55,34,.06);padding:12px;text-align:center}
.woocommerce ul.products li.product .button{display:none}
.woocommerce div.product .product_title{font-family:"Cormorant Garamond",serif;font-weight:500;color:#7b482c}
@media(max-width:1050px){.site-header .nav .menu,.site-header .nav ul{gap:14px;flex-wrap:wrap;justify-content:center}.stmn-layout{grid-template-columns:1fr}.stmn-sidebar{position:static}.stmn-card-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.stmn-card-grid{grid-template-columns:repeat(2,1fr);gap:12px}.stmn-card img{height:120px}.stmn-card-body{padding:12px}.stmn-card h2,.stmn-card h3{font-size:20px}.stmn-page-hero h1{font-size:38px}}

/* === v1.0.1: Fixed WordPress multi-level menu (level 2/3) === */
.site-header{overflow:visible;}
.site-header .container{position:relative;}
.site-header .nav{display:flex;align-items:center;gap:0;position:relative;z-index:9999;overflow:visible;}
.site-header .nav ul,.site-header .nav li{list-style:none;margin:0;padding:0;}
.site-header .nav > ul.primary-menu{display:flex;align-items:center;gap:0;list-style:none;margin:0;padding:0;}
.site-header .nav > ul.primary-menu > li{position:relative;display:flex;align-items:center;}
.site-header .nav > ul.primary-menu > li > a{height:58px;display:flex;align-items:center;padding:0 12px;font-size:11px;font-weight:600;line-height:1;color:#664f3e;white-space:nowrap;}
.site-header .nav > ul.primary-menu > li:hover > a,.site-header .nav > ul.primary-menu > li:focus-within > a,.site-header .nav .current-menu-item>a,.site-header .nav .current-menu-ancestor>a{color:var(--gold);}
.site-header .nav .menu-item-has-children > a::after{content:"";width:6px;height:6px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg);margin-left:7px;margin-top:-3px;opacity:.7;flex:0 0 auto;}
.site-header .nav .sub-menu{display:block!important;position:absolute;top:100%;left:0;min-width:230px;background:rgba(255,253,248,.98);border:1px solid var(--line);border-radius:12px;box-shadow:0 18px 42px rgba(108,72,39,.16);padding:8px;opacity:0;visibility:hidden;transform:translateY(10px);pointer-events:none;transition:opacity .16s ease,transform .16s ease,visibility .16s ease;z-index:10000;}
.site-header .nav li:hover>.sub-menu,.site-header .nav li:focus-within>.sub-menu{opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto;}
.site-header .nav .sub-menu li{position:relative;display:block;width:100%;}
.site-header .nav .sub-menu a{height:auto;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 12px;border-radius:8px;color:#664f3e;font-size:12px;font-weight:500;line-height:1.35;white-space:normal;min-width:0;}
.site-header .nav .sub-menu a:hover{background:#f7ebdc;color:var(--gold);}
.site-header .nav .sub-menu .menu-item-has-children>a::after{transform:rotate(-45deg);margin-left:auto;margin-top:0;}
.site-header .nav .sub-menu .sub-menu{top:-9px;left:calc(100% + 10px);}
.site-header .nav .sub-menu .sub-menu::before{content:"";position:absolute;left:-12px;top:0;width:12px;height:100%;}
.stmn-mobile-menu-toggle{display:none;border:1px solid var(--line);background:#fffdf8;color:var(--ink);border-radius:8px;width:42px;height:38px;align-items:center;justify-content:center;gap:4px;flex-direction:column;cursor:pointer;}
.stmn-mobile-menu-toggle span{display:block;width:18px;height:2px;background:currentColor;border-radius:999px;}
@media(max-width:1050px){.site-header{height:auto}.site-header .container{gap:12px}.stmn-mobile-menu-toggle{display:inline-flex;margin-left:auto}.site-header .header-btn{margin-left:0}.site-header .nav{order:4;width:100%;display:none}body.stmn-menu-open .site-header .nav{display:block}.site-header .nav>ul.primary-menu{display:block;width:100%;background:#fffdf8;border:1px solid var(--line);border-radius:12px;padding:8px;margin-top:2px;box-shadow:0 12px 28px rgba(108,72,39,.10)}.site-header .nav>ul.primary-menu>li{display:block;width:100%}.site-header .nav>ul.primary-menu>li>a{height:auto;padding:12px;border-radius:8px;font-size:12px;justify-content:space-between}.site-header .nav>ul.primary-menu>li>a:hover{background:#f7ebdc}.site-header .nav .sub-menu,.site-header .nav .sub-menu .sub-menu{position:static;top:auto;left:auto;min-width:0;width:100%;box-shadow:none;border:0;border-left:1px solid var(--line);border-radius:0;background:transparent;padding:0 0 0 12px;margin:0 0 4px 10px;opacity:1;visibility:visible;transform:none;pointer-events:auto;display:none!important}.site-header .nav li.stmn-submenu-open>.sub-menu{display:block!important}.site-header .nav .sub-menu a{font-size:12px;padding:10px 12px}.site-header .nav .menu-item-has-children>a::after{transform:rotate(45deg)}.site-header .nav li.stmn-submenu-open>a::after{transform:rotate(225deg);margin-top:3px}}
@media(max-width:560px){.site-header .container{padding:10px 0}.logo{font-size:32px}.header-btn{height:36px;padding:0 14px;font-size:11px}}
